@wzyjs/cli 0.3.32 → 0.3.37

package/template/web/base/src/server/db/client.ts

@@ -0,0 +1,19 @@
+import { PrismaClient } from '@prisma/client'
+
+import { env } from '@/env'
+
+const createPrismaClient = () => {
+  return new PrismaClient({
+    log: env.NODE_ENV === 'development' ? ['error', 'warn'] : ['error'],
+  })
+}
+
+const globalForPrisma = globalThis as unknown as {
+  prisma: ReturnType<typeof createPrismaClient> | undefined
+}
+
+export const db = globalForPrisma.prisma ?? createPrismaClient()
+
+if (env.NODE_ENV !== 'production') {
+  globalForPrisma.prisma = db
+}

package/template/web/base/src/server/routers/index.ts

@@ -0,0 +1,3 @@
+import { createRouter } from '../generated/trpc/routers'
+
+export default createRouter()

package/template/web/base/src/server/trpc/context.ts

@@ -0,0 +1,14 @@
+import { db } from '@/server/db/client'
+
+import { enhance } from '../generated/enhancer/enhance'
+
+export const createTRPCContext = async (opts?: { req?: Request }) => {
+  return {
+    // db, 严禁使用这个模块，而应该使用 prisma
+    req: opts?.req,
+    headers: opts?.req?.headers,
+    prisma: enhance(db),
+  }
+}
+
+export type TRPCContext = Awaited<ReturnType<typeof createTRPCContext>>

package/template/web/base/src/server/trpc/index.ts

@@ -0,0 +1 @@
+export { apiRouter, type ApiRouter, type ApiRouterInput, type ApiRouterOutput } from './router'

package/template/web/base/src/server/trpc/init.ts

@@ -0,0 +1,27 @@
+import { initTRPC } from '@trpc/server'
+import superjson from 'superjson'
+import { ZodError } from 'zod'
+import { fromZodError } from 'zod-validation-error'
+
+import { type TRPCContext } from './context'
+
+const t = initTRPC.context<TRPCContext>().create({
+  transformer: superjson,
+  errorFormatter({ shape, error }) {
+    return {
+      ...shape,
+      data: {
+        ...shape.data,
+        formattedError:
+          error.cause instanceof ZodError
+            ? fromZodError(error.cause).message
+            : null,
+      },
+    }
+  },
+})
+
+export const createCallerFactory = t.createCallerFactory
+export const createTRPCRouter = t.router
+export const createTRPCProcedure = t.procedure
+export const mergeTRPCRouters = t.mergeRouters

package/template/web/base/src/server/trpc/procedures.ts

@@ -0,0 +1,5 @@
+import { createTRPCProcedure } from './init'
+
+export const publicProcedure = createTRPCProcedure
+
+export const procedure = createTRPCProcedure

package/template/web/base/src/server/trpc/router.ts

@@ -0,0 +1,11 @@
+import type { inferRouterInputs, inferRouterOutputs } from '@trpc/server'
+
+import routes from '../routers'
+
+export const apiRouter = routes
+
+export type ApiRouter = typeof apiRouter
+
+export type ApiRouterInput = inferRouterInputs<ApiRouter>
+
+export type ApiRouterOutput = inferRouterOutputs<ApiRouter>

package/template/web/base/src/server/utils/index.ts

@@ -0,0 +1 @@
+export * from '@wzyjs/utils/node'

package/template/web/base/src/styles/globals.css

@@ -0,0 +1,3 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;

package/template/web/base/src/types/index.ts

@@ -0,0 +1 @@
+export type { ApiRouterInput, ApiRouterOutput } from '@/server/trpc'

package/template/web/base/src/utils/index.ts

@@ -0,0 +1,4 @@
+export * from '@wzyjs/utils/web'
+
+export { getQueryClient } from './query-client'
+export { api, createApiClient } from './trpc'

package/template/web/base/src/utils/query-client/index.ts

