diff --git a/bun.lockb b/bun.lockb
index be521dc..c00601c 100755
Binary files a/bun.lockb and b/bun.lockb differ
diff --git a/package.json b/package.json
index 4cdca57..580812e 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
{
"name": "nazha-dashboard-vite",
"private": true,
- "version": "0.0.0",
+ "version": "1.0.0",
"type": "module",
"scripts": {
"dev": "vite",
@@ -45,7 +45,7 @@
"devDependencies": {
"@eslint/js": "^9.16.0",
"@types/node": "^22.10.1",
- "@types/react": "^18.3.12",
+ "@types/react": "^18.3.13",
"@types/react-dom": "^18.3.1",
"@vitejs/plugin-react-swc": "^3.7.2",
"autoprefixer": "^10.4.20",
diff --git a/src/App.tsx b/src/App.tsx
index ea1ed0b..e2abea1 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -6,6 +6,7 @@ import Server from "./pages/Server";
import ServerDetail from "./pages/ServerDetail";
import NotFound from "./pages/NotFound";
import ErrorPage from "./pages/ErrorPage";
+import ReloadPrompt from "./components/ReloadPrompt";
const App: React.FC = () => {
return (
@@ -20,6 +21,7 @@ const App: React.FC = () => {
} />
+
diff --git a/src/components/ReloadPrompt.tsx b/src/components/ReloadPrompt.tsx
new file mode 100644
index 0000000..a20c02d
--- /dev/null
+++ b/src/components/ReloadPrompt.tsx
@@ -0,0 +1,52 @@
+import { useRegisterSW } from 'virtual:pwa-register/react';
+import { useTranslation } from 'react-i18next';
+import { toast } from 'sonner';
+
+function ReloadPrompt() {
+ const { t } = useTranslation();
+
+ const {
+ needRefresh: [needRefresh, setNeedRefresh],
+ updateServiceWorker,
+ } = useRegisterSW({
+ onRegisteredSW(swUrl) {
+ console.log(`SW Registered: ${swUrl} (Version: ${import.meta.env.VITE_APP_VERSION})`);
+ },
+ onRegisterError(error) {
+ console.log('SW registration error', error);
+ },
+ onOfflineReady() {
+ toast.success(t('pwa.offlineReady'));
+ },
+ });
+
+ const close = () => {
+ setNeedRefresh(false);
+ };
+
+ const update = () => {
+ updateServiceWorker(true);
+ };
+
+ if (!needRefresh) {
+ return null;
+ }
+
+
+
+ toast.message(
+ `${t('pwa.newContent')} (${import.meta.env.VITE_APP_VERSION})`,
+ {
+ action: {
+ label: t('pwa.reload'),
+ onClick: () => update(),
+ },
+ onDismiss: close,
+ duration: Infinity,
+ }
+ );
+
+ return null;
+}
+
+export default ReloadPrompt;
diff --git a/src/locales/en/translation.json b/src/locales/en/translation.json
index 59b5ba5..9a893db 100644
--- a/src/locales/en/translation.json
+++ b/src/locales/en/translation.json
@@ -95,5 +95,10 @@
"noData": "No server monitor data",
"avgDelay": "Latency",
"monitorCount": "Services"
+ },
+ "pwa": {
+ "offlineReady": "App ready to work offline",
+ "newContent": "New content available",
+ "reload": "Update"
}
}
diff --git a/src/locales/zh-CN/translation.json b/src/locales/zh-CN/translation.json
index 56416fc..38219eb 100644
--- a/src/locales/zh-CN/translation.json
+++ b/src/locales/zh-CN/translation.json
@@ -95,5 +95,10 @@
"noData": "没有服务器监控数据",
"avgDelay": "延迟",
"monitorCount": "个监控服务"
+ },
+ "pwa": {
+ "offlineReady": "应用可以离线使用了",
+ "newContent": "发现新版本",
+ "reload": "更新"
}
}
diff --git a/src/vite-env.d.ts b/src/vite-env.d.ts
index 11f02fe..71175a7 100644
--- a/src/vite-env.d.ts
+++ b/src/vite-env.d.ts
@@ -1 +1,22 @@
///
+
+declare module 'virtual:pwa-register/react' {
+ import type { Dispatch, SetStateAction } from 'react'
+
+ export interface RegisterSWOptions {
+ immediate?: boolean
+ onNeedRefresh?: () => void
+ onOfflineReady?: () => void
+ onRegistered?: (registration: ServiceWorkerRegistration | undefined) => void
+ onRegisteredSW?: (swScriptUrl: string, registration: ServiceWorkerRegistration | undefined) => void
+ onRegisterError?: (error) => void
+ }
+
+ export interface RegisterSWHook {
+ needRefresh: [boolean, Dispatch>]
+ offlineReady: [boolean, Dispatch>]
+ updateServiceWorker: (reloadPage?: boolean) => Promise
+ }
+
+ export function useRegisterSW(options?: RegisterSWOptions): RegisterSWHook
+}
diff --git a/vite.config.ts b/vite.config.ts
index baded3f..151c69d 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -19,6 +19,7 @@ export default defineConfig({
base: "/",
define: {
"import.meta.env.VITE_GIT_HASH": JSON.stringify(getGitHash()),
+ "import.meta.env.VITE_APP_VERSION": JSON.stringify(process.env.npm_package_version || "1.0.0"),
},
plugins: [
react(),
@@ -50,8 +51,58 @@ export default defineConfig({
],
},
workbox: {
- navigateFallbackDenylist: [/^\/dashboard/],
+ clientsClaim: true,
+ skipWaiting: true,
+ cleanupOutdatedCaches: true,
+ runtimeCaching: [
+ {
+ urlPattern: /^https:\/\/fonts\.googleapis\.com\/.*/i,
+ handler: 'CacheFirst',
+ options: {
+ cacheName: 'google-fonts-cache',
+ expiration: {
+ maxEntries: 10,
+ maxAgeSeconds: 60 * 60 * 24 * 365 // <== 365 days
+ },
+ cacheableResponse: {
+ statuses: [0, 200]
+ }
+ }
+ },
+ {
+ urlPattern: /^https:\/\/fonts\.gstatic\.com\/.*/i,
+ handler: 'CacheFirst',
+ options: {
+ cacheName: 'gstatic-fonts-cache',
+ expiration: {
+ maxEntries: 10,
+ maxAgeSeconds: 60 * 60 * 24 * 365 // <== 365 days
+ },
+ cacheableResponse: {
+ statuses: [0, 200]
+ }
+ }
+ },
+ {
+ urlPattern: /^https:\/\/api\.nezha\.dev\/.*/i,
+ handler: 'NetworkFirst',
+ options: {
+ cacheName: 'api-cache',
+ expiration: {
+ maxEntries: 100,
+ maxAgeSeconds: 60 * 5 // <== 5 minutes
+ },
+ cacheableResponse: {
+ statuses: [0, 200]
+ }
+ }
+ }
+ ]
},
+ devOptions: {
+ enabled: true,
+ type: 'module'
+ }
}),
],
resolve: {