@@ -172,7 +202,8 @@ const componentMap: componentMapType = {
NOTIFIARR:
,
TELEGRAM:
,
PUSHOVER:
,
- GOTIFY:
+ GOTIFY:
,
+ LUNASEA:
};
interface NotificationAddFormValues {
diff --git a/web/src/screens/settings/Notifications.tsx b/web/src/screens/settings/Notifications.tsx
index 3092b6c..41120cc 100644
--- a/web/src/screens/settings/Notifications.tsx
+++ b/web/src/screens/settings/Notifications.tsx
@@ -15,6 +15,7 @@ import toast from "react-hot-toast";
import { Section } from "./_components";
import { PlusIcon } from "@heroicons/react/24/solid";
import { Checkbox } from "@components/Checkbox";
+import { DiscordIcon, GotifyIcon, LunaSeaIcon, NotifiarrIcon, PushoverIcon, TelegramIcon } from "./_components";
export const notificationKeys = {
all: ["notifications"] as const,
@@ -68,44 +69,14 @@ function NotificationSettings() {
);
}
-
-const DiscordIcon = () => (
-
-
-
-);
-
-const TelegramIcon = () => (
-
-
-
-);
-
-const PushoverIcon = () => (
-
-
-
-);
-
-const GotifyIcon = () => (
-
-
-
-);
-
-
+const iconStyle = "flex items-center px-2 py-0.5 rounded bg-gray-200 dark:bg-gray-700 text-gray-800 dark:text-gray-400";
const iconComponentMap: componentMapType = {
- DISCORD:
Discord,
- NOTIFIARR:
Notifiarr,
- TELEGRAM:
Telegram,
- PUSHOVER:
Pushover,
- GOTIFY:
Gotify
+ DISCORD:
Discord,
+ NOTIFIARR:
Notifiarr,
+ TELEGRAM:
Telegram,
+ PUSHOVER:
Pushover,
+ GOTIFY:
Gotify,
+ LUNASEA:
LunaSea
};
interface ListItemProps {
diff --git a/web/src/screens/settings/_components.tsx b/web/src/screens/settings/_components.tsx
index b649405..125b8f2 100644
--- a/web/src/screens/settings/_components.tsx
+++ b/web/src/screens/settings/_components.tsx
@@ -4,6 +4,7 @@
*/
import { classNames } from "@utils";
+import { SVGProps } from "react";
type SectionProps = {
title: string;
@@ -82,3 +83,46 @@ export const RowItem = ({
);
+
+const commonSVGProps: SVGProps