50 lines
1.5 kB
1
import React from "@moonlight-mod/wp/react";
2
import Dispatcher from "@moonlight-mod/wp/discord/Dispatcher";
3
import { Notice, NoticeCloseButton, PrimaryCTANoticeButton } from "@moonlight-mod/wp/discord/components/common/index";
4
import { useStateFromStoresObject } from "@moonlight-mod/wp/discord/packages/flux";
5
import NoticesStore from "@moonlight-mod/wp/notices_notices";
6
import type { Notice as NoticeType } from "@moonlight-mod/types/coreExtensions/notices";
7
8
function popAndDismiss(notice: NoticeType) {
9
NoticesStore.popNotice();
10
if (notice?.onDismiss) {
11
notice.onDismiss();
12
}
13
if (!NoticesStore.shouldShowNotice()) {
14
Dispatcher.dispatch({
15
type: "NOTICE_DISMISS"
16
});
17
}
18
}
19
20
export default function UpdateNotice() {
21
const { notice } = useStateFromStoresObject([NoticesStore], () => ({
22
notice: NoticesStore.getCurrentNotice()
23
}));
24
25
if (notice == null) return <></>;
26
27
return (
28
<Notice color={notice.color}>
29
{notice.element}
30
31
{(notice.showClose ?? true) && (
32
<NoticeCloseButton onClick={() => popAndDismiss(notice)} noticeType="__moonlight_notice" />
33
)}
34
35
{(notice.buttons ?? []).map((button) => (
36
<PrimaryCTANoticeButton
37
key={button.name}
38
onClick={() => {
39
if (button.onClick()) {
40
popAndDismiss(notice);
41
}
42
}}
43
noticeType="__moonlight_notice"
44
>
45
{button.name}
46
</PrimaryCTANoticeButton>
47
))}
48
</Notice>
49
);
50
}
51