update

astro.config.mjs

@@ -2,6 +2,7 @@ import { defineConfig } from 'astro/config';
 import mdx from '@astrojs/mdx';
 import react from '@astrojs/react';
 import sitemap from '@astrojs/sitemap';
+import baseSSL from '@vitejs/plugin-basic-ssl';
 import pkgs from './package.json';
 import tailwindcss from '@tailwindcss/vite';
 const isDev = process.env.NODE_ENV === 'development';

package.json

@@ -3,7 +3,7 @@
   "version": "0.0.5",
   "description": "",
   "main": "index.js",
-  "basename": "/user/home",
+  "basename": "/root/home",
   "scripts": {
     "dev": "astro dev",
     "build": "astro build",
@@ -20,6 +20,7 @@
     "@astrojs/react": "^4.4.0",
     "@astrojs/sitemap": "^3.6.0",
     "@floating-ui/dom": "^1.7.4",
+    "@kevisual/context": "^0.0.4",
     "@kevisual/query": "0.0.29",
     "@kevisual/query-login": "^0.0.6",
     "@kevisual/registry": "^0.0.1",

pnpm-lock.yaml

@@ -20,6 +20,9 @@ importers:
       '@floating-ui/dom':
         specifier: ^1.7.4
         version: 1.7.4
+      '@kevisual/context':
+        specifier: ^0.0.4
+        version: 0.0.4
       '@kevisual/query':
         specifier: 0.0.29
         version: 0.0.29(ws@8.18.0)(zod@3.25.76)
@@ -676,6 +679,9 @@ packages:
   '@kevisual/cache@0.0.2':
     resolution: {integrity: sha512-2Cl5KF2Gi27uLfhO6CdTMFnRzx9vYnqevAo7d9ab3rOaqTgF8tLeAXglXyRbaWW3WUbHU2XaOb4r98uUsqIQQw==}
 
+  '@kevisual/context@0.0.4':
+    resolution: {integrity: sha512-HJeLeZQLU+7tCluSfOyvkgKLs0HjCZrdJlZgEgKRSa8XTwZfMAUt6J7qZTbrZAHBlPtX68EPu/PI8JMCeu3WAQ==}
+
   '@kevisual/query-login@0.0.6':
     resolution: {integrity: sha512-ZdX+sxeQaM3PV9fZXofMlxFz1RmpYIkoi47exzUgw6DADjEryBAQKRXe2/oL20NsBTV8owqaagRqffAVjq5c5g==}
     peerDependencies:
@@ -3294,6 +3300,8 @@ snapshots:
       - tslib
       - typescript
 
+  '@kevisual/context@0.0.4': {}
+
   '@kevisual/query-login@0.0.6(@kevisual/query@0.0.29(ws@8.18.0)(zod@3.25.76))(rollup@4.52.5)(tslib@2.8.1)(typescript@5.8.3)':
     dependencies:
       '@kevisual/cache': 0.0.2(rollup@4.52.5)(tslib@2.8.1)(typescript@5.8.3)

public/test-import.js

@@ -0,0 +1,13 @@
+export const test = () => {
+  return new Date().toDateString();
+}
+
+const app = useContextKey('app')
+
+app.route({
+  path: 'test-import',
+  description: 'test dynamic import module',
+}).define(async(ctx)=>{
+
+  ctx.body = 'test-import'
+}).addTo(app);

src/apps/ai/app.ts

@@ -0,0 +1,4 @@
+import { QueryRouterServer } from '@kevisual/router/browser'
+import { useContextKey } from '@kevisual/context'
+const app = useContextKey('app', new QueryRouterServer())
+export { app }

src/apps/ai/index.ts

@@ -0,0 +1,6 @@
+import { app } from './app'
+
+import './routes/login'
+
+
+export { app }

src/apps/ai/routes/login/index.ts

@@ -0,0 +1,14 @@
+import { app } from '../../app'
+
+app.route({
+  path: 'login',
+  description: '登录应用，参数 username 是用户名，password 是密码',
+
+}).define(async (ctx) => {
+  const { username, password } = ctx.query;
+
+  ctx.body = {
+    message: `User ${username} logged in successfully.`,
+  }
+}
+).addTo(app)

src/apps/web-command/index.tsx

@@ -0,0 +1,42 @@
+import { app } from '../ai';
+import { useEffect, useState } from 'react';
+
+const getAppRoutes = () => {
+  const appRoutes = app.routes.map((route) => {
+    return {
+      path: route.path,
+      key: route.key,
+      description: route.description,
+      metadata: route.metadata,
+    }
+  });
+  return appRoutes;
+}
+
+const fetchTest = async () => {
+  const url = 'http://localhost:51015/api/router';
+  const response = await fetch(url);
+  const data = await response.json();
+  console.log('Fetch Test Data:', data);
+}
+const dynamicImport = async () => {
+  const module = await import('http://localhost:4321/test-import.js');
+  console.log('Dynamically Imported Module:', module);
+  console.log('Test Function Output:', module.test());
+
+}
+export const App = () => {
+  const [appRoutes, setAppRoutes] = useState(getAppRoutes());
+  useEffect(() => {
+    setAppRoutes(getAppRoutes());
+  }, []);
+  return <div>Web Command App
+
+    <pre onClick={async () => {
+
+      await dynamicImport()
+      setAppRoutes(getAppRoutes());
+    }
+    }>{JSON.stringify(appRoutes, null, 2)}</pre>
+  </div >;
+}

src/components/html.astro

@@ -1,5 +1,6 @@
 ---
 import '../styles/global.css';
+import '../styles/theme.css';
 export interface Props {
   title?: string;
   description?: string;

src/content.config.ts

@@ -9,7 +9,7 @@ const docs = defineCollection({
     title: z.string().optional(),
     description: z.string().optional(),
     // pubDate: z.coerce.date(),
-    // updatedDate: z.coerce.date().optional(),
+    // updatedAt: z.coerce.date().optional(),
   }),
 });
 

