markus/next-ory
1
0
Fork 0
Code Issues 5 Pull requests Projects Releases 1 Packages Wiki Activity Actions

NORY-47: fix buttons jumping horizontally if tooltip is shown

Browse source
This commit is contained in:
Markus Thielker 2025-01-02 13:25:35 +01:00
parent e6b9095454
commit 88115d143e
No known key found for this signature in database
2 changed files with 19 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
dashboard/src/components/confirmation-dialog-wrapper.tsx
View file

@ -14,18 +14,19 @@ import {
} from '@/components/ui/alert-dialog';
import { ReactNode } from 'react';
import { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip';
import type { VariantProps } from 'class-variance-authority';
interface ButtonWithConfirmDialogProps {
buttonProps?: ButtonProps,
onCancel?: () => any
onSubmit: () => any
tooltipContent?: string
dialogTitle: string
dialogDescription: string
dialogButtonCancel?: string
dialogButtonSubmit?: string
dialogButtonSubmitProps?: typeof buttonVariants
children: ReactNode
buttonProps?: ButtonProps;
onCancel?: () => any;
onSubmit: () => any;
tooltipContent?: string;
dialogTitle: string;
dialogDescription: string;
dialogButtonCancel?: string;
dialogButtonSubmit?: string;
dialogButtonSubmitProps?: VariantProps<typeof buttonVariants>;
children: ReactNode;
}
export function ConfirmationDialogWrapper(

17
dashboard/src/components/identity/identity-actions.tsx
View file

@ -25,8 +25,7 @@ export function IdentityActions({ identity }: IdentityActionProps,
const router = useRouter();
return (
<div className="space-x-2">
<>
<ConfirmationDialogWrapper
onSubmit={async () => {
await createRecoveryCode(identity.id)
@ -41,7 +40,7 @@ export function IdentityActions({ identity }: IdentityActionProps,
dialogDescription="Are you sure you want to create a recovery code for this identity?"
dialogButtonSubmit="Create code"
>
<Button size="icon">
<Button className="mr-2" size="icon">
<Key className="h-4"/>
</Button>
</ConfirmationDialogWrapper>
@ -60,7 +59,7 @@ export function IdentityActions({ identity }: IdentityActionProps,
dialogDescription="Are you sure you want to create a recovery link for this identity?"
dialogButtonSubmit="Create link"
>
<Button size="icon">
<Button className="mr-2" size="icon">
<Link className="h-4"/>
</Button>
</ConfirmationDialogWrapper>
@ -78,7 +77,7 @@ export function IdentityActions({ identity }: IdentityActionProps,
dialogDescription="Are you sure you want to deactivate this identity? The user will not be able to sign-in or use any active session until re-activation!"
dialogButtonSubmit="Deactivate"
>
<Button size="icon">
<Button className="mr-2" size="icon">
<UserX className="h-4"/>
</Button>
</ConfirmationDialogWrapper>
@ -94,7 +93,7 @@ export function IdentityActions({ identity }: IdentityActionProps,
dialogDescription="Are you sure you want to activate this identity?"
dialogButtonSubmit="Activate"
>
<Button size="icon">
<Button className="mr-2" size="icon">
<UserCheck className="h-4"/>
</Button>
</ConfirmationDialogWrapper>
@ -112,7 +111,7 @@ export function IdentityActions({ identity }: IdentityActionProps,
dialogButtonSubmit="Invalidate sessions"
dialogButtonSubmitProps={{ variant: 'destructive' }}
>
<Button size="icon">
<Button className="mr-2" size="icon">
<UserMinus className="h-4"/>
</Button>
</ConfirmationDialogWrapper>
@ -132,11 +131,11 @@ export function IdentityActions({ identity }: IdentityActionProps,
dialogButtonSubmit="Delete identity"
dialogButtonSubmitProps={{ variant: 'destructive' }}
>
<Button size="icon">
<Button className="mr-2" size="icon">
<Trash className="h-4"/>
</Button>
</ConfirmationDialogWrapper>
</div>
</>
);
}