mirror of
https://codeberg.org/MarkusThielker/next-ory.git
synced 2025-04-10 11:58:41 +00:00
NORY-47: fix alert dialog action styling
This commit is contained in:
parent
6edf6ee1b3
commit
e6b9095454
3 changed files with 26 additions and 31 deletions
|
@ -15,7 +15,7 @@ import {
|
||||||
DropdownMenuSeparator,
|
DropdownMenuSeparator,
|
||||||
DropdownMenuTrigger,
|
DropdownMenuTrigger,
|
||||||
} from '@/components/ui/dropdown-menu';
|
} from '@/components/ui/dropdown-menu';
|
||||||
import { Button } from '@/components/ui/button';
|
import { Button, buttonVariants } from '@/components/ui/button';
|
||||||
import Link from 'next/link';
|
import Link from 'next/link';
|
||||||
import { toast } from 'sonner';
|
import { toast } from 'sonner';
|
||||||
import {
|
import {
|
||||||
|
@ -259,12 +259,14 @@ export function IdentityDataTable({ data, pageSize, pageToken, query, fetchIdent
|
||||||
</AlertDialogDescription>
|
</AlertDialogDescription>
|
||||||
</AlertDialogHeader>
|
</AlertDialogHeader>
|
||||||
<AlertDialogFooter>
|
<AlertDialogFooter>
|
||||||
<AlertDialogAction onClick={() => deleteIdentitySessions(currentIdentity.id)}>
|
|
||||||
Invalidate sessions
|
|
||||||
</AlertDialogAction>
|
|
||||||
<AlertDialogCancel>
|
<AlertDialogCancel>
|
||||||
Cancel
|
Cancel
|
||||||
</AlertDialogCancel>
|
</AlertDialogCancel>
|
||||||
|
<AlertDialogAction
|
||||||
|
className={buttonVariants({ variant: 'destructive' })}
|
||||||
|
onClick={() => deleteIdentitySessions(currentIdentity.id)}>
|
||||||
|
Invalidate sessions
|
||||||
|
</AlertDialogAction>
|
||||||
</AlertDialogFooter>
|
</AlertDialogFooter>
|
||||||
</AlertDialogContent>
|
</AlertDialogContent>
|
||||||
</AlertDialog>
|
</AlertDialog>
|
||||||
|
@ -280,13 +282,13 @@ export function IdentityDataTable({ data, pageSize, pageToken, query, fetchIdent
|
||||||
</AlertDialogDescription>
|
</AlertDialogDescription>
|
||||||
</AlertDialogHeader>
|
</AlertDialogHeader>
|
||||||
<AlertDialogFooter>
|
<AlertDialogFooter>
|
||||||
|
<AlertDialogCancel>
|
||||||
|
Cancel
|
||||||
|
</AlertDialogCancel>
|
||||||
<AlertDialogAction
|
<AlertDialogAction
|
||||||
onClick={() => blockIdentity(currentIdentity.id)}>
|
onClick={() => blockIdentity(currentIdentity.id)}>
|
||||||
Block identity
|
Block identity
|
||||||
</AlertDialogAction>
|
</AlertDialogAction>
|
||||||
<AlertDialogCancel>
|
|
||||||
Cancel
|
|
||||||
</AlertDialogCancel>
|
|
||||||
</AlertDialogFooter>
|
</AlertDialogFooter>
|
||||||
</AlertDialogContent>
|
</AlertDialogContent>
|
||||||
</AlertDialog>
|
</AlertDialog>
|
||||||
|
@ -302,13 +304,13 @@ export function IdentityDataTable({ data, pageSize, pageToken, query, fetchIdent
|
||||||
</AlertDialogDescription>
|
</AlertDialogDescription>
|
||||||
</AlertDialogHeader>
|
</AlertDialogHeader>
|
||||||
<AlertDialogFooter>
|
<AlertDialogFooter>
|
||||||
|
<AlertDialogCancel>
|
||||||
|
Cancel
|
||||||
|
</AlertDialogCancel>
|
||||||
<AlertDialogAction
|
<AlertDialogAction
|
||||||
onClick={() => unblockIdentity(currentIdentity.id)}>
|
onClick={() => unblockIdentity(currentIdentity.id)}>
|
||||||
Unblock identity
|
Unblock identity
|
||||||
</AlertDialogAction>
|
</AlertDialogAction>
|
||||||
<AlertDialogCancel>
|
|
||||||
Cancel
|
|
||||||
</AlertDialogCancel>
|
|
||||||
</AlertDialogFooter>
|
</AlertDialogFooter>
|
||||||
</AlertDialogContent>
|
</AlertDialogContent>
|
||||||
</AlertDialog>
|
</AlertDialog>
|
||||||
|
@ -325,13 +327,14 @@ export function IdentityDataTable({ data, pageSize, pageToken, query, fetchIdent
|
||||||
</AlertDialogDescription>
|
</AlertDialogDescription>
|
||||||
</AlertDialogHeader>
|
</AlertDialogHeader>
|
||||||
<AlertDialogFooter>
|
<AlertDialogFooter>
|
||||||
<AlertDialogAction
|
|
||||||
onClick={() => deleteIdentity(currentIdentity.id)}>
|
|
||||||
Delete identity
|
|
||||||
</AlertDialogAction>
|
|
||||||
<AlertDialogCancel>
|
<AlertDialogCancel>
|
||||||
Cancel
|
Cancel
|
||||||
</AlertDialogCancel>
|
</AlertDialogCancel>
|
||||||
|
<AlertDialogAction
|
||||||
|
className={buttonVariants({ variant: 'destructive' })}
|
||||||
|
onClick={() => deleteIdentity(currentIdentity.id)}>
|
||||||
|
Delete identity
|
||||||
|
</AlertDialogAction>
|
||||||
</AlertDialogFooter>
|
</AlertDialogFooter>
|
||||||
</AlertDialogContent>
|
</AlertDialogContent>
|
||||||
</AlertDialog>
|
</AlertDialog>
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
'use client';
|
'use client';
|
||||||
|
|
||||||
import { Button, ButtonProps } from '@/components/ui/button';
|
import { ButtonProps, buttonVariants } from '@/components/ui/button';
|
||||||
import {
|
import {
|
||||||
AlertDialog,
|
AlertDialog,
|
||||||
AlertDialogAction,
|
AlertDialogAction,
|
||||||
|
@ -23,9 +23,8 @@ interface ButtonWithConfirmDialogProps {
|
||||||
dialogTitle: string
|
dialogTitle: string
|
||||||
dialogDescription: string
|
dialogDescription: string
|
||||||
dialogButtonCancel?: string
|
dialogButtonCancel?: string
|
||||||
dialogButtonCancelProps?: ButtonProps
|
|
||||||
dialogButtonSubmit?: string
|
dialogButtonSubmit?: string
|
||||||
dialogButtonSubmitProps?: ButtonProps
|
dialogButtonSubmitProps?: typeof buttonVariants
|
||||||
children: ReactNode
|
children: ReactNode
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -37,7 +36,6 @@ export function ConfirmationDialogWrapper(
|
||||||
dialogTitle,
|
dialogTitle,
|
||||||
dialogDescription,
|
dialogDescription,
|
||||||
dialogButtonCancel,
|
dialogButtonCancel,
|
||||||
dialogButtonCancelProps,
|
|
||||||
dialogButtonSubmit,
|
dialogButtonSubmit,
|
||||||
dialogButtonSubmitProps,
|
dialogButtonSubmitProps,
|
||||||
children,
|
children,
|
||||||
|
@ -59,19 +57,13 @@ export function ConfirmationDialogWrapper(
|
||||||
<AlertDialogDescription>{dialogDescription}</AlertDialogDescription>
|
<AlertDialogDescription>{dialogDescription}</AlertDialogDescription>
|
||||||
</AlertDialogHeader>
|
</AlertDialogHeader>
|
||||||
<AlertDialogFooter>
|
<AlertDialogFooter>
|
||||||
<AlertDialogCancel asChild>
|
<AlertDialogCancel onClick={onCancel}>
|
||||||
<Button
|
{dialogButtonCancel ?? 'Cancel'}
|
||||||
onClick={onCancel}
|
|
||||||
{...dialogButtonCancelProps}>
|
|
||||||
{dialogButtonCancel ?? 'Cancel'}
|
|
||||||
</Button>
|
|
||||||
</AlertDialogCancel>
|
</AlertDialogCancel>
|
||||||
<AlertDialogAction asChild>
|
<AlertDialogAction
|
||||||
<Button
|
onClick={onSubmit}
|
||||||
onClick={onSubmit}
|
className={buttonVariants({ ...dialogButtonSubmitProps })}>
|
||||||
{...dialogButtonSubmitProps}>
|
{dialogButtonSubmit ?? 'Confirm'}
|
||||||
{dialogButtonSubmit ?? 'Confirm'}
|
|
||||||
</Button>
|
|
||||||
</AlertDialogAction>
|
</AlertDialogAction>
|
||||||
</AlertDialogFooter>
|
</AlertDialogFooter>
|
||||||
</AlertDialogContent>
|
</AlertDialogContent>
|
||||||
|
|
|
@ -104,7 +104,7 @@ const AlertDialogAction = React.forwardRef<
|
||||||
>(({ className, ...props }, ref) => (
|
>(({ className, ...props }, ref) => (
|
||||||
<AlertDialogPrimitive.Action
|
<AlertDialogPrimitive.Action
|
||||||
ref={ref}
|
ref={ref}
|
||||||
className={className}
|
className={(cn(buttonVariants(), className))}
|
||||||
{...props}
|
{...props}
|
||||||
/>
|
/>
|
||||||
));
|
));
|
||||||
|
|
Loading…
Add table
Reference in a new issue