create-fullstack-scaffold 0.4.9 → 0.4.11

package/template/lint-scripts/validators/schema-uniqueness.validator.ts

@@ -0,0 +1,147 @@
+import { readFileSync, readdirSync, existsSync, statSync } from 'node:fs'
+import { join, basename } from 'node:path'
+
+export interface SchemaUniquenessConfig {
+  modulesDir: string
+  checkDirs: string[]
+  ignoreDirs: string[]
+}
+
+export interface SchemaUniquenessError {
+  exportName: string
+  modules: string[]
+  suggestion: string
+}
+
+const SCHEMA_EXPORT_RE = /export\s+(?:const|type|function)\s+([A-Z][A-Za-z0-9]*Schema)\b/g
+const TYPE_EXPORT_RE = /export\s+type\s+([A-Z][A-Za-z0-9]*)\b/g
+const RE_EXPORT_SCHEMA_RE = /\b([A-Z][A-Za-z0-9]*Schema)\b/g
+const RE_EXPORT_TYPE_RE = /type\s+([A-Z][A-Za-z0-9]*)\b/g
+
+function capitalize(s: string): string {
+  return s.charAt(0).toUpperCase() + s.slice(1)
+}
+
+function extractExportsFromFile(filePath: string): Set<string> {
+  const content = readFileSync(filePath, 'utf-8')
+  const names = new Set<string>()
+
+  let m: RegExpExecArray | null
+  SCHEMA_EXPORT_RE.lastIndex = 0
+  while ((m = SCHEMA_EXPORT_RE.exec(content)) !== null) {
+    names.add(m[1])
+  }
+
+  TYPE_EXPORT_RE.lastIndex = 0
+  while ((m = TYPE_EXPORT_RE.exec(content)) !== null) {
+    if (!m[1].endsWith('Schema')) {
+      names.add(m[1])
+    }
+  }
+
+  return names
+}
+
+function extractReExportsFromFile(filePath: string): Set<string> {
+  const content = readFileSync(filePath, 'utf-8')
+  const names = new Set<string>()
+
+  if (!/^export\s*\{/m.test(content) && !/^export\s+\*\s+from/m.test(content)) {
+    return names
+  }
+
+  let m: RegExpExecArray | null
+  RE_EXPORT_SCHEMA_RE.lastIndex = 0
+  while ((m = RE_EXPORT_SCHEMA_RE.exec(content)) !== null) {
+    names.add(m[1])
+  }
+
+  RE_EXPORT_TYPE_RE.lastIndex = 0
+  while ((m = RE_EXPORT_TYPE_RE.exec(content)) !== null) {
+    if (!m[1].endsWith('Schema')) {
+      names.add(m[1])
+    }
+  }
+
+  return names
+}
+
+export function validateSchemaUniqueness(
+  config: SchemaUniquenessConfig,
+  rootPath: string
+): SchemaUniquenessError[] {
+  const modulesPath = join(rootPath, config.modulesDir)
+
+  if (!existsSync(modulesPath)) {
+    return []
+  }
+
+  const exportMap = new Map<string, string[]>()
+
+  const entries = readdirSync(modulesPath, { withFileTypes: true })
+  for (const entry of entries) {
+    if (!entry.isDirectory()) continue
+    if (config.ignoreDirs.includes(entry.name)) continue
+
+    const moduleName = entry.name
+    const moduleDir = join(modulesPath, entry.name)
+
+    const schemasFile = join(moduleDir, 'schemas.ts')
+    if (existsSync(schemasFile)) {
+      const exports = extractExportsFromFile(schemasFile)
+      for (const name of exports) {
+        const existing = exportMap.get(name) || []
+        if (!existing.includes(moduleName)) {
+          existing.push(moduleName)
+        }
+        exportMap.set(name, existing)
+      }
+    }
+
+    const indexFile = join(moduleDir, 'index.ts')
+    if (existsSync(schemasFile) && existsSync(indexFile)) {
+      const reExports = extractReExportsFromFile(indexFile)
+      for (const name of reExports) {
+        if (exportMap.has(name)) continue
+        const existing = exportMap.get(name) || []
+        if (!existing.includes(moduleName)) {
+          existing.push(moduleName)
+        }
+        exportMap.set(name, existing)
+      }
+    }
+  }
+
+  const errors: SchemaUniquenessError[] = []
+  for (const [exportName, modules] of exportMap) {
+    if (modules.length >= 2) {
+      const suggestions = modules.map(mod => `${capitalize(mod)}${exportName}`)
+      errors.push({
+        exportName,
+        modules,
+        suggestion: suggestions.join(' or '),
+      })
+    }
+  }
+
+  errors.sort((a, b) => a.exportName.localeCompare(b.exportName))
+  return errors
+}
+
+export function formatSchemaUniquenessErrors(errors: SchemaUniquenessError[]): string {
+  if (errors.length === 0) return ''
+
+  let output = `❌ Found ${errors.length} cross-module schema naming collision(s):\n\n`
+
+  for (const err of errors) {
+    output += `  "${err.exportName}" defined in: ${err.modules.join(', ')}\n`
+    output += `    → Suggestion: rename to ${err.suggestion}\n\n`
+  }
+
+  output += '📋 Guidelines:\n'
+  output += '  Each module should use unique schema names to avoid collisions\n'
+  output += '  when unified via src/shared/schemas/index.ts.\n'
+  output += '  Recommended pattern: {ModuleName}{SchemaName} (e.g. TodoSchema, OrderSchema)\n'
+
+  return output
+}

package/template/modules.config.ts

@@ -24,11 +24,13 @@ export const TEMPLATE_PRESETS: TemplatePreset[] = [
       'admin',
       'auth',
       'plugin',
+      'tenant',
       // Business (all depend on permission)
       'order',
       'ticket',
       'dispute',
       'content',
+      'merchant',
     ],
   },
   {

package/template/package.json

@@ -89,6 +89,8 @@
     "react-router-dom": "^7.13.1",
     "ws": "^8.18.3",
     "zod": "^4.4.3",
+    "i18next": "^24.2.3",
+    "react-i18next": "^15.5.3",
     "zustand": "^5.0.2"
   },
   "devDependencies": {

package/template/playwright.config.ts

@@ -58,5 +58,19 @@ export default defineConfig({
           : {}),
       },
     },