@@ -0,0 +1,31 @@
+import SuperJSON from 'superjson'
+import { QueryClient, defaultShouldDehydrateQuery } from '@tanstack/react-query'
+
+let clientQueryClientSingleton: QueryClient | undefined = undefined
+
+const createQueryClient = () => {
+  return new QueryClient({
+    defaultOptions: {
+      queries: {
+        staleTime: 30 * 1000,
+      },
+      hydrate: {
+        deserializeData: SuperJSON.deserialize,
+      },
+      dehydrate: {
+        serializeData: SuperJSON.serialize,
+        shouldDehydrateQuery: (query) => {
+          return defaultShouldDehydrateQuery(query) || query.state.status === 'pending'
+        },
+      },
+    },
+  })
+}
+
+export const getQueryClient = () => {
+  if (typeof window === 'undefined') {
+    return createQueryClient()
+  }
+
+  return (clientQueryClientSingleton ??= createQueryClient())
+}

package/template/web/base/src/utils/trpc/index.ts

@@ -0,0 +1,23 @@
+'use client'
+
+import SuperJSON from 'superjson'
+
+import { createTRPCReact } from '@trpc/react-query'
+import { httpBatchLink } from '@trpc/client'
+
+import { type ApiRouter } from '@/server/trpc'
+import { errorLink, getBaseUrl } from './utils'
+
+export const api = createTRPCReact<ApiRouter>()
+
+export const createApiClient = () => {
+  return api.createClient({
+    links: [
+      errorLink,
+      httpBatchLink({
+        transformer: SuperJSON,
+        url: getBaseUrl() + '/api/trpc',
+      }),
+    ],
+  })
+}

package/template/web/base/src/utils/trpc/utils.ts

@@ -0,0 +1,61 @@
+'use client'
+
+import { type TRPCLink } from '@trpc/client'
+import { observable } from '@trpc/server/observable'
+
+import { message } from '@/components'
+import { authExemptPaths } from '@/consts'
+import { type ApiRouter } from '@/server/trpc'
+
+const isRN = () => {
+  return typeof navigator !== 'undefined' && navigator.product === 'ReactNative'
+}
+
+const redirectToSignIn = () => {
+  if (typeof window === 'undefined') {
+    return
+  }
+
+  const authExemptPathSet = new Set(authExemptPaths)
+  if (authExemptPathSet.has(window.location.pathname)) {
+    return
+  }
+
+  const callbackUrl = `${window.location.pathname}${window.location.search}${window.location.hash}`
+  window.location.replace(`/auth/signin?callbackUrl=${encodeURIComponent(callbackUrl)}`)
+}
+
+export const getBaseUrl = () => {
+  if (isRN()) {
+    if (__DEV__) {
+      return 'http://192.168.1.16:3000'
+    }
+    return 'https://app.zhenyu.pro'
+  }
+  if (typeof window !== 'undefined') {
+    return window.location.origin
+  }
+  return `http://localhost:${process.env.PORT ?? 3000}`
+}
+
+export const errorLink: TRPCLink<ApiRouter> = () => {
+  return ({ next, op }) => {
+    return observable(observer => {
+      const subscription = next(op).subscribe({
+        next: value => observer.next(value),
+        complete: () => observer.complete(),
+        error: err => {
+          if (isRN()) {
+            console.error(666, 'tRPC request failed:', err)
+          } else if (err.data?.code === 'UNAUTHORIZED') {
+            redirectToSignIn()
+          } else {
+            void message.error(err.data?.formattedError || err.message || '操作失败')
+          }
+          observer.error(err)
+        },
+      })
+      return () => subscription.unsubscribe()
+    })
+  }
+}

package/template/web/base/tailwind.config.cjs

@@ -0,0 +1,7 @@
+/** @type {import('tailwindcss').Config} */
+module.exports = {
+  content: ['./src/**/*.tsx', './src/**/*.ts'],
+  darkMode: 'class',
+  plugins: [],
+  theme: {},
+}

