+ {props.items.map((item) => {
+ const isSelected = item.href === location.pathname;
+
+ return (
+
+ );
+ })}
+
+ 1
+ {props.list}
2
+
+
+
+ );
+}
diff --git a/src/client/routes/login.tsx b/src/client/routes/login.tsx
new file mode 100644
index 0000000..9c4d0de
--- /dev/null
+++ b/src/client/routes/login.tsx
@@ -0,0 +1,101 @@
+import {
+ createFileRoute,
+ getRouteApi,
+ useNavigate,
+} from '@tanstack/react-router';
+import { useRequest } from '@/hooks/useRequest';
+import { setJWT } from '@/api/auth';
+import { useGlobalConfig } from '@/hooks/useConfig';
+import { trpc } from '@/api/trpc';
+import { Button, Form, Input, Typography } from 'antd';
+import { useTranslation } from '@i18next-toolkit/react';
+import { setUserInfo } from '@/store/user';
+import { z } from 'zod';
+
+export const Route = createFileRoute('/login')({
+ validateSearch: z.object({
+ // redirect: z.string().catch('/'),
+ redirect: z.string().optional(),
+ }),
+ component: LoginComponent,
+});
+
+const routeApi = getRouteApi('/login');
+
+function LoginComponent() {
+ const navigate = useNavigate();
+ const { t } = useTranslation();
+ const loginMutation = trpc.user.login.useMutation();
+ const search = routeApi.useSearch();
+
+ const [{ loading }, handleLogin] = useRequest(async (values: any) => {
+ const res = await loginMutation.mutateAsync({
+ username: values.username,
+ password: values.password,
+ });
+
+ setJWT(res.token);
+ setUserInfo(res.info);
+ navigate({
+ to: search.redirect ?? '/dashboard',
+ });
+ });
+ const { allowRegister } = useGlobalConfig();
+
+ return (
+ Welcome Home!
+
+
+ );
+}
diff --git a/src/client/routes/register.tsx b/src/client/routes/register.tsx
new file mode 100644
index 0000000..90671aa
--- /dev/null
+++ b/src/client/routes/register.tsx
@@ -0,0 +1,71 @@
+import { Button, Form, Input, Typography } from 'antd';
+import React from 'react';
+import { useNavigate } from 'react-router';
+import { useRequest } from '../hooks/useRequest';
+import { trpc } from '../api/trpc';
+import { setJWT } from '../api/auth';
+import { setUserInfo } from '../store/user';
+import { useTranslation } from '@i18next-toolkit/react';
+import { createFileRoute } from '@tanstack/react-router';
+
+export const Route = createFileRoute('/register')({
+ component: RegisterComponent,
+});
+
+function RegisterComponent() {
+ const { t } = useTranslation();
+ const navigate = useNavigate();
+
+ const mutation = trpc.user.register.useMutation();
+
+ const [{ loading }, handleRegister] = useRequest(async (values: any) => {
+ const res = await mutation.mutateAsync({
+ username: values.username,
+ password: values.password,
+ });
+ setJWT(res.token);
+ setUserInfo(res.info);
+
+ navigate('/dashboard');
+ });
+
+ return (
+
+
+ Tianji
+
+
+
+
+ 
+
+
+
+
+ );
+}
diff --git a/src/client/routes/website.tsx b/src/client/routes/website.tsx
new file mode 100644
index 0000000..0dfae2a
--- /dev/null
+++ b/src/client/routes/website.tsx
@@ -0,0 +1,71 @@
+import { trpc } from '@/api/trpc';
+import { CommonList } from '@/components/CommonList';
+import { Input } from '@/components/ui/input';
+import { Separator } from '@/components/ui/separator';
+import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
+import { LayoutV2 } from '@/pages/LayoutV2';
+import { useCurrentWorkspaceId } from '@/store/user';
+import { routeAuthBeforeLoad } from '@/utils/route';
+import { createFileRoute } from '@tanstack/react-router';
+import { LuSearch } from 'react-icons/lu';
+
+export const Route = createFileRoute('/website')({
+ beforeLoad: routeAuthBeforeLoad,
+ component: WebsiteComponent,
+});
+
+function WebsiteComponent() {
+ const workspaceId = useCurrentWorkspaceId();
+ const { data = [] } = trpc.website.all.useQuery({
+ workspaceId,
+ });
+
+ const items = data.map((item) => ({
+ id: item.id,
+ title: item.name,
+ content: item.domain,
+ tags: [],
+ href: `/website/${item.id}`,
+ }));
+
+ return (
+
+
+ {t('Register Account')}
+
+
+
+
+
+
+
+
+
+
+ All mail
+
+
+ Unread
+
+
+
+ Website
+
+
+
+ website: {params.websiteId}
;
+}
diff --git a/src/client/tailwind.config.ts b/src/client/tailwind.config.ts
index ad2f078..da5d16e 100644
--- a/src/client/tailwind.config.ts
+++ b/src/client/tailwind.config.ts
@@ -11,6 +11,7 @@ module.exports = {
'./index.html',
'./components/**/*.{js,jsx,ts,tsx}',
'./pages/**/*.{js,jsx,ts,tsx}',
+ './routes/**/*.{js,jsx,ts,tsx}',
],
},
theme: {
@@ -84,7 +85,7 @@ module.exports = {
},
darkMode: 'class',
corePlugins: {
- preflight: false,
+ preflight: true,
},
plugins: [animate],
} satisfies Config;
diff --git a/src/client/utils/route.ts b/src/client/utils/route.ts
new file mode 100644
index 0000000..16631e6
--- /dev/null
+++ b/src/client/utils/route.ts
@@ -0,0 +1,15 @@
+import { FileBaseRouteOptions, redirect } from '@tanstack/react-router';
+
+export const routeAuthBeforeLoad: FileBaseRouteOptions['beforeLoad'] = ({
+ context,
+ location,
+}) => {
+ if (!(context as any).userInfo) {
+ throw redirect({
+ to: '/login',
+ search: {
+ redirect: location.href,
+ },
+ });
+ }
+};
diff --git a/src/client/vite.config.ts b/src/client/vite.config.ts
index 2507e25..87afcbf 100644
--- a/src/client/vite.config.ts
+++ b/src/client/vite.config.ts
@@ -1,11 +1,18 @@
import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';
import { resolve } from 'path';
+import { TanStackRouterVite } from '@tanstack/router-vite-plugin';
// https://vitejs.dev/config/
export default defineConfig({
root: __dirname,
- plugins: [react()],
+ plugins: [
+ react(),
+ TanStackRouterVite({
+ routesDirectory: './routes',
+ generatedRouteTree: './routeTree.gen.ts',
+ }),
+ ],
build: {
outDir: '../server/public',
},