From 767cde8f25a247c5c9e3769e32a77537e9f820b4 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E8=8D=89=E9=9E=8B=E6=B2=A1=E5=8F=B7?= <308487730@qq.com> Date: Thu, 12 Oct 2023 09:49:24 +0800 Subject: [PATCH] refactor: remove update-tailwind --- .../update-tailwind/Modal/index.tsx | 87 ---------- .../update-tailwind/Progress/index.tsx | 25 --- src/components/update-tailwind/README.md | 25 --- src/components/update-tailwind/index.tsx | 148 ------------------ src/components/update-tailwind/tailwind.css | 3 - src/components/update/Modal/modal.css | 2 +- 6 files changed, 1 insertion(+), 289 deletions(-) delete mode 100644 src/components/update-tailwind/Modal/index.tsx delete mode 100644 src/components/update-tailwind/Progress/index.tsx delete mode 100644 src/components/update-tailwind/README.md delete mode 100644 src/components/update-tailwind/index.tsx delete mode 100644 src/components/update-tailwind/tailwind.css diff --git a/src/components/update-tailwind/Modal/index.tsx b/src/components/update-tailwind/Modal/index.tsx deleted file mode 100644 index b04f4f6..0000000 --- a/src/components/update-tailwind/Modal/index.tsx +++ /dev/null @@ -1,87 +0,0 @@ -import React, { ReactNode } from "react"; -import { createPortal } from "react-dom"; - -const ModalTemplate: React.FC< - React.PropsWithChildren<{ - title?: ReactNode; - footer?: ReactNode; - cancelText?: string; - okText?: string; - onCancel?: () => void; - onOk?: () => void; - width?: number; - }> -> = (props) => { - const { - title, - children, - footer, - cancelText = "Cancel", - okText = "OK", - onCancel, - onOk, - width = 530, - } = props; - - return ( -
-
-
-
-
-
{title}
- - - - - -
-
{children}
- {typeof footer !== "undefined" ? ( -
- - -
- ) : ( - footer - )} -
-
-
- ); -}; - -const Modal = ( - props: Parameters[0] & { open: boolean }, -) => { - const { open, ...omit } = props; - - return createPortal(open ? ModalTemplate(omit) : null, document.body); -}; - -export default Modal; diff --git a/src/components/update-tailwind/Progress/index.tsx b/src/components/update-tailwind/Progress/index.tsx deleted file mode 100644 index 5912399..0000000 --- a/src/components/update-tailwind/Progress/index.tsx +++ /dev/null @@ -1,25 +0,0 @@ -import React from "react"; - -const Progress: React.FC< - React.PropsWithChildren<{ - percent?: number; - }> -> = (props) => { - const { percent = 0 } = props; - - return ( -
-
-
-
- - {(percent ?? 0).toString().substring(0, 4)}% - -
- ); -}; - -export default Progress; diff --git a/src/components/update-tailwind/README.md b/src/components/update-tailwind/README.md deleted file mode 100644 index e2a0be3..0000000 --- a/src/components/update-tailwind/README.md +++ /dev/null @@ -1,25 +0,0 @@ -# electron-updater-tailwindcss - -[tailwindcss docs](https://tailwindcss.com/). - - -## If you don't want to use tailwindcss, want to use the default css style: - -[`` Written entirely in CSS](../update/) - -### remove dependencies: -```diff -- autoprefixer -- tailwindcss -``` -### remove files: -```diff -- postcss.config.cjs -- tailwind.config.cjs -``` -### remove import: -```diff -//src/main.tsx -- import "@/components/update-tailwind/tailwind.css"; -``` - diff --git a/src/components/update-tailwind/index.tsx b/src/components/update-tailwind/index.tsx deleted file mode 100644 index 11ceafb..0000000 --- a/src/components/update-tailwind/index.tsx +++ /dev/null @@ -1,148 +0,0 @@ -import { ipcRenderer } from "electron"; -import type { ProgressInfo } from "electron-updater"; -import { useCallback, useEffect, useState } from "react"; -import Modal from "@/components/update-tailwind/Modal"; -import Progress from "@/components/update-tailwind/Progress"; - -const UpdateElectron = () => { - const [checking, setChecking] = useState(false); - const [updateAvailable, setUpdateAvailable] = useState(false); - const [versionInfo, setVersionInfo] = useState(); - const [updateError, setUpdateError] = useState(); - const [progressInfo, setProgressInfo] = useState>(); - const [modalOpen, setModalOpen] = useState(false); - const [modalBtn, setModalBtn] = useState<{ - cancelText?: string; - okText?: string; - onCancel?: () => void; - onOk?: () => void; - }>({ - onCancel: () => setModalOpen(false), - onOk: () => ipcRenderer.invoke("start-download"), - }); - - const checkUpdate = async () => { - setChecking(true); - /** - * @type {import('electron-updater').UpdateCheckResult | null | { message: string, error: Error }} - */ - const result = await ipcRenderer.invoke("check-update"); - setProgressInfo({ percent: 0 }); - setChecking(false); - setModalOpen(true); - if (result?.error) { - setUpdateAvailable(false); - setUpdateError(result?.error); - } - }; - - const onUpdateCanAvailable = useCallback( - (_event: Electron.IpcRendererEvent, arg1: VersionInfo) => { - setVersionInfo(arg1); - setUpdateError(undefined); - // Can be update - if (arg1.update) { - setModalBtn((state) => ({ - ...state, - cancelText: "Cancel", - okText: "Update", - onOk: () => ipcRenderer.invoke("start-download"), - })); - setUpdateAvailable(true); - } else { - setUpdateAvailable(false); - } - }, - [], - ); - - const onUpdateError = useCallback( - (_event: Electron.IpcRendererEvent, arg1: ErrorType) => { - setUpdateAvailable(false); - setUpdateError(arg1); - }, - [], - ); - - const onDownloadProgress = useCallback( - (_event: Electron.IpcRendererEvent, arg1: ProgressInfo) => { - setProgressInfo(arg1); - }, - [], - ); - - const onUpdateDownloaded = useCallback( - (_event: Electron.IpcRendererEvent, ...args: any[]) => { - setProgressInfo({ percent: 100 }); - setModalBtn((state) => ({ - ...state, - cancelText: "Later", - okText: "Install now", - onOk: () => ipcRenderer.invoke("quit-and-install"), - })); - }, - [], - ); - - useEffect(() => { - // Get version information and whether to update - ipcRenderer.on("update-can-available", onUpdateCanAvailable); - ipcRenderer.on("update-error", onUpdateError); - ipcRenderer.on("download-progress", onDownloadProgress); - ipcRenderer.on("update-downloaded", onUpdateDownloaded); - - return () => { - ipcRenderer.off("update-can-available", onUpdateCanAvailable); - ipcRenderer.off("update-error", onUpdateError); - ipcRenderer.off("download-progress", onDownloadProgress); - ipcRenderer.off("update-downloaded", onUpdateDownloaded); - }; - }, []); - - return ( - <> - -
- {updateError ? ( -
-

Error downloading the latest version.

-

{updateError.message}

-
- ) : updateAvailable ? ( -
-
The last version is: v{versionInfo?.newVersion}
-
- v{versionInfo?.version} -> v{versionInfo?.newVersion} -
-
-
Update progress:
-
- -
-
-
- ) : ( -
- {JSON.stringify(versionInfo ?? {}, null, 2)} -
- )} -
- - - - ); -}; - -export default UpdateElectron; diff --git a/src/components/update-tailwind/tailwind.css b/src/components/update-tailwind/tailwind.css deleted file mode 100644 index bd6213e..0000000 --- a/src/components/update-tailwind/tailwind.css +++ /dev/null @@ -1,3 +0,0 @@ -@tailwind base; -@tailwind components; -@tailwind utilities; \ No newline at end of file diff --git a/src/components/update/Modal/modal.css b/src/components/update/Modal/modal.css index d34178b..d52cacb 100644 --- a/src/components/update/Modal/modal.css +++ b/src/components/update/Modal/modal.css @@ -60,7 +60,7 @@ padding: 10px; background-color: #fff; display: flex; - justify-content: end; + justify-content: flex-end; button { padding: 7px 11px;