package/template/web/base/tsconfig.json

@@ -0,0 +1,46 @@
+{
+  "compilerOptions": {
+    "esModuleInterop": true,
+    "skipLibCheck": true,
+    "target": "es2022",
+    "allowJs": true,
+    "resolveJsonModule": true,
+    "moduleDetection": "force",
+    "isolatedModules": true,
+    "strict": true,
+    "noUncheckedIndexedAccess": true,
+    "checkJs": true,
+    "lib": ["dom", "dom.iterable", "ES2022"],
+    "noEmit": true,
+    "module": "ESNext",
+    "moduleResolution": "Bundler",
+    "jsx": "react-jsx",
+    "plugins": [
+      {
+        "name": "next"
+      }
+    ],
+    "incremental": true,
+    "tsBuildInfoFile": ".next/cache/tsconfig.tsbuildinfo",
+    "baseUrl": ".",
+    "paths": {
+      "@/*": ["./src/*"],
+      "@prisma/client": ["./src/server/generated/prisma-client"]
+    }
+  },
+  "include": [
+    ".eslintrc.cjs",
+    "next-env.d.ts",
+    "**/*.ts",
+    "**/*.tsx",
+    "**/*.cjs",
+    "**/*.js",
+    ".next/types/**/*.ts",
+    ".next/dev/types/**/*.ts"
+  ],
+  "exclude": [
+    "node_modules",
+    "src/server/generated",
+    "**/.next"
+  ]
+}

package/template/web/google/_env

@@ -0,0 +1,8 @@
+# 数据库配置
+DATABASE_URL=postgresql://root:password.@localhost:5432/demo
+
+# Google 登录
+NEXTAUTH_URL=http://localhost:4000
+NEXTAUTH_SECRET=
+GOOGLE_CLIENT_ID=
+GOOGLE_CLIENT_SECRET=

package/template/web/google/package.json

@@ -0,0 +1,55 @@
+{
+  "name": "__WZYJS_APP_NAME__",
+  "version": "0.1.0",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "dev": "next dev --turbopack",
+    "build": "NODE_ENV=production next build --turbopack",
+    "start": "next start",
+    "generate": "rm -rf src/server/generated && zenstack generate --output ./src/server/generated/.zenstack --no-compile --schema ./prisma/schema.zmodel",
+    "db:push": "prisma db push",
+    "lint": "eslint .",
+    "typecheck": "tsc --noEmit",
+    "check": "bun run lint && bun run typecheck",
+    "postinstall": "bun run generate"
+  },
+  "dependencies": {
+    "@auth/prisma-adapter": "^2.9.1",
+    "@prisma/client": "^6.14.0",
+    "@t3-oss/env-nextjs": "^0.10.1",
+    "@tanstack/react-query": "^5.50.0",
+    "@trpc/client": "^11.7.0",
+    "@trpc/next": "^11.7.0",
+    "@trpc/react-query": "^11.7.0",
+    "@trpc/server": "^11.7.0",
+    "@wzyjs/hooks": "workspace:*",
+    "@wzyjs/next": "workspace:*",
+    "@wzyjs/utils": "workspace:*",
+    "@wzyjs/uis": "workspace:*",
+    "@zenstackhq/runtime": "2.22.1",
+    "@zenstackhq/trpc": "2.22.1",
+    "antd": "^6.3.1",
+    "next": "^16.2.9",
+    "next-auth": "^4.24.11",
+    "react": "^19.1.0",
+    "react-dom": "^19.1.0",
+    "server-only": "^0.0.1",
+    "superjson": "^2.2.1",
+    "zenstack": "2.22.1",
+    "zod": "^3.23.3",
+    "zod-validation-error": "^3.4.0"
+  },
+  "devDependencies": {
+    "@types/node": "^20",
+    "@types/react": "19.1.10",
+    "@types/react-dom": "^19",
+    "eslint": "^9",
+    "eslint-config-next": "^16.2.9",
+    "postcss": "^8.4.39",
+    "prisma": "^6.14.0",
+    "prisma-json-types-generator": "^3.3.0",
+    "tailwindcss": "^3.4.3",
+    "typescript": "^5"
+  }
+}

