feat: 更新依赖版本,添加PWA更新组件,优化Sidebar组件,增加footer支持

This commit is contained in:
xiongxiao
2026-03-22 13:54:30 +08:00
committed by cnb
parent 518a3f2864
commit dd100fd7ef
9 changed files with 175 additions and 37 deletions

View File

@@ -17,19 +17,19 @@
"author": "abearxiong <xiongxiao@xiongxiao.me>", "author": "abearxiong <xiongxiao@xiongxiao.me>",
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@ai-sdk/anthropic": "^3.0.58", "@ai-sdk/anthropic": "^3.0.63",
"@ai-sdk/openai": "^3.0.41", "@ai-sdk/openai": "^3.0.47",
"@ai-sdk/openai-compatible": "^2.0.35", "@ai-sdk/openai-compatible": "^2.0.37",
"@base-ui/react": "^1.3.0", "@base-ui/react": "^1.3.0",
"@kevisual/api": "^0.0.64", "@kevisual/api": "^0.0.65",
"@kevisual/cnb": "^0.0.52", "@kevisual/cnb": "^0.0.59",
"@kevisual/cnb-ai": "^0.0.2", "@kevisual/cnb-ai": "^0.0.2",
"@kevisual/context": "^0.0.8", "@kevisual/context": "^0.0.8",
"@kevisual/kv-login": "^0.1.18", "@kevisual/kv-login": "^0.1.18",
"@kevisual/router": "0.1.3", "@kevisual/router": "0.1.6",
"@tanstack/react-router": "^1.167.4", "@tanstack/react-router": "^1.168.1",
"@uiw/react-codemirror": "^4.25.8", "@uiw/react-codemirror": "^4.25.8",
"ai": "^6.0.116", "ai": "^6.0.134",
"class-variance-authority": "^0.7.1", "class-variance-authority": "^0.7.1",
"clsx": "^2.1.1", "clsx": "^2.1.1",
"cmdk": "^1.1.1", "cmdk": "^1.1.1",
@@ -43,7 +43,7 @@
"re-resizable": "^6.11.2", "re-resizable": "^6.11.2",
"react": "^19.2.4", "react": "^19.2.4",
"react-dom": "^19.2.4", "react-dom": "^19.2.4",
"react-hook-form": "^7.71.2", "react-hook-form": "^7.72.0",
"react-resizable": "^3.1.3", "react-resizable": "^3.1.3",
"sonner": "^2.0.7", "sonner": "^2.0.7",
"vite-plugin-pwa": "^1.2.0", "vite-plugin-pwa": "^1.2.0",
@@ -56,12 +56,12 @@
"devDependencies": { "devDependencies": {
"@codemirror/lang-yaml": "^6.1.2", "@codemirror/lang-yaml": "^6.1.2",
"@kevisual/gitea": "^0.0.6", "@kevisual/gitea": "^0.0.6",
"@kevisual/query": "0.0.53", "@kevisual/query": "0.0.55",
"@kevisual/types": "^0.0.12", "@kevisual/types": "^0.0.12",
"@tailwindcss/vite": "^4.2.1", "@tailwindcss/vite": "^4.2.2",
"@tanstack/react-query": "^5.90.21", "@tanstack/react-query": "^5.94.5",
"@tanstack/react-router-devtools": "^1.166.9", "@tanstack/react-router-devtools": "^1.166.10",
"@tanstack/router-plugin": "^1.166.13", "@tanstack/router-plugin": "^1.167.2",
"@types/node": "^25.5.0", "@types/node": "^25.5.0",
"@types/react": "^19.2.14", "@types/react": "^19.2.14",
"@types/react-dom": "^19.2.3", "@types/react-dom": "^19.2.3",
@@ -69,9 +69,9 @@
"@vitejs/plugin-react": "^6.0.1", "@vitejs/plugin-react": "^6.0.1",
"dotenv": "^17.3.1", "dotenv": "^17.3.1",
"tailwind-merge": "^3.5.0", "tailwind-merge": "^3.5.0",
"tailwindcss": "^4.2.1", "tailwindcss": "^4.2.2",
"tw-animate-css": "^1.4.0", "tw-animate-css": "^1.4.0",
"typescript": "^5.9.3", "typescript": "^5.9.3",
"vite": "^8.0.0" "vite": "^8.0.1"
} }
} }

