Skip to content

Commit

Permalink
change announcements to be stack
Browse files Browse the repository at this point in the history
  • Loading branch information
beebls committed Sep 14, 2024
1 parent af9c2ec commit 5b9613c
Show file tree
Hide file tree
Showing 2 changed files with 19 additions and 21 deletions.
34 changes: 16 additions & 18 deletions frontend/src/components/AnnouncementsDisplay.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ import { DialogButton, Focusable, PanelSection } from '@decky/ui';
import { useEffect, useMemo, useState } from 'react';
import { FaTimes } from 'react-icons/fa';

import { Announcement, getLatestAnnouncement } from '../store';
import { Announcement, getAnnouncements } from '../store';
import { useSetting } from '../utils/hooks/useSetting';

const SEVERITIES = {
Expand All @@ -29,36 +29,34 @@ const welcomeAnnouncement: Announcement = {
};

export function AnnouncementsDisplay() {
const [announcement, setAnnouncement] = useState<Announcement | null>(null);
const [announcements, setAnnouncements] = useState<Announcement[]>([]);
// showWelcome will display a welcome motd, the welcome motd has an id of "welcome" and once that is saved to hiddenMotdId, it will not show again
const [hiddenAnnouncementIds, setHiddenAnnouncementIds] = useSetting<string[]>('hiddenAnnouncementIds', []);

async function fetchAnnouncement() {
const announcement = await getLatestAnnouncement();
announcement && setAnnouncement(announcement);
const announcements = await getAnnouncements();
announcements && setAnnouncements((oldAnnouncements) => [...announcements, ...oldAnnouncements]);
}

useEffect(() => {
void fetchAnnouncement();
}, []);
useEffect(() => {
if (hiddenAnnouncementIds.length > 0) {
setAnnouncement(welcomeAnnouncement);
setAnnouncements((oldAnnouncement) => [welcomeAnnouncement, ...oldAnnouncement]);
}
}, [hiddenAnnouncementIds]);

function hideAnnouncement() {
if (announcement) {
setHiddenAnnouncementIds([...hiddenAnnouncementIds, announcement.id]);
void fetchAnnouncement();
}
}
const currentlyDisplayingAnnouncement: Announcement | null = useMemo(() => {
return announcements.find((announcement) => !hiddenAnnouncementIds.includes(announcement.id)) || null;
}, [announcements, hiddenAnnouncementIds]);

const hidden = useMemo(() => {
return !announcement?.id || hiddenAnnouncementIds.includes(announcement.id);
}, [hiddenAnnouncementIds, announcement]);
function hideAnnouncement(id: string) {
setHiddenAnnouncementIds([...hiddenAnnouncementIds, id]);
void fetchAnnouncement();
}

if (!announcement || !announcement.title || hidden) {
if (!currentlyDisplayingAnnouncement) {
return null;
}

Expand All @@ -82,7 +80,7 @@ export function AnnouncementsDisplay() {
}}
>
<div style={{ display: 'flex', justifyContent: 'space-between' }}>
<span style={{ fontWeight: 'bold' }}>{announcement.title}</span>
<span style={{ fontWeight: 'bold' }}>{currentlyDisplayingAnnouncement.title}</span>
<DialogButton
style={{
width: '1rem',
Expand All @@ -96,7 +94,7 @@ export function AnnouncementsDisplay() {
top: '.75rem',
right: '.75rem',
}}
onClick={hideAnnouncement}
onClick={() => hideAnnouncement(currentlyDisplayingAnnouncement.id)}
>
<FaTimes
style={{
Expand All @@ -105,7 +103,7 @@ export function AnnouncementsDisplay() {
/>
</DialogButton>
</div>
<span style={{ fontSize: '0.75rem', whiteSpace: 'pre-line' }}>{announcement.text}</span>
<span style={{ fontSize: '0.75rem', whiteSpace: 'pre-line' }}>{currentlyDisplayingAnnouncement.text}</span>
</Focusable>
</PanelSection>
);
Expand Down
6 changes: 3 additions & 3 deletions frontend/src/store.ts
Original file line number Diff line number Diff line change
Expand Up @@ -55,7 +55,7 @@ export async function getStore(): Promise<Store> {
return await getSetting<Store>('store', Store.Default);
}

export async function getLatestAnnouncement(): Promise<Announcement | null> {
export async function getAnnouncements(): Promise<Announcement[]> {
let version = await window.DeckyPluginLoader.updateVersion();
let store = await getSetting<Store | null>('store', null);
let customURL = await getSetting<string>(
Expand Down Expand Up @@ -91,9 +91,9 @@ export async function getLatestAnnouncement(): Promise<Announcement | null> {
'X-Decky-Version': version.current,
},
});
if (res.status !== 200) return null;
if (res.status !== 200) return [];
const json = await res.json();
return json?.[0] ?? null;
return json ?? [];
}

export async function getPluginList(
Expand Down

0 comments on commit 5b9613c

Please sign in to comment.