markus/next-ory
1
0
Fork 0
mirror of https://codeberg.org/MarkusThielker/next-ory.git synced 2025-04-10 11:58:41 +00:00
Code Releases Packages Activity

NORY-46: replace checkbox with switch

Browse source
This commit is contained in:
Markus Thielker 2025-02-25 17:13:56 +01:00
parent b70afcf16c
commit 8062432654
5 changed files with 47 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

BIN
dashboard/bun.lockb
View file

Binary file not shown.

1
dashboard/package.json
View file

@ -22,6 +22,7 @@
"@radix-ui/react-select": "^2.1.6",
"@radix-ui/react-separator": "^1.1.0",
"@radix-ui/react-slot": "^1.1.1",
"@radix-ui/react-switch": "^1.1.3",
"@radix-ui/react-tabs": "^1.1.1",
"@radix-ui/react-tooltip": "^1.1.4",
"@serwist/next": "^9.0.0-preview.21",

11
dashboard/src/app/globals.css
View file

@ -75,4 +75,15 @@
body {
@apply bg-sidebar text-foreground;
}
}
@layer base {
* {
@apply border-border outline-ring/50;
}
body {
@apply bg-background text-foreground;
}
}

10
dashboard/src/components/forms/client-form.tsx
View file

@ -13,9 +13,10 @@ import { AxiosResponse } from 'axios';
import { AlertDialog, AlertDialogContent, AlertDialogHeader, AlertDialogTitle } from '@/components/ui/alert-dialog';
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
import { useRouter } from 'next/navigation';
import { Checkbox } from '@/components/ui/checkbox';
import { Minus } from 'lucide-react';
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select';
import { Switch } from '@/components/ui/switch';
import Link from 'next/link';
interface CreateClientFormProps {
action: (data: z.infer<typeof clientFormSchema>) => Promise<AxiosResponse<OAuth2Client, any>>;
@ -200,8 +201,7 @@ export function CreateClientForm({ action }: CreateClientFormProps) {
</FormDescription>
</div>
<FormControl>
{/* TODO: change to switch */}
<Checkbox
<Switch
checked={field.value}
onCheckedChange={field.onChange}
/>
@ -238,7 +238,9 @@ export function CreateClientForm({ action }: CreateClientFormProps) {
<FormLabel>Policy URI</FormLabel>
<FormControl>
<Input
placeholder="https://myapp.example/privacy_policy" {...field} />
placeholder="https://myapp.example/privacy_policy"
{...field}
/>
</FormControl>
<FormDescription>
A URL string pointing to a human-readable

29
dashboard/src/components/ui/switch.tsx Normal file
View file

@ -0,0 +1,29 @@
'use client';
import * as React from 'react';
import * as SwitchPrimitives from '@radix-ui/react-switch';
import { cn } from '@/lib/utils';
const Switch = React.forwardRef<
React.ElementRef<typeof SwitchPrimitives.Root>,
React.ComponentPropsWithoutRef<typeof SwitchPrimitives.Root>
>(({ className, ...props }, ref) => (
<SwitchPrimitives.Root
className={cn(
'peer inline-flex h-6 w-11 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=unchecked]:bg-input',
className,
)}
{...props}
ref={ref}
>
<SwitchPrimitives.Thumb
className={cn(
'pointer-events-none block h-5 w-5 rounded-full bg-background shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-5 data-[state=unchecked]:translate-x-0',
)}
/>
</SwitchPrimitives.Root>
));
Switch.displayName = SwitchPrimitives.Root.displayName;
export { Switch };