Skip to content

Commit eb6d8e7

Browse files
committed
add back radix to check
1 parent c3e584d commit eb6d8e7

File tree

6 files changed

+45
-40
lines changed

6 files changed

+45
-40
lines changed

ui/package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -43,6 +43,7 @@
4343
"@radix-ui/react-toggle": "^1.1.10",
4444
"@radix-ui/react-toggle-group": "^1.1.11",
4545
"@radix-ui/react-tooltip": "^1.2.8",
46+
"@radix-ui/themes": "^3.2.1",
4647
"@stripe/stripe-js": "^8.0.0",
4748
"@tanstack/react-router": "^1.132.47",
4849
"@tanstack/react-router-devtools": "^1.132.51",

ui/src/components/WorkosOrgSwitcher.tsx

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import { useRouter } from '@tanstack/react-router'
33
import { getWidgetsAuthToken } from '@/authkit/serverFunctions'
44
import { useToast } from '@/hooks/use-toast'
55
import { OrganizationSwitcher, WorkOsWidgets } from '@workos-inc/widgets'
6-
import { DropdownMenuSeparator, DropdownMenuGroup, DropdownMenuItem } from '@/components/ui/dropdown-menu'
6+
import { DropdownMenu } from '@radix-ui/themes'
77

88
type WorkosOrgSwitcherProps = {
99
userId: string
@@ -81,12 +81,12 @@ export default function WorkosOrgSwitcher({
8181

8282
const extraMenu = showSettingsItem ? (
8383
<>
84-
<DropdownMenuSeparator />
85-
<DropdownMenuGroup>
86-
<DropdownMenuItem onClick={() => router.navigate({ to: '/dashboard/settings/user' })}>
84+
<DropdownMenu.Separator />
85+
<DropdownMenu.Group>
86+
<DropdownMenu.Item onClick={() => router.navigate({ to: '/dashboard/settings/user' })}>
8787
Settings
88-
</DropdownMenuItem>
89-
</DropdownMenuGroup>
88+
</DropdownMenu.Item>
89+
</DropdownMenu.Group>
9090
</>
9191
) : null
9292

ui/src/components/footer.tsx

Lines changed: 27 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -1,32 +1,32 @@
1-
import { Card, CardHeader, CardTitle, CardDescription } from '@/components/ui/card';
1+
import { Card, Grid, Heading, Text } from '@radix-ui/themes';
22

33
export default function Footer() {
44
return (
5-
<div className="grid grid-cols-1 sm:grid-cols-3 gap-3 sm:gap-5">
6-
<a href="https://workos.com/docs" rel="noreferrer" target="_blank" className="no-underline">
7-
<Card className="hover:bg-accent transition-colors h-full">
8-
<CardHeader>
9-
<CardTitle className="text-lg mb-1">Documentation</CardTitle>
10-
<CardDescription>View integration guides and SDK documentation.</CardDescription>
11-
</CardHeader>
12-
</Card>
13-
</a>
14-
<a href="https://workos.com/docs/reference" rel="noreferrer" target="_blank" className="no-underline">
15-
<Card className="hover:bg-accent transition-colors h-full">
16-
<CardHeader>
17-
<CardTitle className="text-lg mb-1">API Reference</CardTitle>
18-
<CardDescription>Every WorkOS API method and endpoint documented.</CardDescription>
19-
</CardHeader>
20-
</Card>
21-
</a>
22-
<a href="https://workos.com" rel="noreferrer" target="_blank" className="no-underline">
23-
<Card className="hover:bg-accent transition-colors h-full">
24-
<CardHeader>
25-
<CardTitle className="text-lg mb-1">WorkOS</CardTitle>
26-
<CardDescription>Learn more about other WorkOS products.</CardDescription>
27-
</CardHeader>
28-
</Card>
29-
</a>
30-
</div>
5+
<Grid columns={{ initial: '1', sm: '3' }} gap={{ initial: '3', sm: '5' }}>
6+
<Card size="4" asChild variant="classic">
7+
<a href="https://workos.com/docs" rel="noreferrer" target="_blank">
8+
<Heading size="4" mb="1">
9+
Documentation
10+
</Heading>
11+
<Text color="gray">View integration guides and SDK documentation.</Text>
12+
</a>
13+
</Card>
14+
<Card size="4" asChild variant="classic">
15+
<a href="https://workos.com/docs/reference" rel="noreferrer" target="_blank">
16+
<Heading size="4" mb="1">
17+
API Reference
18+
</Heading>
19+
<Text color="gray">Every WorkOS API method and endpoint documented.</Text>
20+
</a>
21+
</Card>
22+
<Card size="4" asChild variant="classic">
23+
<a href="https://workos.com" rel="noreferrer" target="_blank">
24+
<Heading size="4" mb="1">
25+
WorkOS
26+
</Heading>
27+
<Text color="gray">Learn more about other WorkOS products.</Text>
28+
</a>
29+
</Card>
30+
</Grid>
3131
);
3232
}

ui/src/components/sign-in-button.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,20 @@
1-
import { Button } from '@/components/ui/button';
1+
import { Button, Flex } from '@radix-ui/themes';
22
import { Link } from '@tanstack/react-router';
33
import type { User } from '@workos-inc/node';
44

55
export default function SignInButton({ large, user, url }: { large?: boolean; user: User | null; url: string }) {
66
if (user) {
77
return (
8-
<div className="flex gap-3">
9-
<Button asChild size={large ? 'lg' : 'default'}>
8+
<Flex gap="3">
9+
<Button asChild size={large ? '3' : '2'}>
1010
<Link to="/logout">Sign Out</Link>
1111
</Button>
12-
</div>
12+
</Flex>
1313
);
1414
}
1515

1616
return (
17-
<Button asChild size={large ? 'lg' : 'default'} className="cursor-pointer">
17+
<Button asChild size={large ? '3' : '2'} className="cursor-pointer">
1818
<a href={url}>Sign In To Get Started</a>
1919
</Button>
2020
);

ui/src/components/ui/OrgSelector.tsx

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import { Flex } from "@radix-ui/themes";
12
// Commented out - legacy file, not currently used
23
// import { getApiProps } from "@repo/env";
34
// import { UsersManagement, WorkOsWidgets } from "@workos-inc/widgets";
@@ -41,7 +42,7 @@ export default async function OrgSelector(props: { user: any, organizationId: st
4142
// scopes: ["widgets:users-table:manage"],
4243
// });
4344
return (
44-
<div className="flex gap-2 p-2 flex-col items-start w-full">
45+
<Flex gap="2" p="2" direction="column" align="start" width="100%">
4546
{/* <WorkOsWidgets>
4647
<OrganizationSwitcher
4748
authToken={authToken}
@@ -57,6 +58,6 @@ export default async function OrgSelector(props: { user: any, organizationId: st
5758
>
5859
</OrganizationSwitcher>
5960
</WorkOsWidgets> */}
60-
</div>
61+
</Flex>
6162
);
6263
}

ui/src/routes/__root.tsx

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import radixCssUrl from '@radix-ui/themes/styles.css?url';
12
import workosWidgetsCssUrl from '@workos-inc/widgets/styles.css?url';
23
import { HeadContent, Link, Outlet, Scripts, createRootRoute } from '@tanstack/react-router';
34
import { TanStackRouterDevtools } from '@tanstack/react-router-devtools';
@@ -62,6 +63,8 @@ function DashboardRootDocument({ children }: Readonly<{ children: ReactNode }>)
6263
<head>
6364
<HeadContent />
6465
{/* Preload and apply critical CSS to avoid FOUC */}
66+
<link rel="preload" as="style" href={radixCssUrl} />
67+
<link rel="stylesheet" href={radixCssUrl} />
6568
<link rel="preload" as="style" href={workosWidgetsCssUrl} />
6669
<link rel="stylesheet" href={workosWidgetsCssUrl} />
6770
<link rel="preload" as="style" href={globalCssUrl} />

0 commit comments

Comments
 (0)