package/template/web/google/prisma/models/auth/Account.zmodel

@@ -0,0 +1,26 @@
+import "@wzyjs/next/Base"
+import "./User"
+
+model AuthAccount extends Base {
+  userId            String
+  type              String
+  provider          String
+  providerAccountId String
+  refresh_token     String?  @db.Text
+  access_token      String?  @db.Text
+  expires_at        Int?
+  token_type        String?
+  scope             String?
+  id_token          String?  @db.Text
+  session_state     String?
+
+  user              AuthUser @relation("AuthUserToAccount", fields: [userId], references: [id], onDelete: Cascade)
+
+  @@unique([provider, providerAccountId])
+  @@deny('all', auth() == null)
+  @@deny('read', isDeleted)
+  @@deny('read', userId != auth().id)
+  @@deny('create', true)
+  @@deny('update', true)
+  @@deny('delete', true)
+}

package/template/web/google/prisma/models/auth/Session.zmodel

@@ -0,0 +1,17 @@
+import "@wzyjs/next/Base"
+import "./User"
+
+model AuthSession extends Base {
+  sessionToken String   @unique
+  userId       String
+  expires      DateTime
+
+  user         AuthUser @relation("AuthUserToSession", fields: [userId], references: [id], onDelete: Cascade)
+
+  @@deny('all', auth() == null)
+  @@deny('read', isDeleted)
+  @@deny('read', userId != auth().id)
+  @@deny('create', true)
+  @@deny('update', true)
+  @@deny('delete', true)
+}

package/template/web/google/prisma/models/auth/User.zmodel

@@ -0,0 +1,22 @@
+import "@wzyjs/next/Base"
+
+import "./Account"
+import "./Session"
+
+model AuthUser extends Base {
+  email         String        @unique @deny('update', true)
+  emailVerified DateTime?
+  name          String?
+  image         String?
+
+  accounts      AuthAccount[] @relation("AuthUserToAccount")
+  sessions      AuthSession[] @relation("AuthUserToSession")
+
+  @@auth()
+  @@deny('all', auth() == null)
+  @@deny('read', isDeleted)
+  @@deny('read', id != auth().id)
+  @@deny('update', id != auth().id)
+  @@deny('create', true)
+  @@deny('delete', true)
+}

package/template/web/google/prisma/schema.zmodel

@@ -0,0 +1,2 @@
+import "./models/auth/User"
+import "./models/demo/DemoItem"

package/template/web/google/src/app/api/auth/[...nextauth]/route.ts

@@ -0,0 +1,7 @@
+import NextAuth from 'next-auth'
+
+import { auth } from '@/server/auth/next-auth/options'
+
+const handler = NextAuth(auth)
+
+export { handler as GET, handler as POST }

package/template/web/google/src/app/auth/error/page.tsx