+    {
+      name: 'firefox',
+      use: {
+        ...devices['Desktop Firefox'],
+        ignoreHTTPSErrors: true,
+      },
+    },
+    {
+      name: 'webkit',
+      use: {
+        ...devices['Desktop Safari'],
+        ignoreHTTPSErrors: true,
+      },
+    },
   ],
 })

package/template/src/admin/App.tsx

@@ -1,5 +1,5 @@
 import { BrowserRouter, Routes, Route, Navigate } from 'react-router-dom'
-import { ConfigProvider } from 'antd'
+import { ConfigProvider, theme } from 'antd'
 import { Layout } from './layouts/Layout'
 import { DashboardPage } from './pages/DashboardPage'
 import { LoginPage } from './pages/LoginPage'
@@ -14,13 +14,50 @@ import { TicketsPage } from './pages/TicketsPage'
 import { DisputesPage } from './pages/DisputesPage'
 import { ContentPage } from './pages/ContentPage'
 import { ProtectedRoute, CaptchaModal } from './components'
+import { useThemeStore } from './stores/themeStore'
+import { useLanguage } from './i18n/useLanguage'
+
+const ComingSoonPage: React.FC<{ title: string }> = ({ title }) => {
+  const { t } = useLanguage()
+  return (
+    <div className="flex items-center justify-center h-full min-h-[400px]">
+      <div className="text-center">
+        <h2 className="text-2xl font-semibold mb-2">{title}</h2>
+        <p className="text-gray-400">{t('monitor.comingSoon')}</p>
+      </div>
+    </div>
+  )
+}
 
 export const App: React.FC<{ basePath?: string }> = ({ basePath = '/admin' }) => {
+  const mode = useThemeStore(state => state.mode)
+  const isDark = mode === 'dark'
+
   return (
     <ConfigProvider
       theme={{
+        algorithm: isDark ? theme.darkAlgorithm : theme.defaultAlgorithm,
         token: {
-          colorPrimary: '#1890ff',
+          colorPrimary: '#6366f1',
+        },
+        components: {
+          Menu: {
+            colorItemBg: 'transparent',
+            colorItemText: 'rgba(255, 255, 255, 0.7)',
+            colorItemTextHover: 'rgba(255, 255, 255, 0.9)',
+            colorItemBgHover: 'rgba(255, 255, 255, 0.08)',
+            colorItemBgSelected: 'rgba(99, 102, 241, 0.15)',
+            colorItemTextSelected: '#6366f1',
+            colorSubItemBg: '#000c17',
+            itemBorderRadius: 8,
+            itemMarginBlock: 2,
+            itemHeight: 40,
+          },
+          Layout: {
+            siderBg: '#001529',
+            headerBg: isDark ? '#141414' : '#ffffff',
+            bodyBg: isDark ? '#1f1f1f' : '#f5f6fa',
+          },
         },
       }}
     >
@@ -43,7 +80,7 @@ export const App: React.FC<{ basePath?: string }> = ({ basePath = '/admin' }) =>
                     <Route path="/content" element={<ContentPage />} />
                     <Route path="/system/settings" element={<SettingsPage />} />
                     <Route path="/system/logs" element={<SystemLogsPage />} />
-                    <Route path="/system/monitor" element={<div>系统监控页面（待开发）</div>} />
+                    <Route path="/system/monitor" element={<ComingSoonPage title="System Monitor" />} />
                     <Route path="/system/permissions" element={<PermissionsPage />} />
                     <Route path="/system/roles" element={<RolesPage />} />
                   </Routes>

package/template/src/admin/components/LanguageSwitcher.tsx

@@ -0,0 +1,22 @@
+import { Select } from 'antd'
+import { useLanguage, type Language } from '../i18n/useLanguage'
+
+const LANGUAGE_OPTIONS = [
+  { label: '中文', value: 'zh-CN' as Language },
+  { label: 'English', value: 'en-US' as Language },
+]
+
+export const LanguageSwitcher: React.FC = () => {
+  const { currentLanguage, changeLanguage } = useLanguage()
+
+  return (
+    <Select
+      size="small"
+      value={currentLanguage}
+      options={LANGUAGE_OPTIONS}
+      onChange={changeLanguage}
+      style={{ width: 90 }}
+      data-testid="language-switcher"
+    />
+  )
+}

package/template/src/admin/components/NotificationDrawer.tsx

@@ -1,6 +1,7 @@
 import { Bell, CheckCheck, Info, AlertTriangle, XCircle, CheckCircle } from 'lucide-react'
-import { Badge, Button, Drawer, Empty, Spin, Tabs } from 'antd'
+import { Badge, Button, Drawer, Empty, Spin, Tabs, theme } from 'antd'
 import type { AppNotification, NotificationType } from '@shared/schemas'
+import { useLanguage } from '../i18n/useLanguage'
 
 interface NotificationDrawerProps {
   open: boolean
@@ -14,31 +15,43 @@ interface NotificationDrawerProps {
 
 const typeConfig: Record<
   NotificationType,
-  { color: string; bgColor: string; icon: React.ReactNode }
+  {
+    colorToken: 'colorInfo' | 'colorWarning' | 'colorError' | 'colorSuccess'
+    bgToken:
+      | 'colorInfoBg'
+      | 'colorWarningBg'
+      | 'colorErrorBg'
+      | 'colorSuccessBg'
+    icon: React.ReactNode
+  }
 > = {
   info: {
-    color: '#1890ff',
-    bgColor: '#e6f7ff',
+    colorToken: 'colorInfo',
+    bgToken: 'colorInfoBg',
     icon: <Info className="w-4 h-4" />,
   },
   warning: {
-    color: '#faad14',
-    bgColor: '#fffbe6',
+    colorToken: 'colorWarning',
+    bgToken: 'colorWarningBg',
     icon: <AlertTriangle className="w-4 h-4" />,
   },
   error: {
-    color: '#ff4d4f',
-    bgColor: '#fff2f0',
+    colorToken: 'colorError',
+    bgToken: 'colorErrorBg',
     icon: <XCircle className="w-4 h-4" />,
   },
   success: {
-    color: '#52c41a',
-    bgColor: '#f6ffed',
+    colorToken: 'colorSuccess',
+    bgToken: 'colorSuccessBg',
     icon: <CheckCircle className="w-4 h-4" />,
   },
 }
 
-function formatTime(dateString: string): string {
+function formatTime(
+  dateString: string,
+  locale: string,
+  t: (key: string, options?: Record<string, unknown>) => string,
+): string {
   const date = new Date(dateString)
   const now = new Date()
   const diff = now.getTime() - date.getTime()
@@ -47,11 +60,11 @@ function formatTime(dateString: string): string {
   const hours = Math.floor(diff / 3600000)
   const days = Math.floor(diff / 86400000)
 
-  if (minutes < 1) return '刚刚'
-  if (minutes < 60) return `${minutes}分钟前`
-  if (hours < 24) return `${hours}小时前`
-  if (days < 7) return `${days}天前`
-  return date.toLocaleDateString('zh-CN')
+  if (minutes < 1) return t('notification.justNow')
+  if (minutes < 60) return t('notification.minutesAgo', { count: minutes })
+  if (hours < 24) return t('notification.hoursAgo', { count: hours })
+  if (days < 7) return t('notification.daysAgo', { count: days })
+  return date.toLocaleDateString(locale)
 }
 
 export const NotificationDrawer: React.FC<NotificationDrawerProps> = ({
@@ -63,31 +76,65 @@ export const NotificationDrawer: React.FC<NotificationDrawerProps> = ({
   onMarkAllAsRead,
   loading,
 }) => {
+  const { t, currentLanguage } = useLanguage()
+  const { token } = theme.useToken()
+
   const renderNotificationItem = (notif: AppNotification) => {
     const config = typeConfig[notif.type]
+    const bgColor = token[config.bgToken]
+    const fgColor = token[config.colorToken]
 
     return (
       <div
         key={notif.id}
-        className={`p-4 border-b border-gray-100 hover:bg-gray-50 cursor-pointer transition-colors ${
-          !notif.read ? 'bg-blue-50/50' : ''
-        }`}
+        className="p-4 cursor-pointer transition-colors"
+        style={{
+          borderBottom: `1px solid ${token.colorBorderSecondary}`,
+          backgroundColor: !notif.read ? token.colorInfoBg : undefined,
+        }}
         onClick={() => !notif.read && onMarkAsRead(notif.id)}
+        onMouseEnter={e =>
+          (e.currentTarget.style.backgroundColor = token.colorBgTextHover)
+        }
+        onMouseLeave={e =>
+          (e.currentTarget.style.backgroundColor =
+            !notif.read ? token.colorInfoBg : undefined)
+        }
       >
         <div className="flex items-start gap-3">
           <div
             className="flex-shrink-0 w-10 h-10 rounded-full flex items-center justify-center"
-            style={{ backgroundColor: config.bgColor, color: config.color }}
+            style={{ backgroundColor: bgColor, color: fgColor }}
           >
             {config.icon}
           </div>
           <div className="flex-1 min-w-0">
             <div className="flex items-center gap-2">
-              <span className="font-medium text-gray-900 truncate">{notif.title}</span>
-              {!notif.read && <span className="w-2 h-2 rounded-full bg-blue-500 flex-shrink-0" />}
+              <span
+                className="font-medium truncate"
+                style={{ color: token.colorText }}
+              >
+                {notif.title}
+              </span>
+              {!notif.read && (
+                <span
+                  className="w-2 h-2 rounded-full flex-shrink-0"
+                  style={{ backgroundColor: token.colorPrimary }}
+                />
+              )}
             </div>
-            <p className="text-sm text-gray-500 mt-1 line-clamp-2">{notif.message}</p>
-            <span className="text-xs text-gray-400 mt-1 block">{formatTime(notif.createdAt)}</span>
+            <p
+              className="text-sm mt-1 line-clamp-2"
+              style={{ color: token.colorTextSecondary }}
+            >
+              {notif.message}
+            </p>
+            <span
+              className="text-xs mt-1 block"
+              style={{ color: token.colorTextTertiary }}
+            >
+              {formatTime(notif.createdAt, currentLanguage, t)}
+            </span>
           </div>
         </div>
       </div>
@@ -100,15 +147,22 @@ export const NotificationDrawer: React.FC<NotificationDrawerProps> = ({
   const tabItems = [
     {
       key: 'all',
-      label: `全部 (${notifications.length})`,
+      label: `${t('notification.all')} (${notifications.length})`,
       children: (
-        <div className="overflow-y-auto" style={{ maxHeight: 'calc(100vh - 200px)' }}>
+        <div
+          className="overflow-y-auto"
+          style={{ maxHeight: 'calc(100vh - 200px)' }}
+        >
           {loading ? (
             <div className="flex items-center justify-center py-12">
               <Spin />
             </div>
           ) : notifications.length === 0 ? (
-            <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} description="暂无通知" className="py-12" />
+            <Empty
+              image={Empty.PRESENTED_IMAGE_SIMPLE}
+              description={t('notification.noNotifications')}
+              className="py-12"
+            />
           ) : (
             notifications.map(renderNotificationItem)
           )}
@@ -117,13 +171,16 @@ export const NotificationDrawer: React.FC<NotificationDrawerProps> = ({
     },
     {
       key: 'unread',
-      label: `未读 (${unreadNotifications.length})`,
+      label: `${t('notification.unread')} (${unreadNotifications.length})`,
       children: (
-        <div className="overflow-y-auto" style={{ maxHeight: 'calc(100vh - 200px)' }}>
+        <div
+          className="overflow-y-auto"
+          style={{ maxHeight: 'calc(100vh - 200px)' }}
+        >
           {unreadNotifications.length === 0 ? (
             <Empty
               image={Empty.PRESENTED_IMAGE_SIMPLE}
-              description="暂无未读通知"
+              description={t('notification.noUnread')}
               className="py-12"
             />
           ) : (
@@ -134,13 +191,16 @@ export const NotificationDrawer: React.FC<NotificationDrawerProps> = ({
     },
     {
       key: 'read',
-      label: `已读 (${readNotifications.length})`,
+      label: `${t('notification.read')} (${readNotifications.length})`,
       children: (
-        <div className="overflow-y-auto" style={{ maxHeight: 'calc(100vh - 200px)' }}>
+        <div
+          className="overflow-y-auto"
+          style={{ maxHeight: 'calc(100vh - 200px)' }}
+        >
           {readNotifications.length === 0 ? (
             <Empty
               image={Empty.PRESENTED_IMAGE_SIMPLE}
-              description="暂无已读通知"
+              description={t('notification.noRead')}
               className="py-12"
             />
           ) : (
@@ -155,7 +215,7 @@ export const NotificationDrawer: React.FC<NotificationDrawerProps> = ({
     <Drawer
       title={
         <div className="flex items-center justify-between">
-          <span>通知中心</span>
+          <span>{t('notification.center')}</span>
           {unreadCount > 0 && (
             <Button
               type="link"
@@ -164,7 +224,7 @@ export const NotificationDrawer: React.FC<NotificationDrawerProps> = ({
               onClick={onMarkAllAsRead}
               className="text-xs"
             >
-              全部已读
+              {t('notification.markAllRead')}
             </Button>
           )}
         </div>
@@ -174,7 +234,7 @@ export const NotificationDrawer: React.FC<NotificationDrawerProps> = ({
       open={open}
       width={400}
       styles={{
-        header: { borderBottom: '1px solid #f0f0f0' },
+        header: { borderBottom: `1px solid ${token.colorBorderSecondary}` },
         body: { padding: 0 },
       }}
     >
@@ -187,12 +247,22 @@ export const NotificationBell: React.FC<{
   unreadCount: number
   onClick: () => void
 }> = ({ unreadCount, onClick }) => {
+  const { token } = theme.useToken()
+
   return (
     <button
-      className="p-2 rounded-lg hover:bg-gray-100 transition-colors relative"
+      data-testid="notification-bell"
+      className="p-2 rounded-lg transition-colors relative"
+      style={{ color: token.colorTextSecondary }}
       onClick={onClick}
+      onMouseEnter={e =>
+        (e.currentTarget.style.backgroundColor = token.colorBgTextHover)
+      }
+      onMouseLeave={e =>
+        (e.currentTarget.style.backgroundColor = 'transparent')
+      }
     >
-      <Bell className="w-5 h-5 text-gray-600" />
+      <Bell className="w-5 h-5" />
       {unreadCount > 0 && (
         <Badge
           count={unreadCount > 99 ? '99+' : unreadCount}

package/template/src/admin/components/StatsCard.tsx

@@ -1,6 +1,7 @@
 import { Card, Statistic } from 'antd'
 import { ArrowUpOutlined, ArrowDownOutlined } from '@ant-design/icons'
 import type { ReactNode } from 'react'
+import { useLanguage } from '../i18n/useLanguage'
 
 interface StatsCardProps {
   title: string
@@ -22,6 +23,7 @@ export const StatsCard: React.FC<StatsCardProps> = ({
   trend,
   loading,
 }) => {
+  const { t } = useLanguage()
   return (
     <Card loading={loading}>
       <Statistic
@@ -36,7 +38,7 @@ export const StatsCard: React.FC<StatsCardProps> = ({
           <span style={{ color: trend.isUp ? '#3f8600' : '#cf1322' }}>
             {trend.isUp ? <ArrowUpOutlined /> : <ArrowDownOutlined />} {Math.abs(trend.value)}%
           </span>
-          <span className="text-gray-400 ml-2">vs last month</span>
+          <span className="text-gray-400 ml-2">{t('common.vsLastMonth')}</span>
         </div>
       )}
     </Card>

package/template/src/admin/components/ThemeToggle.tsx

@@ -0,0 +1,28 @@
+import { Sun, Moon } from 'lucide-react'
+import { theme } from 'antd'
+import { useThemeStore } from '../stores/themeStore'
+import { useLanguage } from '../i18n/useLanguage'
+
+export const ThemeToggle: React.FC = () => {
+  const { mode, toggleTheme } = useThemeStore()
+  const { t } = useLanguage()
+  const { token } = theme.useToken()
+
+  return (
+    <button
+      onClick={toggleTheme}
+      className="p-2 rounded-lg transition-colors cursor-pointer border-none bg-transparent"
+      style={{ color: token.colorText }}
+      onMouseEnter={(e) => {
+        e.currentTarget.style.backgroundColor = token.colorFillQuaternary
+      }}
+      onMouseLeave={(e) => {
+        e.currentTarget.style.backgroundColor = 'transparent'
+      }}
+      title={mode === 'light' ? t('theme.toggleDark') : t('theme.toggleLight')}
+      data-testid="theme-toggle"
+    >
+      {mode === 'light' ? <Moon className="w-4 h-4" /> : <Sun className="w-4 h-4" />}
+    </button>
+  )
+}

package/template/src/admin/hooks/useRoles.ts

@@ -1,9 +1,9 @@
 import { create } from 'zustand'
 import { apiClient } from '../services/apiClient'
-import type { RoleType, CreateRoleType, UpdateRoleType } from '@shared/modules/role/schemas'
+import type { RoleDataType, CreateRoleType, UpdateRoleType } from '@shared/modules/role/schemas'
 
 interface RoleState {
-  roles: RoleType[]
+  roles: RoleDataType[]
   loading: boolean
   error: string | null
   fetchRoles: () => Promise<void>

package/template/src/admin/i18n/index.ts

@@ -0,0 +1,18 @@
+import i18n from 'i18next'
+import { initReactI18next } from 'react-i18next'
+import zhCN from './locales/zh-CN.json'
+import enUS from './locales/en-US.json'
+
+i18n.use(initReactI18next).init({
+  resources: {
+    'zh-CN': { translation: zhCN },
+    'en-US': { translation: enUS },
+  },
+  lng: 'zh-CN',
+  fallbackLng: 'zh-CN',
+  interpolation: {
+    escapeValue: false,
+  },
+})
+
+export default i18n