src/data/docs/home.md

@@ -1,3 +1,10 @@
+---
+title: 'home'
+tags: ['首页', '工作台']
+createdAt: 2025-10-27 18:35
+updatedAt: 2025-10-27 18:35
+---
+
 # 首页描述
 
 所有的页面的登录入口在当前页面，
@@ -11,6 +18,5 @@
 - 命令执行
 - 历史记录
 
-## 任务管理
+## 使用场景
 
-- [ ]  登录功能

src/layouts/blank.astro

@@ -1,24 +1,47 @@
 ---
 import '../styles/global.css';
 import '../styles/theme.css';
+export interface Props {
+  title?: string;
+  description?: string;
+  lang?: string;
+  charset?: string;
+}
+
+const { title = 'Light Code', description = 'A lightweight code editor', lang = 'zh-CN', charset = 'UTF-8' } = Astro.props;
 ---
 
-<html lang='zh-CN'>
+<!doctype html>
+<html lang={lang}>
   <head>
-    <meta charset='UTF-8' />
+    <meta charset={charset} />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta name='viewport' content='width=device-width, initial-scale=1.0' />
-    <title>AI Pages</title>
+    <meta name='description' content={description} />
-    <style>
+    <title>{title}</title>
-      html,
+    <!-- 样式 -->
-      body {
+    <slot name='head' />
-        width: 100%;
-        min-height: 100vh;
-        margin: 0;
-        padding: 0;
-      }
-    </style>
   </head>
   <body>
     <slot />
+
+    <!-- 脚本 -->
+    <slot name='scripts' />
   </body>
 </html>
+
+<style>
+  html {
+    font-family: system-ui, sans-serif;
+  }
+
+  html,
+  body {
+    margin: 0;
+    padding: 0;
+    min-height: 100vh;
+  }
+
+  * {
+    box-sizing: border-box;
+  }
+</style>

src/pages/index.astro

@@ -1,46 +1,10 @@
 ---
-console.log('Hello from index.astro');
+import Html from '@/components/html.astro';
-import '../styles/global.css';
+import { App } from '@/apps/web-command';
 ---
 
-<html lang='en'>
+<Html>
-  <head>
+  <main>
-    <title>Home</title>
+    <App client:only/>
-  </head>
+  </main>
-  <body>
+</Html>
-    <h1 onclick="{onClick}">Welcome to my website!</h1>
-    <div class='bg-amber-50 w-20 h-20 rounded-full'></div>
-    <div id='root'></div>
-    <script type='importmap' data-vite-ignore is:inline>
-      {
-        "imports": {
-          "react": "https://esm.sh/react@19.1.0",
-          "react-dom": "https://esm.sh/react-dom@19.1.0/client.js",
-          "react-toastify": "https://esm.sh/react-toastify@11.0.5"
-        }
-      }
-    </script>
-    <script type='module' data-vite-ignore is:inline>
-      import { Button, message } from 'https://esm.sh/antd?standalone';
-      import React from 'react';
-      import { ToastContainer, toast } from 'react-toastify';
-      import { createRoot } from 'react-dom';
-      setTimeout(() => {
-        toast.loading('Hello from index.astro');
-        window.toast = toast;
-        console.log('message', toast);
-      }, 1000);
-      console.log('Hello from index.astro', Button);
-      const root = document.getElementById('root');
-      const render = createRoot(root);
-      const App = () => {
-        const button = React.createElement(Button, null, 'Hello');
-        const messageEl = React.createElement(ToastContainer, null, 'Hello');
-        const wrapperMessage = React.createElement('div', null, [button, messageEl]);
-        return wrapperMessage;
-      };
-      // render.render(React.createElement(Button, null, 'Hello'), root);
-      render.render(App(), root);
-    </script>
-  </body>
-</html>