create-fullstack-scaffold 0.4.22 → 0.4.24

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-fullstack-scaffold",
-  "version": "0.4.22",
+  "version": "0.4.24",
   "type": "module",
   "bin": {
     "create-fullstack-scaffold": "dist/cli/index.js"

package/template/package.json

@@ -15,6 +15,7 @@
     "dev:forum": "VITE_PRESET=community vite",
     "dev:saas": "VITE_PRESET=saas vite",
     "build": "npm run build:client && npm run build:server",
+    "build:analyze": "ANALYZE=true vite build",
     "build:client": "vite build",
     "build:server": "tsup",
     "build:cli": "tsup --config tsup.config.ts",

package/template/src/admin/i18n/locales/en-US.json

@@ -131,7 +131,16 @@
     "confirmNewPassword": "Confirm New Password",
     "confirmNewPasswordPlaceholder": "Confirm new password",
     "saveChanges": "Save Changes",
-    "saved": "Settings saved successfully!"
+    "saved": "Settings saved successfully!",
+    "email": "Email Settings",
+    "smtpHost": "SMTP Host",
+    "smtpHostPlaceholder": "e.g. smtp.example.com",
+    "smtpPort": "SMTP Port",
+    "emailFrom": "From Address",
+    "emailFromPlaceholder": "e.g. noreply@example.com",
+    "sessionTimeout": "Session Timeout",
+    "maxLoginAttempts": "Max Login Attempts",
+    "minutes": "minutes"
   },
   "roles": {
     "title": "Role Management",

package/template/src/admin/i18n/locales/zh-CN.json

@@ -131,7 +131,16 @@
     "confirmNewPassword": "确认新密码",
     "confirmNewPasswordPlaceholder": "请确认新密码",
     "saveChanges": "保存更改",
-    "saved": "设置保存成功！"
+    "saved": "设置保存成功！",
+    "email": "邮件设置",
+    "smtpHost": "SMTP 主机",
+    "smtpHostPlaceholder": "例如 smtp.example.com",
+    "smtpPort": "SMTP 端口",
+    "emailFrom": "发件地址",
+    "emailFromPlaceholder": "例如 noreply@example.com",
+    "sessionTimeout": "会话超时",
+    "maxLoginAttempts": "最大登录尝试次数",
+    "minutes": "分钟"
   },
   "roles": {
     "title": "角色管理",

package/template/src/admin/pages/SettingsPage.tsx

@@ -1,73 +1,122 @@
-import { Card, Form, Input, Button, Switch, Divider, message } from 'antd'
+import { useState, useEffect, useCallback } from 'react'
+import { Card, Form, Input, Button, Switch, Divider, message, InputNumber } from 'antd'
+import { apiClient, api } from '../services/apiClient'
 import { useLanguage } from '../i18n/useLanguage'
-
-interface SettingsFormValues {
-  siteName?: string
-  siteDescription?: string
-  currentPassword?: string
-  newPassword?: string
-  confirmPassword?: string
-}
+import type { Settings } from '@shared/modules/admin'
 
 export const SettingsPage: React.FC = () => {
   const { t } = useLanguage()
-  const [form] = Form.useForm<SettingsFormValues>()
+  const [form] = Form.useForm<Settings>()
+  const [loading, setLoading] = useState(false)
+
+  const fetchSettings = useCallback(async () => {
+    try {
+      const data = await api(apiClient.api.admin.settings.$get())
+        .withLoading(t('common.loading'))
+        .json()
+      form.setFieldsValue(data)
+    } catch {
+      // handled by api-request
+    }
+  }, [form, t])
 
-  const handleSave = () => {
-    message.success(t('settings.saved'))
+  useEffect(() => {
+    fetchSettings()
+  }, [fetchSettings])
+
+  const handleSave = async (values: Settings) => {
+    setLoading(true)
+    try {
+      await api(
+        apiClient.api.admin.settings.$put({
+          json: values,
+        })
+      )
+        .withLoading(t('common.loading'))
+        .json()
+      message.success(t('settings.saved'))
+    } catch {
+      // handled by api-request
+    } finally {
+      setLoading(false)
+    }
   }
 
   return (
     <div>
       <h1 className="text-2xl font-bold text-gray-900 mb-6">{t('settings.title')}</h1>
 
-      <Card title={t('settings.general')} className="mb-6">
-        <Form form={form} layout="vertical">
-          <Form.Item label={t('settings.siteName')} name="siteName">
+      <Form form={form} layout="vertical" onFinish={handleSave}>
+        <Card title={t('settings.general')} className="mb-6">
+          <Form.Item label={t('settings.siteName')} name="siteName" rules={[{ required: true }]}>
             <Input placeholder={t('settings.siteNamePlaceholder')} />
           </Form.Item>
           <Form.Item label={t('settings.siteDescription')} name="siteDescription">
             <Input.TextArea rows={4} placeholder={t('settings.siteDescriptionPlaceholder')} />
           </Form.Item>
-        </Form>
-      </Card>
+        </Card>
 
-      <Card title={t('settings.notification')} className="mb-6">
-        <div className="space-y-4">
-          <div className="flex items-center justify-between">
-            <div>
-              <p className="font-medium">{t('settings.emailNotifications')}</p>
-              <p className="text-sm text-gray-500">{t('settings.emailNotificationsDesc')}</p>
+        <Card title={t('settings.email')} className="mb-6">
+          <Form.Item label={t('settings.smtpHost')} name="smtpHost" rules={[{ required: true }]}>
+            <Input placeholder={t('settings.smtpHostPlaceholder')} />
+          </Form.Item>
+          <Form.Item label={t('settings.smtpPort')} name="smtpPort" rules={[{ required: true }]}>
+            <InputNumber min={1} max={65535} className="w-full" />
+          </Form.Item>
+          <Form.Item
+            label={t('settings.emailFrom')}
+            name="emailFrom"
+            rules={[{ required: true, type: 'email' }]}
+          >
+            <Input placeholder={t('settings.emailFromPlaceholder')} />
+          </Form.Item>
+        </Card>
+
+        <Card title={t('settings.notification')} className="mb-6">
+          <div className="space-y-4">
+            <div className="flex items-center justify-between">
+              <div>
+                <p className="font-medium">{t('settings.emailNotifications')}</p>
+                <p className="text-sm text-gray-500">{t('settings.emailNotificationsDesc')}</p>
+              </div>
+              <Form.Item name="emailNotifications" valuePropName="checked" noStyle>
+                <Switch />
+              </Form.Item>
             </div>
-            <Switch defaultChecked />
-          </div>
-          <Divider />
-          <div className="flex items-center justify-between">
-            <div>
-              <p className="font-medium">{t('settings.pushNotifications')}</p>
-              <p className="text-sm text-gray-500">{t('settings.pushNotificationsDesc')}</p>
+            <Divider />
+            <div className="flex items-center justify-between">
+              <div>
+                <p className="font-medium">{t('settings.pushNotifications')}</p>
+                <p className="text-sm text-gray-500">{t('settings.pushNotificationsDesc')}</p>
+              </div>
+              <Form.Item name="pushNotifications" valuePropName="checked" noStyle>
+                <Switch />
+              </Form.Item>
             </div>
-            <Switch />
           </div>
-        </div>
-      </Card>
+        </Card>
 
-      <Card title={t('settings.security')}>
-        <Form form={form} layout="vertical">
-          <Form.Item label={t('settings.currentPassword')} name="currentPassword">
-            <Input.Password placeholder={t('settings.currentPasswordPlaceholder')} />
+        <Card title={t('settings.security')} className="mb-6">
+          <Form.Item
+            label={t('settings.sessionTimeout')}
+            name="sessionTimeout"
+            rules={[{ required: true }]}
+          >
+            <InputNumber min={5} max={1440} addonAfter={t('settings.minutes')} className="w-full" />
           </Form.Item>
-          <Form.Item label={t('settings.newPassword')} name="newPassword">
-            <Input.Password placeholder={t('settings.newPasswordPlaceholder')} />
+          <Form.Item
+            label={t('settings.maxLoginAttempts')}
+            name="maxLoginAttempts"
+            rules={[{ required: true }]}
+          >
+            <InputNumber min={1} max={20} className="w-full" />
           </Form.Item>
-          <Form.Item label={t('settings.confirmNewPassword')} name="confirmPassword">
-            <Input.Password placeholder={t('settings.confirmNewPasswordPlaceholder')} />
-          </Form.Item>
-          <Button type="primary" onClick={handleSave}>
-            {t('settings.saveChanges')}
-          </Button>
-        </Form>
-      </Card>
+        </Card>
+
+        <Button type="primary" htmlType="submit" loading={loading} size="large">
+          {t('settings.saveChanges')}
+        </Button>
+      </Form>
     </div>
   )
 }

package/template/src/server/module-admin/routes/system-routes.ts

@@ -9,6 +9,8 @@ import {
   HealthCheckSchema,
   RecentActivitySchema,
   ClearTodosResultSchema,
+  SettingsSchema,
+  UpdateSettingsSchema,
 } from '@shared/modules/admin'
 
 const getStatsRoute = createRoute({
@@ -68,7 +70,58 @@ const clearAllTodosRoute = createRoute({
   },
 })
 
+const getSettingsRoute = createRoute({
+  method: 'get',
+  path: '/admin/settings',
+  tags: ['admin'],
+  security: [{ Bearer: [] }],
+  middleware: [authMiddleware({ requiredRole: Role.SUPER_ADMIN })],
+  responses: {
+    200: successResponse(SettingsSchema, 'Get system settings'),
+    401: errorResponse('Unauthorized'),
+    403: errorResponse('Forbidden'),
+  },
+})
+
+const updateSettingsRoute = createRoute({
+  method: 'put',
+  path: '/admin/settings',
+  tags: ['admin'],
+  security: [{ Bearer: [] }],
+  middleware: [authMiddleware({ requiredRole: Role.SUPER_ADMIN })],
+  request: {
+    body: {
+      content: { 'application/json': { schema: UpdateSettingsSchema } },
+    },
+  },
+  responses: {
+    200: successResponse(SettingsSchema, 'Settings updated'),
+    401: errorResponse('Unauthorized'),
+    403: errorResponse('Forbidden'),
+  },
+})
+
+let settingsState: z.infer<typeof SettingsSchema> = {
+  siteName: 'Biomimic Admin',
+  siteDescription: 'A full-stack admin dashboard',
+  smtpHost: 'smtp.example.com',
+  smtpPort: 587,
+  emailFrom: 'noreply@example.com',
+  sessionTimeout: 30,
+  maxLoginAttempts: 5,
+  emailNotifications: true,
+  pushNotifications: false,
+}
+
 export const systemRoutes = new OpenAPIHono<{ Variables: { authUser: AuthUser } }>()
+  .openapi(getSettingsRoute, async c => {
+    return c.json(success(settingsState), 200)
+  })
+  .openapi(updateSettingsRoute, async c => {
+    const body = c.req.valid('json')
+    settingsState = { ...settingsState, ...body }
+    return c.json(success(settingsState), 200)
+  })
   .openapi(getStatsRoute, async c => {
     const stats = await adminService.getSystemStats()
     return c.json(success(stats), 200)

package/template/src/server/module-auth/__tests__/profile-routes.test.ts

@@ -2,19 +2,36 @@
 import { describe, it, expect } from 'vitest'
 import { profileRoutes } from '../routes/profile-routes'
 
+interface ProfileResponse {
+  success: boolean
+  data: {
+    id: string
+    username: string
+    email: string
+    bio: string
+    joinDate: string
+    stats: { posts: number; followers: number; following: number }
+  }
+  timestamp: string
+}
+
+async function fetchProfile(): Promise<ProfileResponse> {
+  const res = await profileRoutes.fetch(new Request('http://localhost/profile'))
+  return (await res.json()) as ProfileResponse
+}
+
 describe('Profile Routes', () => {
   describe('GET /profile', () => {
     it('should return profile with 200', async () => {
       const res = await profileRoutes.fetch(new Request('http://localhost/profile'))
 
       expect(res.status).toBe(200)
-      const data = (await res.json()) as Record<string, any>
+      const data = await fetchProfile()
       expect(data.success).toBe(true)
     })
 
     it('should return profile with required fields', async () => {
-      const res = await profileRoutes.fetch(new Request('http://localhost/profile'))
-      const data = (await res.json()) as Record<string, any>
+      const data = await fetchProfile()
 
       expect(data.success).toBe(true)
       expect(data.data.id).toBeDefined()
@@ -25,16 +42,14 @@ describe('Profile Routes', () => {
     })
 
     it('should return valid email format', async () => {
-      const res = await profileRoutes.fetch(new Request('http://localhost/profile'))
-      const data = (await res.json()) as Record<string, any>
+      const data = await fetchProfile()
 
       expect(data.success).toBe(true)
       expect(data.data.email).toMatch(/^[^\s@]+@[^\s@]+\.[^\s@]+$/)
     })
 
     it('should return stats with numeric values', async () => {
-      const res = await profileRoutes.fetch(new Request('http://localhost/profile'))
-      const data = (await res.json()) as Record<string, any>
+      const data = await fetchProfile()
 
       expect(data.success).toBe(true)
       expect(typeof data.data.stats.posts).toBe('number')
@@ -43,18 +58,15 @@ describe('Profile Routes', () => {
     })
 
     it('should return a valid ISO date for joinDate', async () => {
-      const res = await profileRoutes.fetch(new Request('http://localhost/profile'))
-      const data = (await res.json()) as Record<string, any>
+      const data = await fetchProfile()
 
       expect(data.success).toBe(true)
       expect(data.data.joinDate).toMatch(/^\d{4}-\d{2}-\d{2}T/)
     })
 
     it('should return consistent data across requests', async () => {
-      const res1 = await profileRoutes.fetch(new Request('http://localhost/profile'))
-      const data1 = (await res1.json()) as Record<string, any>
-      const res2 = await profileRoutes.fetch(new Request('http://localhost/profile'))
-      const data2 = (await res2.json()) as Record<string, any>
+      const data1 = await fetchProfile()
+      const data2 = await fetchProfile()
 
       expect(data1.success).toBe(true)
       expect(data2.success).toBe(true)
@@ -64,8 +76,7 @@ describe('Profile Routes', () => {
     })
 
     it('should include timestamp in response', async () => {
-      const res = await profileRoutes.fetch(new Request('http://localhost/profile'))
-      const data = (await res.json()) as Record<string, any>
+      const data = await fetchProfile()
 
       expect(data.success).toBe(true)
       expect(data.timestamp).toBeDefined()
@@ -73,8 +84,7 @@ describe('Profile Routes', () => {
     })
 
     it('should return bio field', async () => {
-      const res = await profileRoutes.fetch(new Request('http://localhost/profile'))
-      const data = (await res.json()) as Record<string, any>
+      const data = await fetchProfile()
 
       expect(data.success).toBe(true)
       expect(data.data.bio).toBeDefined()

package/template/src/shared/modules/admin/schemas.ts

@@ -79,6 +79,20 @@ export const ClearTodosResultSchema = z.object({
   deletedCount: z.number(),
 })
 
+export const SettingsSchema = z.object({
+  siteName: z.string(),
+  siteDescription: z.string(),
+  smtpHost: z.string(),
+  smtpPort: z.number(),
+  emailFrom: z.string(),
+  sessionTimeout: z.number(),
+  maxLoginAttempts: z.number(),
+  emailNotifications: z.boolean(),
+  pushNotifications: z.boolean(),
+})
+
+export const UpdateSettingsSchema = SettingsSchema
+
 export const AdminSuccessSchema = z.object({})
 
 export const DownloadTokenSchema = z.object({
@@ -98,3 +112,5 @@ export type RegisterRequest = z.infer<typeof RegisterRequestSchema>
 export type User = z.infer<typeof UserSchema>
 export type UpdateUserRequest = z.infer<typeof UpdateUserRequestSchema>
 export type ClearTodosResult = z.infer<typeof ClearTodosResultSchema>
+export type Settings = z.infer<typeof SettingsSchema>
+export type UpdateSettings = z.infer<typeof UpdateSettingsSchema>

package/template/vite.config.ts

@@ -1,8 +1,25 @@
 import path from 'path'
 import { existsSync } from 'fs'
-import { defineConfig } from 'vite'
+import { defineConfig, type Plugin } from 'vite'
 import devServer from '@hono/vite-dev-server'
 import { websocketPlugin, dbPlugin } from './vite-plugins'
+// Bundle analysis: npm install -D rollup-plugin-visualizer && npm run build:analyze
+let visualizerPlugin: (() => Plugin) | undefined
+if (process.env.ANALYZE === 'true') {
+  try {
+    // @ts-expect-error — optional dev dependency, installed via: npm install -D rollup-plugin-visualizer
+    const mod = await import('rollup-plugin-visualizer')
+    visualizerPlugin = () =>
+      mod.visualizer({
+        open: true,
+        filename: 'stats.html',
+        gzipSize: true,
+        brotliSize: true,
+      }) as Plugin
+  } catch {
+    // rollup-plugin-visualizer not installed — run: npm install -D rollup-plugin-visualizer
+  }
+}
 // Prerender is optional — only needed during production build with puppeteer + Chrome installed
 let prerender: typeof import('@prerenderer/rollup-plugin').default | undefined
 let puppeteerRenderer: typeof import('@prerenderer/renderer-puppeteer').default | undefined
@@ -85,6 +102,7 @@ export default defineConfig({
   ],
   build: {
     outDir: 'dist/client',
+    chunkSizeWarningLimit: 1000,
     rollupOptions: {
       input: {
         main: path.resolve(__dirname, 'index.html'),
@@ -93,6 +111,12 @@ export default defineConfig({
         merchant: path.resolve(__dirname, 'merchant.html'),
       },
       output: {
+        manualChunks: {
+          'vendor-react': ['react', 'react-dom', 'react-router-dom'],
+          'vendor-antd': ['antd', '@ant-design/icons'],
+          'vendor-hono': ['hono'],
+          'vendor-zustand': ['zustand'],
+        },
         plugins: [
           ...(prerender && puppeteerRenderer
             ? [
@@ -105,6 +129,7 @@ export default defineConfig({
                 }),
               ]
             : []),
+          ...(visualizerPlugin ? [visualizerPlugin()] : []),
         ],
       },
       onwarn(warning, defaultHandler) {