View File

@@ -22,20 +22,43 @@
}, },
"sync": { "sync": {
"AGENTS.md": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/AGENTS.md", "AGENTS.md": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/AGENTS.md",
"tsconfig.json": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/tsconfig.json",
"vite.config.ts": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/vite.config.ts", "vite.config.ts": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/vite.config.ts",
"src/main.tsx": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/main.tsx",
"public/auth.json": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/public/auth.json", "public/auth.json": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/public/auth.json",
"src/agents/index.ts": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/agents/index.ts", "public/demo.html": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/public/demo.html",
"src/modules/basename.ts": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/modules/basename.ts",
"src/modules/query.ts": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/modules/query.ts", "src/modules/query.ts": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/modules/query.ts",
"src/routes/demo.tsx": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/routes/demo.tsx", "src/routes/demo.tsx": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/routes/demo.tsx",
"src/routes/index.tsx": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/routes/index.tsx", "src/routes/index.tsx": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/routes/index.tsx",
"src/routes/login.tsx": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/routes/login.tsx", "src/routes/login.tsx": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/routes/login.tsx",
"src/styles/theme.css": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/styles/theme.css", "src/styles/theme.css": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/styles/theme.css",
"src/components/a/PWAUpdate.tsx": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/components/a/PWAUpdate.tsx",
"src/components/a/Sidebar.tsx": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/components/a/Sidebar.tsx",
"src/components/ui/badge.tsx": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/components/ui/badge.tsx",
"src/components/ui/breadcrumb.tsx": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/components/ui/breadcrumb.tsx",
"src/components/ui/button.tsx": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/components/ui/button.tsx",
"src/components/ui/card.tsx": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/components/ui/card.tsx",
"src/components/ui/checkbox.tsx": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/components/ui/checkbox.tsx",
"src/components/ui/command.tsx": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/components/ui/command.tsx",
"src/components/ui/dialog.tsx": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/components/ui/dialog.tsx",
"src/components/ui/dropdown-menu.tsx": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/components/ui/dropdown-menu.tsx",
"src/components/ui/input-group.tsx": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/components/ui/input-group.tsx",
"src/components/ui/input.tsx": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/components/ui/input.tsx",
"src/components/ui/kbd.tsx": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/components/ui/kbd.tsx",
"src/components/ui/label.tsx": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/components/ui/label.tsx",
"src/components/ui/menubar.tsx": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/components/ui/menubar.tsx",
"src/components/ui/popover.tsx": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/components/ui/popover.tsx",
"src/components/ui/select.tsx": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/components/ui/select.tsx",
"src/components/ui/sheet.tsx": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/components/ui/sheet.tsx",
"src/components/ui/skeleton.tsx": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/components/ui/skeleton.tsx",
"src/components/ui/sonner.tsx": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/components/ui/sonner.tsx",
"src/components/ui/tabs.tsx": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/components/ui/tabs.tsx",
"src/components/ui/textarea.tsx": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/components/ui/textarea.tsx",
"src/components/ui/tooltip.tsx": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/components/ui/tooltip.tsx",
"src/pages/auth/index.tsx": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/pages/auth/index.tsx", "src/pages/auth/index.tsx": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/pages/auth/index.tsx",
"src/pages/auth/page.tsx": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/pages/auth/page.tsx", "src/pages/auth/page.tsx": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/pages/auth/page.tsx",
"src/pages/auth/store.ts": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/pages/auth/store.ts", "src/pages/auth/store.ts": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/pages/auth/store.ts",
"src/pages/demo/page.tsx": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/pages/demo/page.tsx", "src/pages/demo/page.tsx": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/pages/demo/page.tsx",
"src/agents/app.ts": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/agents/app.ts",
"src/pages/auth/hooks/index.ts": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/pages/auth/hooks/index.ts", "src/pages/auth/hooks/index.ts": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/pages/auth/hooks/index.ts",
"src/pages/auth/hooks/use-api-query.ts": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/pages/auth/hooks/use-api-query.ts", "src/pages/auth/hooks/use-api-query.ts": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/pages/auth/hooks/use-api-query.ts",
"src/pages/auth/modules/BaseHeader.tsx": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/pages/auth/modules/BaseHeader.tsx", "src/pages/auth/modules/BaseHeader.tsx": "https://kevisual.cn/root/ai/kevisual/frontend/vite-react-template/src/pages/auth/modules/BaseHeader.tsx",

View File

@@ -1,10 +1,3 @@
import { QueryRouterServer } from '@kevisual/router/browser' import { QueryRouterServer } from "@kevisual/router/browser"
import { useContextKey } from '@kevisual/context' import { useContextKey } from '@kevisual/context'
export const app = useContextKey('app', new QueryRouterServer()) export const app = useContextKey('app', new QueryRouterServer())
// import '@kevisual/cnb-ai'
const url = 'https://kevisual.cn/root/cnb-ai/dist/app.js'
setTimeout(() => {
import(/* @vite-ignore */url)
}, 2000)

View File

@@ -1 +1,8 @@
export * from './app.ts' export * from './app.ts'
// import '@kevisual/cnb-ai'
const url = 'https://kevisual.cn/root/cnb-ai/dist/app.js'
setTimeout(() => {
import(/* @vite-ignore */url)
}, 2000)

View File

@@ -0,0 +1,60 @@
import { useState } from 'react';
import { useRegisterSW } from 'virtual:pwa-register/react';
import { Button } from '@/components/ui/button';
import {
Card,
CardContent,
CardDescription,
CardFooter,
CardHeader,
CardTitle,
} from '@/components/ui/card';
function PWAUpdate() {
const {
needRefresh: [needRefresh, setNeedRefresh],
updateServiceWorker,
} = useRegisterSW({
onNeedRefresh() {
setNeedRefresh(true);
},
});
const [isLoading, setIsLoading] = useState(false);
const handleUpdate = async () => {
setIsLoading(true);
await updateServiceWorker(true);
setIsLoading(false);
};
const handleDismiss = () => {
setNeedRefresh(false);
};
if (!needRefresh) {
return null;
}
return (
<div className="fixed bottom-4 right-4 z-50">
<Card className="w-80 shadow-lg">
<CardHeader className="pb-3">
<CardTitle></CardTitle>
<CardDescription></CardDescription>
</CardHeader>
<CardContent className="pt-0" />
<CardFooter className="gap-2">
<Button variant="outline" size="sm" onClick={handleDismiss}>
</Button>
<Button size="sm" onClick={handleUpdate} disabled={isLoading}>
{isLoading ? '更新中...' : '立即更新'}
</Button>
</CardFooter>
</Card>
</div>
);
}
export default PWAUpdate;

View File

@@ -32,6 +32,7 @@ export interface SidebarProps {
children?: React.ReactNode children?: React.ReactNode
logo?: React.ReactNode logo?: React.ReactNode
title?: React.ReactNode title?: React.ReactNode
footer?: React.ReactNode
defaultCollapsed?: boolean defaultCollapsed?: boolean
defaultWidth?: number defaultWidth?: number
minWidth?: number minWidth?: number
@@ -44,6 +45,7 @@ export function Sidebar({
children, children,
logo, logo,
title, title,
footer,
defaultCollapsed = false, defaultCollapsed = false,
defaultWidth = 208, defaultWidth = 208,
minWidth = 120, minWidth = 120,
@@ -172,7 +174,6 @@ export function Sidebar({
</li> </li>
) )
} }
return ( return (
<> <>
<div className={cn('flex h-full', className)}> <div className={cn('flex h-full', className)}>
@@ -194,7 +195,7 @@ export function Sidebar({
> >
<aside <aside
className={cn( className={cn(
'border-r bg-white flex-shrink-0 flex flex-col' 'h-full border-r bg-white flex-shrink-0 flex flex-col'
)} )}
style={{ width: sidebarWidth }} style={{ width: sidebarWidth }}
> >
@@ -223,11 +224,18 @@ export function Sidebar({
{items.map((item) => renderNavItem(item))} {items.map((item) => renderNavItem(item))}
</ul> </ul>
</nav> </nav>
{/* Footer */}
{footer && (
<div className="border-t flex-shrink-0">
{footer}
</div>
)}
</aside> </aside>
</Resizable> </Resizable>
) : ( ) : (
// 收起状态 // 收起状态
<aside className="w-14 border-r bg-white flex-shrink-0 flex flex-col"> <aside className="h-full w-14 border-r bg-white flex-shrink-0 flex flex-col">
{/* Logo 区域 */} {/* Logo 区域 */}
<div className="h-12 flex items-center justify-center border-b px-2"> <div className="h-12 flex items-center justify-center border-b px-2">
<div className="group relative flex-shrink-0"> <div className="group relative flex-shrink-0">
@@ -248,6 +256,13 @@ export function Sidebar({
{items.map((item) => renderNavItem(item))} {items.map((item) => renderNavItem(item))}
</ul> </ul>
</nav> </nav>
{/* Footer */}
{footer && (
<div className="border-t flex-shrink-0">
{footer}
</div>
)}
</aside> </aside>
)} )}

View File

@@ -90,13 +90,10 @@ export const useLayoutStore = create<LayoutStore>((set, get) => ({
setIsAdmin: (isAdmin) => set({ isAdmin }), setIsAdmin: (isAdmin) => set({ isAdmin }),
init: async () => { init: async () => {
await queryLogin.init(); await queryLogin.init();
const token = await queryLogin.checkLocalToken(); const token = await queryLogin.checkTokenValid();
if (token) { if (token) {
set({ me: {} }); set({ me: {} });
try { try {
// const data = await stackQueryClient.fetchQuery({
// queryKey: authQueryKeys.me,
// }) as UserInfo;
const userInfo = await queryLogin.checkLocalUser(); const userInfo = await queryLogin.checkLocalUser();
if (userInfo) { if (userInfo) {
set({ me: userInfo as UserInfo, isAdmin: userInfo.orgs?.includes?.('admin') || false }); set({ me: userInfo as UserInfo, isAdmin: userInfo.orgs?.includes?.('admin') || false });

View File

@@ -33,7 +33,17 @@ const navItems: NavItem[] = [
export function SidebarLayout({ children }: { children: React.ReactNode }) { export function SidebarLayout({ children }: { children: React.ReactNode }) {
return ( return (
<Sidebar items={navItems} title='云原生' logo={<Logo className='w-6 h-6' />}> <Sidebar items={navItems} title='云原生' logo={<Logo className='w-6 h-6' />}
footer={<div className="p-4 border-t text-sm text-gray-500 hover:text-gray-700">
<a
href="https://cnb.cool/kevisual/cnb-center"
target="_blank"
rel="noopener noreferrer"
>
CNB Center
</a>
</div>}
>
{children} {children}
</Sidebar> </Sidebar>
) )

View File

@@ -32,6 +32,39 @@ export default defineConfig({
tailwindcss(), tailwindcss(),
VitePWA({ VitePWA({
injectRegister: 'auto', injectRegister: 'auto',
registerType: 'autoUpdate',
// Workbox 缓存策略配置
workbox: {
// API 请求使用网络优先策略,确保获取最新数据
runtimeCaching: [
{
urlPattern: /^https?.*\/api\/.*/,
handler: 'NetworkFirst',
options: {
cacheName: 'api-cache',
expiration: {
maxEntries: 50,
maxAgeSeconds: 60 * 60 * 24, // 24小时
},
cacheableResponse: {
statuses: [0, 200],
},
},
},
// 静态资源使用缓存优先,但设置较短过期时间
{
urlPattern: /^https?.*\.(js|css|woff2?|png|jpg|jpeg|svg|gif|ico)/,
handler: 'StaleWhileRevalidate',
options: {
cacheName: 'static-resources',
expiration: {
maxEntries: 100,
maxAgeSeconds: 60 * 60 * 24 * 7, // 7天
},
},
},
],
},
}), }),
], ],
resolve: { resolve: {