diff --git a/dashboard/src/app/(inside)/user/[id]/page.tsx b/dashboard/src/app/(inside)/user/[id]/page.tsx
index 410d262..ad4eb12 100644
--- a/dashboard/src/app/(inside)/user/[id]/page.tsx
+++ b/dashboard/src/app/(inside)/user/[id]/page.tsx
@@ -10,6 +10,7 @@ import { RecoveryIdentityAddress, VerifiableIdentityAddress } from '@ory/client'
import { Badge } from '@/components/ui/badge';
import { Check, X } from 'lucide-react';
import { IdentityActions } from '@/components/identity/identity-actions';
+import { IdentityCredentials } from '@/components/identity/identity-credentials';
interface MergedAddress {
recovery_id?: string;
@@ -190,26 +191,7 @@ export default async function UserDetailsPage({ params }: { params: Promise<{ id
All authentication mechanisms registered with this identity
-
-
-
- Type
- Value
-
-
-
- {
- Object.entries(identity.credentials!).map(([key, value]) => {
- return (
-
- {key}
- {value.identifiers![0]}
-
- );
- })
- }
-
-
+
diff --git a/dashboard/src/components/identity/identity-credentials.tsx b/dashboard/src/components/identity/identity-credentials.tsx
new file mode 100644
index 0000000..3cb06da
--- /dev/null
+++ b/dashboard/src/components/identity/identity-credentials.tsx
@@ -0,0 +1,61 @@
+'use client';
+
+import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '@/components/ui/table';
+import { ConfirmationDialogWrapper } from '@/components/confirmation-dialog-wrapper';
+import { deleteIdentityCredential } from '@/app/(inside)/user/action';
+import { Button } from '@/components/ui/button';
+import { Trash } from 'lucide-react';
+import { DeleteIdentityCredentialsTypeEnum, Identity } from '@ory/client';
+import { toast } from 'sonner';
+
+interface IdentityCredentialsProps {
+ identity: Identity;
+}
+
+export function IdentityCredentials({ identity }: IdentityCredentialsProps) {
+ return (
+
+
+
+ Type
+ Value
+
+
+
+
+ {
+ Object.entries(identity.credentials!).map(([key, value]) => {
+ return (
+
+ {key}
+ {value.identifiers![0]}
+
+ {
+ Object.values(DeleteIdentityCredentialsTypeEnum).includes(key as DeleteIdentityCredentialsTypeEnum) &&
+ key !== 'password' && key !== 'code' &&
+ (
+ {
+ deleteIdentityCredential({ id: identity.id, type: key as never })
+ .then(() => toast.success(`Credential ${key} deleted`))
+ .catch(() => toast.error(`Deleting credential ${key} failed`));
+ }}
+ dialogTitle="Delete credential"
+ dialogDescription={`Are you sure you want to remove the credential of type ${key} from this identity?`}
+ dialogButtonSubmit={`Delete ${key}`}
+ dialogButtonSubmitProps={{ variant: 'destructive' }}>
+
+
+ )
+ }
+
+
+ );
+ })
+ }
+
+
+ );
+}
\ No newline at end of file