@@ -0,0 +1,56 @@
+'use client'
+
+import Link from 'next/link'
+import { Suspense } from 'react'
+import { useSearchParams } from 'next/navigation'
+
+import { Button, PanelPage, Result, Spin, Typography } from '@/components'
+
+const errorMessageMap: Record<string, string> = {
+  OAuthSignin: '无法发起 Google 登录，请稍后再试。',
+  OAuthCallback: 'Google 登录回调失败，请检查回调地址配置。',
+  OAuthCreateAccount: '创建登录账号失败，请稍后再试。',
+  EmailCreateAccount: '创建登录账号失败，请稍后再试。',
+  Callback: '登录流程中断，请重新发起登录。',
+  OAuthAccountNotLinked: '当前邮箱已绑定其他登录方式。',
+  EmailSignin: '邮件登录失败。',
+  CredentialsSignin: '账号校验失败。',
+  SessionRequired: '当前页面需要先登录。',
+  default: '登录失败，请稍后重试。',
+}
+
+const AuthErrorContent = () => {
+  const searchParams = useSearchParams()
+  const error = searchParams.get('error') || 'default'
+
+  return (
+    <PanelPage eyebrow='Authentication Exception' title='登录失败'>
+      <Result
+        status='error'
+        title='本次认证没有成功完成'
+        subTitle={errorMessageMap[error] ?? errorMessageMap.default}
+        extra={[
+          <Link href='/auth/signin' key='signin'>
+            <Button type='primary' className='!rounded-lg px-6'>
+              返回登录页
+            </Button>
+          </Link>,
+        ]}
+      />
+
+      <div className='mx-4 mb-4 rounded-lg bg-white/70 p-5 dark:bg-white/5 sm:mx-6'>
+        <Typography.Paragraph className='!mb-0 text-center !text-sm !leading-6 !text-slate-500 dark:!text-slate-300'>
+          请检查 Google OAuth Client、NEXTAUTH_URL 和 NEXTAUTH_SECRET 配置。
+        </Typography.Paragraph>
+      </div>
+    </PanelPage>
+  )
+}
+
+export default function AuthErrorPage() {
+  return (
+    <Suspense fallback={<Spin />}>
+      <AuthErrorContent />
+    </Suspense>
+  )
+}

package/template/web/google/src/app/auth/signin/page.tsx

@@ -0,0 +1,83 @@
+'use client'
+
+import { Suspense, useEffect } from 'react'
+import { signIn, useSession } from 'next-auth/react'
+import { useRouter, useSearchParams } from 'next/navigation'
+
+import { App, Button, GoogleOutlined, PanelPage, Space, Spin, Typography } from '@/components'
+import { getSafeCallbackPath } from '@/utils'
+
+const { Text } = Typography
+
+const SignInPage = () => {
+  const { message } = App.useApp()
+  const { data: session, status } = useSession()
+  const router = useRouter()
+  const searchParams = useSearchParams()
+
+  const callbackUrl = getSafeCallbackPath(searchParams.get('callbackUrl'), '/')
+  const error = searchParams.get('error')
+
+  useEffect(() => {
+    if (status === 'authenticated' && session) {
+      router.push(callbackUrl)
+    }
+  }, [callbackUrl, router, session, status])
+
+  const onGoogleSignIn = async () => {
+    try {
+      await signIn('google', { callbackUrl })
+    } catch (signinError) {
+      console.error(666, '登录失败:', signinError)
+      void message.error('登录失败，请稍后重试')
+    }
+  }
+
+  return (
+    <PanelPage
+      eyebrow='Google Sign In'
+      title='账号登录'
+      description='使用 Google 账号登录后即可访问应用。'
+    >
+      <Space orientation='vertical' size='large' className='w-full'>
+        {error ? (
+          <div className='rounded-lg border border-red-200 bg-red-50/90 p-4 text-left dark:border-red-500/30 dark:bg-red-500/10'>
+            <div className='text-sm font-semibold text-red-700 dark:text-red-300'>
+              登录流程没有完成
+            </div>
+            <p className='mt-2 text-sm leading-6 text-red-600 dark:text-red-200'>
+              请重试一次；如果问题持续出现，优先检查 Google Client 配置和回调地址。
+            </p>
+          </div>
+        ) : null}
+
+        <Button
+          type='primary'
+          size='large'
+          className='!h-12 !rounded-lg !text-sm !font-semibold shadow-sm'
+          icon={<GoogleOutlined />}
+          onClick={() => {
+            void onGoogleSignIn()
+          }}
+          block
+        >
+          使用 Google 登录
+        </Button>
+
+        <div className='rounded-lg bg-white/70 p-5 text-center dark:bg-white/5'>
+          <Text className='text-sm leading-6 text-slate-500 dark:text-slate-300'>
+            首次使用前，请在 `.env` 中配置 Google OAuth Client 信息。
+          </Text>
+        </div>
+      </Space>
+    </PanelPage>
+  )
+}
+
+export default function SignIn() {
+  return (
+    <Suspense fallback={<Spin />}>
+      <SignInPage />
+    </Suspense>
+  )
+}

