public/immich
1
0
Fork 0
mirror of https://github.com/immich-app/immich.git synced 2025-12-16 13:33:43 +09:00
Code Issues Actions 8 Packages Projects Releases Wiki Activity

feat(web): render component in notifications (#10990)

Browse Source
This commit is contained in:
Michel Heusschen
2024-07-10 16:05:04 +02:00
committed by GitHub
parent 1dd1d36120
commit 59aa347912
9 changed files with 88 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
web/src/lib/components/shared-components/notification/notification.ts
View File

@@ -1,3 +1,4 @@
import type { ComponentProps, ComponentType, SvelteComponent } from 'svelte';
import { writable } from 'svelte/store';
export enum NotificationType {
@@ -15,11 +16,6 @@ export type Notification = {
id: number;
type: NotificationType;
message: string;
/**
* Allow HTML to be inserted within the message. Make sure to verify/encode
* variables that may be interpoalted into 'message'
*/
html?: boolean;
/** The action to take when the notification is clicked */
action: NotificationAction;
button?: NotificationButton;
@@ -32,13 +28,37 @@ type NoopAction = { type: 'noop' };
export type NotificationAction = DiscardAction | NoopAction;
export type NotificationOptions = Partial<Exclude<Notification, 'id'>> & { message: string };
type Component<T extends ComponentType> = {
type: T;
props: ComponentProps<InstanceType<T>>;
};
type BaseNotificationOptions<T, R extends keyof T> = Partial<Omit<T, 'id'>> & Pick<T, R>;
export type NotificationOptions = BaseNotificationOptions<Notification, 'message'>;
export type ComponentNotificationOptions<T extends ComponentType> = BaseNotificationOptions<
ComponentNotification<T>,
'component'
>;
export type ComponentNotification<T extends ComponentType = ComponentType<SvelteComponent>> = Omit<
Notification,
'message'
> & {
component: Component<T>;
};
export const isComponentNotification = <T extends ComponentType>(
notification: Notification | ComponentNotification<T>,
): notification is ComponentNotification<T> => {
return 'component' in notification;
};
function createNotificationList() {
const notificationList = writable<Notification[]>([]);
const notificationList = writable<(Notification | ComponentNotification)[]>([]);
let count = 1;
const show = (options: NotificationOptions) => {
const show = <T>(options: T extends ComponentType ? ComponentNotificationOptions<T> : NotificationOptions) => {
notificationList.update((currentList) => {
currentList.push({
id: count++,