create-croissant 0.1.39 → 0.1.40
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +9 -9
- package/template/README.md +4 -4
- package/template/apps/desktop/electron-builder.yml +6 -6
- package/template/apps/desktop/electron.vite.config.ts +8 -8
- package/template/apps/desktop/package.json +5 -5
- package/template/apps/desktop/src/main/index.ts +32 -32
- package/template/apps/desktop/src/preload/index.d.ts +3 -3
- package/template/apps/desktop/src/preload/index.ts +8 -8
- package/template/apps/desktop/src/renderer/src/App.tsx +5 -5
- package/template/apps/desktop/src/renderer/src/assets/base.css +4 -4
- package/template/apps/desktop/src/renderer/src/assets/main.css +3 -3
- package/template/apps/desktop/src/renderer/src/components/Versions.tsx +4 -4
- package/template/apps/desktop/src/renderer/src/main.tsx +7 -7
- package/template/apps/desktop/tsconfig.json +1 -4
- package/template/apps/desktop/tsconfig.node.json +7 -1
- package/template/apps/desktop/tsconfig.web.json +3 -9
- package/template/apps/mobile/app/(tabs)/_layout.tsx +11 -10
- package/template/apps/mobile/app/(tabs)/explore.tsx +29 -27
- package/template/apps/mobile/app/(tabs)/index.tsx +25 -24
- package/template/apps/mobile/app/_layout.tsx +8 -8
- package/template/apps/mobile/app/modal.tsx +6 -6
- package/template/apps/mobile/components/external-link.tsx +5 -5
- package/template/apps/mobile/components/haptic-tab.tsx +4 -4
- package/template/apps/mobile/components/hello-wave.tsx +5 -4
- package/template/apps/mobile/components/parallax-scroll-view.tsx +15 -13
- package/template/apps/mobile/components/themed-text.tsx +14 -14
- package/template/apps/mobile/components/themed-view.tsx +3 -3
- package/template/apps/mobile/components/ui/collapsible.tsx +14 -13
- package/template/apps/mobile/components/ui/icon-symbol.ios.tsx +4 -4
- package/template/apps/mobile/components/ui/icon-symbol.tsx +9 -9
- package/template/apps/mobile/constants/theme.ts +19 -19
- package/template/apps/mobile/hooks/use-color-scheme.ts +1 -1
- package/template/apps/mobile/hooks/use-color-scheme.web.ts +3 -3
- package/template/apps/mobile/hooks/use-theme-color.ts +4 -4
- package/template/apps/mobile/package.json +3 -3
- package/template/apps/mobile/scripts/reset-project.js +2 -2
- package/template/apps/mobile/tsconfig.json +2 -9
- package/template/apps/platform/drizzle.config.ts +5 -5
- package/template/apps/platform/package.json +4 -4
- package/template/apps/platform/src/components/app-sidebar.tsx +60 -69
- package/template/apps/platform/src/components/login-form.tsx +32 -39
- package/template/apps/platform/src/components/search-form.tsx +5 -13
- package/template/apps/platform/src/components/signup-form.tsx +39 -49
- package/template/apps/platform/src/components/version-switcher.tsx +11 -21
- package/template/apps/platform/src/lib/auth-utils.ts +12 -14
- package/template/apps/platform/src/lib/orpc.ts +17 -17
- package/template/apps/platform/src/router.tsx +5 -5
- package/template/apps/platform/src/routes/__root.tsx +13 -15
- package/template/apps/platform/src/routes/_auth/account.tsx +61 -50
- package/template/apps/platform/src/routes/_auth/dashboard.tsx +17 -17
- package/template/apps/platform/src/routes/_auth/examples/client-orpc-auth.tsx +13 -13
- package/template/apps/platform/src/routes/_auth/examples/ssr-orpc-auth.tsx +16 -16
- package/template/apps/platform/src/routes/_auth.tsx +5 -5
- package/template/apps/platform/src/routes/_public/examples/client-orpc.tsx +108 -88
- package/template/apps/platform/src/routes/_public/examples/isr.tsx +14 -14
- package/template/apps/platform/src/routes/_public/examples/ssr-orpc.tsx +92 -75
- package/template/apps/platform/src/routes/_public/index.tsx +22 -19
- package/template/apps/platform/src/routes/_public/login.tsx +4 -4
- package/template/apps/platform/src/routes/_public/signup.tsx +6 -5
- package/template/apps/platform/src/routes/_public.tsx +5 -5
- package/template/apps/platform/src/routes/api/auth/$.ts +13 -13
- package/template/apps/platform/src/routes/api/rpc.$.ts +13 -13
- package/template/apps/platform/vite.config.ts +8 -8
- package/template/docker-compose.yml +1 -1
- package/template/package.json +24 -22
- package/template/packages/auth/package.json +9 -9
- package/template/packages/auth/src/lib/auth.ts +1 -1
- package/template/packages/db/package.json +7 -7
- package/template/packages/db/src/index.ts +4 -4
- package/template/packages/db/src/schema.ts +2 -2
- package/template/packages/orpc/package.json +6 -6
- package/template/packages/orpc/src/lib/planets.ts +39 -43
- package/template/packages/orpc/src/lib/router.ts +15 -15
- package/template/packages/ui/package.json +10 -10
- package/template/packages/ui/src/components/accordion.tsx +20 -22
- package/template/packages/ui/src/components/alert-dialog.tsx +31 -56
- package/template/packages/ui/src/components/alert.tsx +15 -23
- package/template/packages/ui/src/components/aspect-ratio.tsx +3 -3
- package/template/packages/ui/src/components/avatar.tsx +19 -35
- package/template/packages/ui/src/components/badge.tsx +13 -17
- package/template/packages/ui/src/components/breadcrumb.tsx +22 -44
- package/template/packages/ui/src/components/button-group.tsx +16 -25
- package/template/packages/ui/src/components/button.tsx +8 -9
- package/template/packages/ui/src/components/calendar.tsx +43 -82
- package/template/packages/ui/src/components/card.tsx +15 -26
- package/template/packages/ui/src/components/carousel.tsx +70 -78
- package/template/packages/ui/src/components/chart.tsx +84 -117
- package/template/packages/ui/src/components/checkbox.tsx +8 -9
- package/template/packages/ui/src/components/collapsible.tsx +5 -9
- package/template/packages/ui/src/components/combobox.tsx +44 -68
- package/template/packages/ui/src/components/command.tsx +32 -47
- package/template/packages/ui/src/components/context-menu.tsx +45 -71
- package/template/packages/ui/src/components/dialog.tsx +29 -51
- package/template/packages/ui/src/components/direction.tsx +1 -4
- package/template/packages/ui/src/components/drawer.tsx +24 -38
- package/template/packages/ui/src/components/dropdown-menu.tsx +45 -55
- package/template/packages/ui/src/components/empty.tsx +16 -27
- package/template/packages/ui/src/components/field.tsx +49 -63
- package/template/packages/ui/src/components/hover-card.tsx +9 -14
- package/template/packages/ui/src/components/input-group.tsx +40 -52
- package/template/packages/ui/src/components/input-otp.tsx +17 -18
- package/template/packages/ui/src/components/input.tsx +6 -6
- package/template/packages/ui/src/components/item.tsx +31 -44
- package/template/packages/ui/src/components/kbd.tsx +5 -5
- package/template/packages/ui/src/components/label.tsx +6 -6
- package/template/packages/ui/src/components/menubar.tsx +51 -64
- package/template/packages/ui/src/components/mode-toggle.tsx +9 -15
- package/template/packages/ui/src/components/native-select.tsx +18 -24
- package/template/packages/ui/src/components/navigation-menu.tsx +28 -35
- package/template/packages/ui/src/components/pagination.tsx +19 -31
- package/template/packages/ui/src/components/popover.tsx +13 -26
- package/template/packages/ui/src/components/progress.tsx +13 -30
- package/template/packages/ui/src/components/radio-group.tsx +7 -7
- package/template/packages/ui/src/components/resizable.tsx +12 -20
- package/template/packages/ui/src/components/scroll-area.tsx +8 -12
- package/template/packages/ui/src/components/select.tsx +31 -42
- package/template/packages/ui/src/components/separator.tsx +6 -10
- package/template/packages/ui/src/components/sheet.tsx +25 -38
- package/template/packages/ui/src/components/sidebar.tsx +137 -170
- package/template/packages/ui/src/components/skeleton.tsx +3 -3
- package/template/packages/ui/src/components/slider.tsx +5 -5
- package/template/packages/ui/src/components/sonner.tsx +20 -24
- package/template/packages/ui/src/components/spinner.tsx +10 -5
- package/template/packages/ui/src/components/switch.tsx +6 -6
- package/template/packages/ui/src/components/table.tsx +18 -45
- package/template/packages/ui/src/components/tabs.tsx +14 -22
- package/template/packages/ui/src/components/textarea.tsx +5 -5
- package/template/packages/ui/src/components/theme-provider.tsx +43 -48
- package/template/packages/ui/src/components/toggle-group.tsx +18 -20
- package/template/packages/ui/src/components/toggle.tsx +9 -10
- package/template/packages/ui/src/components/tooltip.tsx +10 -22
- package/template/packages/ui/src/hooks/use-mobile.ts +11 -11
- package/template/packages/ui/src/lib/utils.ts +4 -4
- package/template/packages/ui/src/styles/globals.css +106 -106
- package/template/turbo.json +15 -6
- package/template/.prettierignore +0 -10
- package/template/apps/desktop/.prettierignore +0 -6
- package/template/apps/desktop/eslint.config.ts +0 -11
- package/template/apps/desktop/prettier.config.ts +0 -3
- package/template/apps/mobile/eslint.config.js +0 -10
- package/template/apps/platform/eslint.config.ts +0 -11
- package/template/apps/platform/prettier.config.ts +0 -3
- package/template/packages/auth/eslint.config.ts +0 -3
- package/template/packages/auth/prettier.config.ts +0 -3
- package/template/packages/config-eslint/index.ts +0 -24
- package/template/packages/config-eslint/package.json +0 -11
- package/template/packages/config-prettier/index.ts +0 -14
- package/template/packages/config-prettier/package.json +0 -7
- package/template/packages/db/eslint.config.ts +0 -3
- package/template/packages/db/prettier.config.ts +0 -3
- package/template/packages/orpc/eslint.config.ts +0 -3
- package/template/packages/orpc/prettier.config.ts +0 -3
- package/template/packages/ui/eslint.config.ts +0 -3
- package/template/packages/ui/prettier.config.ts +0 -3
- package/template/prettier.config.ts +0 -15
|
@@ -3,15 +3,8 @@
|
|
|
3
3
|
"compilerOptions": {
|
|
4
4
|
"strict": true,
|
|
5
5
|
"paths": {
|
|
6
|
-
"@/*": [
|
|
7
|
-
"./*"
|
|
8
|
-
]
|
|
6
|
+
"@/*": ["./*"]
|
|
9
7
|
}
|
|
10
8
|
},
|
|
11
|
-
"include": [
|
|
12
|
-
"**/*.ts",
|
|
13
|
-
"**/*.tsx",
|
|
14
|
-
".expo/types/**/*.ts",
|
|
15
|
-
"expo-env.d.ts"
|
|
16
|
-
]
|
|
9
|
+
"include": ["**/*.ts", "**/*.tsx", ".expo/types/**/*.ts", "expo-env.d.ts"]
|
|
17
10
|
}
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { defineConfig } from
|
|
1
|
+
import "dotenv/config";
|
|
2
|
+
import { defineConfig } from "drizzle-kit";
|
|
3
3
|
|
|
4
4
|
export default defineConfig({
|
|
5
|
-
out:
|
|
6
|
-
schema:
|
|
7
|
-
dialect:
|
|
5
|
+
out: "./drizzle",
|
|
6
|
+
schema: "../../packages/db/src/schema.ts",
|
|
7
|
+
dialect: "postgresql",
|
|
8
8
|
dbCredentials: {
|
|
9
9
|
url: process.env.DATABASE_URL!,
|
|
10
10
|
},
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "platform",
|
|
3
3
|
"version": "0.0.1",
|
|
4
|
-
"type": "module",
|
|
5
4
|
"private": true,
|
|
5
|
+
"type": "module",
|
|
6
6
|
"scripts": {
|
|
7
7
|
"dev": "vite dev --port 3000",
|
|
8
8
|
"build": "vite build",
|
|
@@ -34,11 +34,11 @@
|
|
|
34
34
|
"vite-tsconfig-paths": "^6.1.1"
|
|
35
35
|
},
|
|
36
36
|
"devDependencies": {
|
|
37
|
-
"@workspace/config-eslint": "*",
|
|
38
|
-
"@workspace/config-typescript": "*",
|
|
39
|
-
"@workspace/config-prettier": "*",
|
|
40
37
|
"@types/node": "^25.6.0",
|
|
41
38
|
"@vitejs/plugin-react": "^6.0.1",
|
|
39
|
+
"@workspace/config-eslint": "*",
|
|
40
|
+
"@workspace/config-prettier": "*",
|
|
41
|
+
"@workspace/config-typescript": "*",
|
|
42
42
|
"vite": "^8.0.10"
|
|
43
43
|
}
|
|
44
44
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import * as React from "react"
|
|
2
|
-
import { Link } from "@tanstack/react-router"
|
|
3
|
-
import { LogOut, Settings, User } from "lucide-react"
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { Link } from "@tanstack/react-router";
|
|
3
|
+
import { LogOut, Settings, User } from "lucide-react";
|
|
4
4
|
|
|
5
5
|
import {
|
|
6
6
|
Sidebar,
|
|
@@ -14,11 +14,11 @@ import {
|
|
|
14
14
|
SidebarMenuButton,
|
|
15
15
|
SidebarMenuItem,
|
|
16
16
|
SidebarRail,
|
|
17
|
-
} from "@workspace/ui/components/sidebar"
|
|
18
|
-
import { Avatar, AvatarFallback, AvatarImage } from "@workspace/ui/components/avatar"
|
|
19
|
-
import { ModeToggle } from "@workspace/ui/components/mode-toggle"
|
|
17
|
+
} from "@workspace/ui/components/sidebar";
|
|
18
|
+
import { Avatar, AvatarFallback, AvatarImage } from "@workspace/ui/components/avatar";
|
|
19
|
+
import { ModeToggle } from "@workspace/ui/components/mode-toggle";
|
|
20
20
|
|
|
21
|
-
import { authClient } from "@/lib/auth-client"
|
|
21
|
+
import { authClient } from "@/lib/auth-client";
|
|
22
22
|
|
|
23
23
|
// This is sample data.
|
|
24
24
|
export const authNavItems = [
|
|
@@ -48,7 +48,7 @@ export const authNavItems = [
|
|
|
48
48
|
},
|
|
49
49
|
],
|
|
50
50
|
},
|
|
51
|
-
]
|
|
51
|
+
];
|
|
52
52
|
|
|
53
53
|
export const publicNavItems = [
|
|
54
54
|
{
|
|
@@ -85,32 +85,30 @@ export const publicNavItems = [
|
|
|
85
85
|
},
|
|
86
86
|
],
|
|
87
87
|
},
|
|
88
|
-
]
|
|
88
|
+
];
|
|
89
89
|
|
|
90
90
|
interface AppSidebarProps extends React.ComponentProps<typeof Sidebar> {
|
|
91
91
|
items?: Array<{
|
|
92
|
-
title: string
|
|
92
|
+
title: string;
|
|
93
93
|
items: Array<{
|
|
94
|
-
title: string
|
|
95
|
-
url: string
|
|
96
|
-
}
|
|
97
|
-
}
|
|
94
|
+
title: string;
|
|
95
|
+
url: string;
|
|
96
|
+
}>;
|
|
97
|
+
}>;
|
|
98
98
|
}
|
|
99
99
|
|
|
100
100
|
export function AuthSidebar(props: React.ComponentProps<typeof Sidebar>) {
|
|
101
|
-
return <AppSidebar items={authNavItems} {...props}
|
|
101
|
+
return <AppSidebar items={authNavItems} {...props} />;
|
|
102
102
|
}
|
|
103
103
|
|
|
104
104
|
export function PublicSidebar(props: React.ComponentProps<typeof Sidebar>) {
|
|
105
|
-
return <AppSidebar items={publicNavItems} {...props}
|
|
105
|
+
return <AppSidebar items={publicNavItems} {...props} />;
|
|
106
106
|
}
|
|
107
107
|
|
|
108
108
|
export function AppSidebar({ items = authNavItems, ...props }: AppSidebarProps) {
|
|
109
|
-
const {
|
|
110
|
-
data: session,
|
|
111
|
-
} = authClient.useSession()
|
|
109
|
+
const { data: session } = authClient.useSession();
|
|
112
110
|
|
|
113
|
-
const user = session?.user || null
|
|
111
|
+
const user = session?.user || null;
|
|
114
112
|
|
|
115
113
|
return (
|
|
116
114
|
<Sidebar {...props}>
|
|
@@ -130,10 +128,7 @@ export function AppSidebar({ items = authNavItems, ...props }: AppSidebarProps)
|
|
|
130
128
|
<SidebarMenuItem key={subItem.title}>
|
|
131
129
|
<SidebarMenuButton
|
|
132
130
|
render={
|
|
133
|
-
<Link
|
|
134
|
-
to={subItem.url}
|
|
135
|
-
activeProps={{ className: "bg-sidebar-accent" }}
|
|
136
|
-
/>
|
|
131
|
+
<Link to={subItem.url} activeProps={{ className: "bg-sidebar-accent" }} />
|
|
137
132
|
}
|
|
138
133
|
>
|
|
139
134
|
{subItem.title}
|
|
@@ -148,52 +143,48 @@ export function AppSidebar({ items = authNavItems, ...props }: AppSidebarProps)
|
|
|
148
143
|
<SidebarFooter>
|
|
149
144
|
<SidebarMenu>
|
|
150
145
|
<SidebarMenuItem>
|
|
151
|
-
|
|
152
|
-
<SidebarMenuButton
|
|
153
|
-
size="lg"
|
|
154
|
-
render={<div />}
|
|
155
|
-
className="data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground"
|
|
156
|
-
>
|
|
157
|
-
<div className="flex items-center gap-2 w-full">
|
|
158
|
-
<Avatar className="h-8 w-8 rounded-lg">
|
|
159
|
-
<AvatarImage src={user.image || ""} alt={user.name} />
|
|
160
|
-
<AvatarFallback className="rounded-lg">
|
|
161
|
-
{user.name.charAt(0) || "U"}
|
|
162
|
-
</AvatarFallback>
|
|
163
|
-
</Avatar>
|
|
164
|
-
<div className="grid flex-1 text-left text-sm leading-tight">
|
|
165
|
-
<span className="truncate font-semibold">{user.name}</span>
|
|
166
|
-
<span className="truncate text-xs">{user.email}</span>
|
|
167
|
-
</div>
|
|
168
|
-
<div className="flex items-center gap-1 ml-auto">
|
|
169
|
-
<SidebarMenuButton
|
|
170
|
-
render={<Link to="/account" />}
|
|
171
|
-
className="p-1 h-auto w-auto rounded hover:bg-sidebar-accent-foreground/10"
|
|
172
|
-
title="Account Settings"
|
|
173
|
-
>
|
|
174
|
-
<Settings className="h-4 w-4" />
|
|
175
|
-
</SidebarMenuButton>
|
|
176
|
-
<SidebarMenuButton
|
|
177
|
-
onClick={async (e) => {
|
|
178
|
-
e.preventDefault()
|
|
179
|
-
e.stopPropagation()
|
|
180
|
-
await authClient.signOut()
|
|
181
|
-
window.location.reload()
|
|
182
|
-
}}
|
|
183
|
-
className="p-1 h-auto w-auto rounded hover:bg-sidebar-accent-foreground/10"
|
|
184
|
-
title="Sign Out"
|
|
185
|
-
>
|
|
186
|
-
<LogOut className="h-4 w-4" />
|
|
187
|
-
</SidebarMenuButton>
|
|
188
|
-
</div>
|
|
189
|
-
</div>
|
|
190
|
-
</SidebarMenuButton>
|
|
191
|
-
) : (
|
|
146
|
+
{user ? (
|
|
192
147
|
<SidebarMenuButton
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
148
|
+
size="lg"
|
|
149
|
+
render={<div />}
|
|
150
|
+
className="data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground"
|
|
196
151
|
>
|
|
152
|
+
<div className="flex items-center gap-2 w-full">
|
|
153
|
+
<Avatar className="h-8 w-8 rounded-lg">
|
|
154
|
+
<AvatarImage src={user.image || ""} alt={user.name} />
|
|
155
|
+
<AvatarFallback className="rounded-lg">
|
|
156
|
+
{user.name.charAt(0) || "U"}
|
|
157
|
+
</AvatarFallback>
|
|
158
|
+
</Avatar>
|
|
159
|
+
<div className="grid flex-1 text-left text-sm leading-tight">
|
|
160
|
+
<span className="truncate font-semibold">{user.name}</span>
|
|
161
|
+
<span className="truncate text-xs">{user.email}</span>
|
|
162
|
+
</div>
|
|
163
|
+
<div className="flex items-center gap-1 ml-auto">
|
|
164
|
+
<SidebarMenuButton
|
|
165
|
+
render={<Link to="/account" />}
|
|
166
|
+
className="p-1 h-auto w-auto rounded hover:bg-sidebar-accent-foreground/10"
|
|
167
|
+
title="Account Settings"
|
|
168
|
+
>
|
|
169
|
+
<Settings className="h-4 w-4" />
|
|
170
|
+
</SidebarMenuButton>
|
|
171
|
+
<SidebarMenuButton
|
|
172
|
+
onClick={async (e) => {
|
|
173
|
+
e.preventDefault();
|
|
174
|
+
e.stopPropagation();
|
|
175
|
+
await authClient.signOut();
|
|
176
|
+
window.location.reload();
|
|
177
|
+
}}
|
|
178
|
+
className="p-1 h-auto w-auto rounded hover:bg-sidebar-accent-foreground/10"
|
|
179
|
+
title="Sign Out"
|
|
180
|
+
>
|
|
181
|
+
<LogOut className="h-4 w-4" />
|
|
182
|
+
</SidebarMenuButton>
|
|
183
|
+
</div>
|
|
184
|
+
</div>
|
|
185
|
+
</SidebarMenuButton>
|
|
186
|
+
) : (
|
|
187
|
+
<SidebarMenuButton render={<Link to="/login" className="flex items-center gap-2" />}>
|
|
197
188
|
<User className="h-4 w-4" />
|
|
198
189
|
<span>Sign In</span>
|
|
199
190
|
</SidebarMenuButton>
|
|
@@ -203,5 +194,5 @@ export function AppSidebar({ items = authNavItems, ...props }: AppSidebarProps)
|
|
|
203
194
|
</SidebarFooter>
|
|
204
195
|
<SidebarRail />
|
|
205
196
|
</Sidebar>
|
|
206
|
-
)
|
|
197
|
+
);
|
|
207
198
|
}
|
|
@@ -1,37 +1,34 @@
|
|
|
1
|
-
import { cn } from "@workspace/ui/lib/utils"
|
|
2
|
-
import { Button } from "@workspace/ui/components/button"
|
|
1
|
+
import { cn } from "@workspace/ui/lib/utils";
|
|
2
|
+
import { Button } from "@workspace/ui/components/button";
|
|
3
3
|
import {
|
|
4
4
|
Card,
|
|
5
5
|
CardContent,
|
|
6
6
|
CardDescription,
|
|
7
7
|
CardHeader,
|
|
8
8
|
CardTitle,
|
|
9
|
-
} from "@workspace/ui/components/card"
|
|
9
|
+
} from "@workspace/ui/components/card";
|
|
10
10
|
import {
|
|
11
11
|
Field,
|
|
12
12
|
FieldDescription,
|
|
13
13
|
FieldError,
|
|
14
14
|
FieldGroup,
|
|
15
15
|
FieldLabel,
|
|
16
|
-
} from "@workspace/ui/components/field"
|
|
17
|
-
import { Input } from "@workspace/ui/components/input"
|
|
18
|
-
import { useState } from "react"
|
|
19
|
-
import { Link } from "@tanstack/react-router"
|
|
20
|
-
import { useForm } from "@tanstack/react-form"
|
|
21
|
-
import { type } from "arktype"
|
|
22
|
-
import { authClient } from "@/lib/auth-client"
|
|
16
|
+
} from "@workspace/ui/components/field";
|
|
17
|
+
import { Input } from "@workspace/ui/components/input";
|
|
18
|
+
import { useState } from "react";
|
|
19
|
+
import { Link } from "@tanstack/react-router";
|
|
20
|
+
import { useForm } from "@tanstack/react-form";
|
|
21
|
+
import { type } from "arktype";
|
|
22
|
+
import { authClient } from "@/lib/auth-client";
|
|
23
23
|
|
|
24
24
|
const loginSchema = type({
|
|
25
25
|
email: "string.email",
|
|
26
26
|
password: "string>0",
|
|
27
|
-
})
|
|
27
|
+
});
|
|
28
28
|
|
|
29
|
-
export function LoginForm({
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
}: React.ComponentProps<"div">) {
|
|
33
|
-
const [loading, setLoading] = useState(false)
|
|
34
|
-
const [error, setError] = useState<string | null>(null)
|
|
29
|
+
export function LoginForm({ className, ...props }: React.ComponentProps<"div">) {
|
|
30
|
+
const [loading, setLoading] = useState(false);
|
|
31
|
+
const [error, setError] = useState<string | null>(null);
|
|
35
32
|
|
|
36
33
|
const form = useForm({
|
|
37
34
|
defaultValues: {
|
|
@@ -42,47 +39,42 @@ export function LoginForm({
|
|
|
42
39
|
onChange: loginSchema,
|
|
43
40
|
},
|
|
44
41
|
onSubmit: async ({ value }) => {
|
|
45
|
-
setLoading(true)
|
|
46
|
-
setError(null)
|
|
42
|
+
setLoading(true);
|
|
43
|
+
setError(null);
|
|
47
44
|
const { error: signInError } = await authClient.signIn.email({
|
|
48
45
|
email: value.email,
|
|
49
46
|
password: value.password,
|
|
50
47
|
callbackURL: "/dashboard",
|
|
51
|
-
})
|
|
48
|
+
});
|
|
52
49
|
if (signInError) {
|
|
53
|
-
setError(signInError.message || "Failed to sign in")
|
|
50
|
+
setError(signInError.message || "Failed to sign in");
|
|
54
51
|
}
|
|
55
|
-
setLoading(false)
|
|
52
|
+
setLoading(false);
|
|
56
53
|
},
|
|
57
|
-
})
|
|
54
|
+
});
|
|
58
55
|
|
|
59
56
|
return (
|
|
60
57
|
<div className={cn("flex flex-col gap-6", className)} {...props}>
|
|
61
58
|
<Card>
|
|
62
59
|
<CardHeader>
|
|
63
60
|
<CardTitle>Login to your account</CardTitle>
|
|
64
|
-
<CardDescription>
|
|
65
|
-
Enter your email below to login to your account
|
|
66
|
-
</CardDescription>
|
|
61
|
+
<CardDescription>Enter your email below to login to your account</CardDescription>
|
|
67
62
|
</CardHeader>
|
|
68
63
|
<CardContent>
|
|
69
64
|
<form
|
|
70
65
|
onSubmit={(e) => {
|
|
71
|
-
e.preventDefault()
|
|
72
|
-
e.stopPropagation()
|
|
73
|
-
form.handleSubmit()
|
|
66
|
+
e.preventDefault();
|
|
67
|
+
e.stopPropagation();
|
|
68
|
+
form.handleSubmit();
|
|
74
69
|
}}
|
|
75
70
|
>
|
|
76
71
|
<FieldGroup>
|
|
77
|
-
{error &&
|
|
78
|
-
<div className="rounded bg-red-100 p-2 text-sm text-red-600">
|
|
79
|
-
{error}
|
|
80
|
-
</div>
|
|
81
|
-
)}
|
|
72
|
+
{error && <div className="rounded bg-red-100 p-2 text-sm text-red-600">{error}</div>}
|
|
82
73
|
<form.Field
|
|
83
74
|
name="email"
|
|
84
75
|
children={(field) => {
|
|
85
|
-
const isInvalid =
|
|
76
|
+
const isInvalid =
|
|
77
|
+
field.state.meta.isTouched && field.state.meta.errors.length > 0;
|
|
86
78
|
return (
|
|
87
79
|
<Field data-invalid={isInvalid}>
|
|
88
80
|
<FieldLabel htmlFor={field.name}>Email</FieldLabel>
|
|
@@ -98,13 +90,14 @@ export function LoginForm({
|
|
|
98
90
|
/>
|
|
99
91
|
{isInvalid && <FieldError errors={field.state.meta.errors} />}
|
|
100
92
|
</Field>
|
|
101
|
-
)
|
|
93
|
+
);
|
|
102
94
|
}}
|
|
103
95
|
/>
|
|
104
96
|
<form.Field
|
|
105
97
|
name="password"
|
|
106
98
|
children={(field) => {
|
|
107
|
-
const isInvalid =
|
|
99
|
+
const isInvalid =
|
|
100
|
+
field.state.meta.isTouched && field.state.meta.errors.length > 0;
|
|
108
101
|
return (
|
|
109
102
|
<Field data-invalid={isInvalid}>
|
|
110
103
|
<div className="flex items-center">
|
|
@@ -127,7 +120,7 @@ export function LoginForm({
|
|
|
127
120
|
/>
|
|
128
121
|
{isInvalid && <FieldError errors={field.state.meta.errors} />}
|
|
129
122
|
</Field>
|
|
130
|
-
)
|
|
123
|
+
);
|
|
131
124
|
}}
|
|
132
125
|
/>
|
|
133
126
|
<Field>
|
|
@@ -154,5 +147,5 @@ export function LoginForm({
|
|
|
154
147
|
</CardContent>
|
|
155
148
|
</Card>
|
|
156
149
|
</div>
|
|
157
|
-
)
|
|
150
|
+
);
|
|
158
151
|
}
|
|
@@ -1,10 +1,6 @@
|
|
|
1
|
-
import { Label } from "@workspace/ui/components/label"
|
|
2
|
-
import {
|
|
3
|
-
|
|
4
|
-
SidebarGroupContent,
|
|
5
|
-
SidebarInput,
|
|
6
|
-
} from "@workspace/ui/components/sidebar"
|
|
7
|
-
import { SearchIcon } from "lucide-react"
|
|
1
|
+
import { Label } from "@workspace/ui/components/label";
|
|
2
|
+
import { SidebarGroup, SidebarGroupContent, SidebarInput } from "@workspace/ui/components/sidebar";
|
|
3
|
+
import { SearchIcon } from "lucide-react";
|
|
8
4
|
|
|
9
5
|
export function SearchForm({ ...props }: React.ComponentProps<"form">) {
|
|
10
6
|
return (
|
|
@@ -14,14 +10,10 @@ export function SearchForm({ ...props }: React.ComponentProps<"form">) {
|
|
|
14
10
|
<Label htmlFor="search" className="sr-only">
|
|
15
11
|
Search
|
|
16
12
|
</Label>
|
|
17
|
-
<SidebarInput
|
|
18
|
-
id="search"
|
|
19
|
-
placeholder="Search the docs..."
|
|
20
|
-
className="pl-8"
|
|
21
|
-
/>
|
|
13
|
+
<SidebarInput id="search" placeholder="Search the docs..." className="pl-8" />
|
|
22
14
|
<SearchIcon className="pointer-events-none absolute top-1/2 left-2 size-4 -translate-y-1/2 opacity-50 select-none" />
|
|
23
15
|
</SidebarGroupContent>
|
|
24
16
|
</SidebarGroup>
|
|
25
17
|
</form>
|
|
26
|
-
)
|
|
18
|
+
);
|
|
27
19
|
}
|
|
@@ -1,24 +1,24 @@
|
|
|
1
|
-
import { Button } from "@workspace/ui/components/button"
|
|
1
|
+
import { Button } from "@workspace/ui/components/button";
|
|
2
2
|
import {
|
|
3
3
|
Card,
|
|
4
4
|
CardContent,
|
|
5
5
|
CardDescription,
|
|
6
6
|
CardHeader,
|
|
7
7
|
CardTitle,
|
|
8
|
-
} from "@workspace/ui/components/card"
|
|
8
|
+
} from "@workspace/ui/components/card";
|
|
9
9
|
import {
|
|
10
10
|
Field,
|
|
11
11
|
FieldDescription,
|
|
12
12
|
FieldError,
|
|
13
13
|
FieldGroup,
|
|
14
14
|
FieldLabel,
|
|
15
|
-
} from "@workspace/ui/components/field"
|
|
16
|
-
import { Input } from "@workspace/ui/components/input"
|
|
17
|
-
import { useState } from "react"
|
|
18
|
-
import { Link } from "@tanstack/react-router"
|
|
19
|
-
import { useForm } from "@tanstack/react-form"
|
|
20
|
-
import { type } from "arktype"
|
|
21
|
-
import { authClient } from "@/lib/auth-client"
|
|
15
|
+
} from "@workspace/ui/components/field";
|
|
16
|
+
import { Input } from "@workspace/ui/components/input";
|
|
17
|
+
import { useState } from "react";
|
|
18
|
+
import { Link } from "@tanstack/react-router";
|
|
19
|
+
import { useForm } from "@tanstack/react-form";
|
|
20
|
+
import { type } from "arktype";
|
|
21
|
+
import { authClient } from "@/lib/auth-client";
|
|
22
22
|
|
|
23
23
|
const signupSchema = type({
|
|
24
24
|
name: "string>0",
|
|
@@ -30,15 +30,15 @@ const signupSchema = type({
|
|
|
30
30
|
ctx.error({
|
|
31
31
|
message: "Passwords do not match",
|
|
32
32
|
path: ["confirmPassword"],
|
|
33
|
-
})
|
|
34
|
-
return false
|
|
33
|
+
});
|
|
34
|
+
return false;
|
|
35
35
|
}
|
|
36
|
-
return true
|
|
37
|
-
})
|
|
36
|
+
return true;
|
|
37
|
+
});
|
|
38
38
|
|
|
39
39
|
export function SignupForm({ ...props }: React.ComponentProps<typeof Card>) {
|
|
40
|
-
const [loading, setLoading] = useState(false)
|
|
41
|
-
const [error, setError] = useState<string | null>(null)
|
|
40
|
+
const [loading, setLoading] = useState(false);
|
|
41
|
+
const [error, setError] = useState<string | null>(null);
|
|
42
42
|
|
|
43
43
|
const form = useForm({
|
|
44
44
|
defaultValues: {
|
|
@@ -51,47 +51,41 @@ export function SignupForm({ ...props }: React.ComponentProps<typeof Card>) {
|
|
|
51
51
|
onChange: signupSchema,
|
|
52
52
|
},
|
|
53
53
|
onSubmit: async ({ value }) => {
|
|
54
|
-
setLoading(true)
|
|
55
|
-
setError(null)
|
|
54
|
+
setLoading(true);
|
|
55
|
+
setError(null);
|
|
56
56
|
const { error: signUpError } = await authClient.signUp.email({
|
|
57
57
|
email: value.email,
|
|
58
58
|
password: value.password,
|
|
59
59
|
name: value.name,
|
|
60
60
|
callbackURL: "/dashboard",
|
|
61
|
-
})
|
|
61
|
+
});
|
|
62
62
|
if (signUpError) {
|
|
63
|
-
setError(signUpError.message || "Failed to sign up")
|
|
63
|
+
setError(signUpError.message || "Failed to sign up");
|
|
64
64
|
}
|
|
65
|
-
setLoading(false)
|
|
65
|
+
setLoading(false);
|
|
66
66
|
},
|
|
67
|
-
})
|
|
67
|
+
});
|
|
68
68
|
|
|
69
69
|
return (
|
|
70
70
|
<Card {...props}>
|
|
71
71
|
<CardHeader>
|
|
72
72
|
<CardTitle>Create an account</CardTitle>
|
|
73
|
-
<CardDescription>
|
|
74
|
-
Enter your information below to create your account
|
|
75
|
-
</CardDescription>
|
|
73
|
+
<CardDescription>Enter your information below to create your account</CardDescription>
|
|
76
74
|
</CardHeader>
|
|
77
75
|
<CardContent>
|
|
78
76
|
<form
|
|
79
77
|
onSubmit={(e) => {
|
|
80
|
-
e.preventDefault()
|
|
81
|
-
e.stopPropagation()
|
|
82
|
-
form.handleSubmit()
|
|
78
|
+
e.preventDefault();
|
|
79
|
+
e.stopPropagation();
|
|
80
|
+
form.handleSubmit();
|
|
83
81
|
}}
|
|
84
82
|
>
|
|
85
83
|
<FieldGroup>
|
|
86
|
-
{error &&
|
|
87
|
-
<div className="rounded bg-red-100 p-2 text-sm text-red-600">
|
|
88
|
-
{error}
|
|
89
|
-
</div>
|
|
90
|
-
)}
|
|
84
|
+
{error && <div className="rounded bg-red-100 p-2 text-sm text-red-600">{error}</div>}
|
|
91
85
|
<form.Field
|
|
92
86
|
name="name"
|
|
93
87
|
children={(field) => {
|
|
94
|
-
const isInvalid = field.state.meta.isTouched && field.state.meta.errors.length > 0
|
|
88
|
+
const isInvalid = field.state.meta.isTouched && field.state.meta.errors.length > 0;
|
|
95
89
|
return (
|
|
96
90
|
<Field data-invalid={isInvalid}>
|
|
97
91
|
<FieldLabel htmlFor={field.name}>Full Name</FieldLabel>
|
|
@@ -107,13 +101,13 @@ export function SignupForm({ ...props }: React.ComponentProps<typeof Card>) {
|
|
|
107
101
|
/>
|
|
108
102
|
{isInvalid && <FieldError errors={field.state.meta.errors} />}
|
|
109
103
|
</Field>
|
|
110
|
-
)
|
|
104
|
+
);
|
|
111
105
|
}}
|
|
112
106
|
/>
|
|
113
107
|
<form.Field
|
|
114
108
|
name="email"
|
|
115
109
|
children={(field) => {
|
|
116
|
-
const isInvalid = field.state.meta.isTouched && field.state.meta.errors.length > 0
|
|
110
|
+
const isInvalid = field.state.meta.isTouched && field.state.meta.errors.length > 0;
|
|
117
111
|
return (
|
|
118
112
|
<Field data-invalid={isInvalid}>
|
|
119
113
|
<FieldLabel htmlFor={field.name}>Email</FieldLabel>
|
|
@@ -128,18 +122,18 @@ export function SignupForm({ ...props }: React.ComponentProps<typeof Card>) {
|
|
|
128
122
|
required
|
|
129
123
|
/>
|
|
130
124
|
<FieldDescription>
|
|
131
|
-
We'll use this to contact you. We will not share your email
|
|
132
|
-
|
|
125
|
+
We'll use this to contact you. We will not share your email with anyone
|
|
126
|
+
else.
|
|
133
127
|
</FieldDescription>
|
|
134
128
|
{isInvalid && <FieldError errors={field.state.meta.errors} />}
|
|
135
129
|
</Field>
|
|
136
|
-
)
|
|
130
|
+
);
|
|
137
131
|
}}
|
|
138
132
|
/>
|
|
139
133
|
<form.Field
|
|
140
134
|
name="password"
|
|
141
135
|
children={(field) => {
|
|
142
|
-
const isInvalid = field.state.meta.isTouched && field.state.meta.errors.length > 0
|
|
136
|
+
const isInvalid = field.state.meta.isTouched && field.state.meta.errors.length > 0;
|
|
143
137
|
return (
|
|
144
138
|
<Field data-invalid={isInvalid}>
|
|
145
139
|
<FieldLabel htmlFor={field.name}>Password</FieldLabel>
|
|
@@ -152,23 +146,19 @@ export function SignupForm({ ...props }: React.ComponentProps<typeof Card>) {
|
|
|
152
146
|
onChange={(e) => field.handleChange(e.target.value)}
|
|
153
147
|
required
|
|
154
148
|
/>
|
|
155
|
-
<FieldDescription>
|
|
156
|
-
Must be at least 8 characters long.
|
|
157
|
-
</FieldDescription>
|
|
149
|
+
<FieldDescription>Must be at least 8 characters long.</FieldDescription>
|
|
158
150
|
{isInvalid && <FieldError errors={field.state.meta.errors} />}
|
|
159
151
|
</Field>
|
|
160
|
-
)
|
|
152
|
+
);
|
|
161
153
|
}}
|
|
162
154
|
/>
|
|
163
155
|
<form.Field
|
|
164
156
|
name="confirmPassword"
|
|
165
157
|
children={(field) => {
|
|
166
|
-
const isInvalid = field.state.meta.isTouched && field.state.meta.errors.length > 0
|
|
158
|
+
const isInvalid = field.state.meta.isTouched && field.state.meta.errors.length > 0;
|
|
167
159
|
return (
|
|
168
160
|
<Field data-invalid={isInvalid}>
|
|
169
|
-
<FieldLabel htmlFor={field.name}>
|
|
170
|
-
Confirm Password
|
|
171
|
-
</FieldLabel>
|
|
161
|
+
<FieldLabel htmlFor={field.name}>Confirm Password</FieldLabel>
|
|
172
162
|
<Input
|
|
173
163
|
id={field.name}
|
|
174
164
|
name={field.name}
|
|
@@ -181,7 +171,7 @@ export function SignupForm({ ...props }: React.ComponentProps<typeof Card>) {
|
|
|
181
171
|
<FieldDescription>Please confirm your password.</FieldDescription>
|
|
182
172
|
{isInvalid && <FieldError errors={field.state.meta.errors} />}
|
|
183
173
|
</Field>
|
|
184
|
-
)
|
|
174
|
+
);
|
|
185
175
|
}}
|
|
186
176
|
/>
|
|
187
177
|
<FieldGroup>
|
|
@@ -209,5 +199,5 @@ export function SignupForm({ ...props }: React.ComponentProps<typeof Card>) {
|
|
|
209
199
|
</form>
|
|
210
200
|
</CardContent>
|
|
211
201
|
</Card>
|
|
212
|
-
)
|
|
202
|
+
);
|
|
213
203
|
}
|