package/template/web/google/src/app/layout.tsx

@@ -0,0 +1,35 @@
+import { type ReactNode } from 'react'
+import { type Metadata } from 'next'
+
+import { AuthGuard } from '@/components/base/AuthGuard'
+import { Providers } from '@/components/base/Providers'
+import { Layout } from '@/components/base/Layout'
+
+import '@/styles/globals.css'
+
+export const metadata: Metadata = {
+  title: '__WZYJS_APP_DISPLAY_NAME__',
+  icons: [{ rel: 'icon', url: '/favicon.ico' }],
+}
+
+interface RootLayoutProps {
+  children: ReactNode
+}
+
+export default function RootLayout(props: RootLayoutProps) {
+  const { children } = props
+
+  return (
+    <html lang='zh-CN' suppressHydrationWarning>
+      <body suppressHydrationWarning>
+        <Providers>
+          <AuthGuard>
+            <Layout>
+              {children}
+            </Layout>
+          </AuthGuard>
+        </Providers>
+      </body>
+    </html>
+  )
+}

package/template/web/google/src/components/base/AuthGuard/Loading.tsx

@@ -0,0 +1,19 @@
+'use client'
+
+import { Spin, Typography } from '@/components'
+
+export const LayoutLoading = () => {
+  return (
+    <div className='flex min-h-screen items-center justify-center bg-slate-50 p-6 text-slate-950 transition-colors dark:bg-[#14171c] dark:text-[#e8edf5]'>
+      <div className='w-full max-w-md rounded-lg border border-slate-200 bg-white p-8 text-center shadow-sm dark:border-[#303846] dark:bg-[#1b2028]'>
+        <Spin size='large' />
+        <Typography.Title level={4} className='!mb-0 !mt-6 !text-xl !font-semibold !text-slate-950 dark:!text-[#e8edf5]'>
+          正在加载
+        </Typography.Title>
+        <Typography.Text className='mt-3 text-sm leading-6 text-slate-500 dark:text-slate-300'>
+          请稍候，正在准备页面内容。
+        </Typography.Text>
+      </div>
+    </div>
+  )
+}

package/template/web/google/src/components/base/AuthGuard/index.tsx

@@ -0,0 +1,45 @@
+'use client'
+
+import { type ReactNode, useEffect } from 'react'
+import { useSession } from 'next-auth/react'
+import { usePathname, useRouter } from 'next/navigation'
+
+import { authExemptPaths } from '@/consts'
+
+import { LayoutLoading } from './Loading'
+
+interface AuthGuardProps {
+  children: ReactNode
+}
+
+export const AuthGuard = (props: AuthGuardProps) => {
+  const { children } = props
+
+  const { status } = useSession()
+  const pathname = usePathname()
+  const router = useRouter()
+
+  const isAuthExemptPath = pathname ? authExemptPaths.includes(pathname) : false
+
+  useEffect(() => {
+    if (!pathname || status !== 'unauthenticated' || isAuthExemptPath) {
+      return
+    }
+
+    router.replace(`/auth/signin?callbackUrl=${encodeURIComponent(pathname)}`)
+  }, [isAuthExemptPath, pathname, router, status])
+
+  if (status === 'loading') {
+    return <LayoutLoading />
+  }
+
+  if (isAuthExemptPath) {
+    return children
+  }
+
+  if (status === 'unauthenticated') {
+    return null
+  }
+
+  return children
+}