From ff316255440b232259cd5bc59ab4d96ddbeb0ab9 Mon Sep 17 00:00:00 2001 From: TheThomaas Date: Mon, 26 Jan 2026 15:36:00 +0100 Subject: [PATCH] Create toast system --- package-lock.json | 16 ++++-- package.json | 3 +- src/main/lib/Toast.ts | 51 ++++++++++++++++++++ src/renderer/src/App.tsx | 3 ++ src/renderer/src/components/ToastHandler.tsx | 34 +++++++++++++ src/renderer/src/components/handleToasts.ts | 31 ++++++++++++ 6 files changed, 133 insertions(+), 5 deletions(-) create mode 100644 src/main/lib/Toast.ts create mode 100644 src/renderer/src/components/ToastHandler.tsx create mode 100644 src/renderer/src/components/handleToasts.ts diff --git a/package-lock.json b/package-lock.json index 57542a5..0da8cee 100644 --- a/package-lock.json +++ b/package-lock.json @@ -11,7 +11,8 @@ "dependencies": { "@electron-toolkit/preload": "^3.0.2", "@electron-toolkit/utils": "^4.0.0", - "electron-updater": "^6.3.9" + "electron-updater": "^6.3.9", + "sonner": "^2.0.7" }, "devDependencies": { "@electron-toolkit/eslint-config-prettier": "^3.0.0", @@ -7845,7 +7846,6 @@ "version": "19.2.3", "resolved": "https://registry.npmjs.org/react/-/react-19.2.3.tgz", "integrity": "sha512-Ku/hhYbVjOQnXDZFv2+RibmLFGwFdeeKHFcOTlrt7xplBnya5OGn/hIRDsqDiSUcfORsDC7MPxwork8jBwsIWA==", - "dev": true, "license": "MIT", "engines": { "node": ">=0.10.0" @@ -7855,7 +7855,6 @@ "version": "19.2.3", "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-19.2.3.tgz", "integrity": "sha512-yELu4WmLPw5Mr/lmeEpox5rw3RETacE++JgHqQzd2dg+YbJuat3jH4ingc+WPZhxaoFzdv9y33G+F7Nl5O0GBg==", - "dev": true, "license": "MIT", "dependencies": { "scheduler": "^0.27.0" @@ -8235,7 +8234,6 @@ "version": "0.27.0", "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.27.0.tgz", "integrity": "sha512-eNv+WrVbKu1f3vbYJT/xtiF5syA5HPIMtf9IgY/nKg0sWqzAUEvqY/xm7OcZc/qafLx/iO9FgOmeSAp4v5ti/Q==", - "dev": true, "license": "MIT" }, "node_modules/semver": { @@ -8508,6 +8506,16 @@ "node": ">= 14" } }, + "node_modules/sonner": { + "version": "2.0.7", + "resolved": "https://registry.npmjs.org/sonner/-/sonner-2.0.7.tgz", + "integrity": "sha512-W6ZN4p58k8aDKA4XPcx2hpIQXBRAgyiWVkYhT7CvK6D3iAu7xjvVyhQHg2/iaKJZ1XVJ4r7XuwGL+WGEK37i9w==", + "license": "MIT", + "peerDependencies": { + "react": "^18.0.0 || ^19.0.0 || ^19.0.0-rc", + "react-dom": "^18.0.0 || ^19.0.0 || ^19.0.0-rc" + } + }, "node_modules/source-map": { "version": "0.6.1", "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz", diff --git a/package.json b/package.json index 44f881e..bc6e14c 100644 --- a/package.json +++ b/package.json @@ -24,7 +24,8 @@ "dependencies": { "@electron-toolkit/preload": "^3.0.2", "@electron-toolkit/utils": "^4.0.0", - "electron-updater": "^6.3.9" + "electron-updater": "^6.3.9", + "sonner": "^2.0.7" }, "devDependencies": { "@electron-toolkit/eslint-config-prettier": "^3.0.0", diff --git a/src/main/lib/Toast.ts b/src/main/lib/Toast.ts new file mode 100644 index 0000000..5b5f434 --- /dev/null +++ b/src/main/lib/Toast.ts @@ -0,0 +1,51 @@ +import { BrowserWindow } from 'electron'; + +export type ToastType = 'default' | 'info' | 'success' | 'warning' | 'error'; +export interface Toast { + type: 'toast'; + payload: { + toastType: ToastType; + message: string; + options?: { + duration?: number; + [key: string]: any; + }; + }; +} + +let toastTarget: BrowserWindow | null = null; +export function registerToastTarget(win: BrowserWindow) { + toastTarget = win; +} + +function sendToast(toastType: ToastType, message: string, options?: object): void { + if (!toastTarget) { + console.warn('No target window registered for toasts.'); + return; + } + + let optionsJSON; + if (options) { + optionsJSON = JSON.stringify(options); + } + toastTarget.webContents.send('toast', { + type: 'toast', + payload: { toastType, message, optionsJSON }, + }); +} + +export function showToast(message: string, options?: object): void { + return sendToast('default', message, options) +} +export function showInformationToast(message: string, options?: object): void { + return sendToast('info', message, options) +} +export function showSuccessToast(message: string, options?: object): void { + return sendToast('success', message, options) +} +export function showWarningToast(message: string, options?: object): void { + return sendToast('warning', message, options) +} +export function showErrorToast(message: string, options?: object): void { + return sendToast('error', message, options) +} \ No newline at end of file diff --git a/src/renderer/src/App.tsx b/src/renderer/src/App.tsx index 73de51c..2e336bd 100644 --- a/src/renderer/src/App.tsx +++ b/src/renderer/src/App.tsx @@ -1,5 +1,6 @@ import Versions from './components/Versions' import electronLogo from './assets/electron.svg' +import ToastHandler from './components/ToastHandler' function App(): React.JSX.Element { const ipcHandle = (): void => window.electron.ipcRenderer.send('ping') @@ -28,6 +29,8 @@ function App(): React.JSX.Element { + + ) } diff --git a/src/renderer/src/components/ToastHandler.tsx b/src/renderer/src/components/ToastHandler.tsx new file mode 100644 index 0000000..99f50c4 --- /dev/null +++ b/src/renderer/src/components/ToastHandler.tsx @@ -0,0 +1,34 @@ +import { useEffect } from "react"; +import { handleToast, Toast } from "./handleToasts"; +import { Toaster } from 'sonner'; + +function ToastHandler(): React.JSX.Element { + useEffect(() => { + const listener = (_: any, toast: Toast) => { + handleToast(toast); + }; + + // @ts-ignore (define in dts) + window.electron.ipcRenderer.on('toast', listener); + + return () => { + // @ts-ignore (define in dts) + window.electron.ipcRenderer.removeAllListeners('toast'); + }; + }, []); + + return ( + + ) + +} + +export default ToastHandler \ No newline at end of file diff --git a/src/renderer/src/components/handleToasts.ts b/src/renderer/src/components/handleToasts.ts new file mode 100644 index 0000000..8f69d87 --- /dev/null +++ b/src/renderer/src/components/handleToasts.ts @@ -0,0 +1,31 @@ +import { toast as sonnerToast } from 'sonner'; + +export type Toast = { + type: 'toast'; + payload: { + toastType: 'default' | 'info' | 'success' | 'warning' | 'error'; + message: string; + optionsJSON?: string; + options?: object; + }; +}; + +export function handleToast(toast: Toast) { + if (toast.type === 'toast') { + const { toastType, message, optionsJSON } = toast.payload; + // @ts-ignore + let options; + if (optionsJSON) { + options = JSON.parse(optionsJSON); + } + if (toastType == 'default') { + sonnerToast(message, options); + } else if (['info', 'success', 'warning', 'error'].includes(toastType)) { + sonnerToast[toastType](message, options); + } else { + console.warn('Type de toast invalide :', toastType); + } + } else { + console.warn('toast inconnue :', toast); + } +} \ No newline at end of file