konnosDashboard
DeleteCustomProviderModal.tsx68 lines · main
1import type { CustomOAuthProvider } from '@supabase/auth-js'
2import { useParams } from 'common'
3import { toast } from 'sonner'
4import ConfirmationModal from 'ui-patterns/Dialogs/ConfirmationModal'
5
6import { useProjectApiUrl } from '@/data/config/project-endpoint-query'
7import { useOAuthCustomProviderDeleteMutation } from '@/data/oauth-custom-providers/oauth-custom-provider-delete-mutation'
8
9interface DeleteCustomProviderModalProps {
10 visible: boolean
11 selectedProvider?: CustomOAuthProvider
12 onClose: () => void
13}
14
15export const DeleteCustomProviderModal = ({
16 visible,
17 selectedProvider,
18 onClose,
19}: DeleteCustomProviderModalProps) => {
20 const { ref: projectRef } = useParams()
21 const { hostEndpoint: clientEndpoint } = useProjectApiUrl({ projectRef })
22 const { mutate, isPending } = useOAuthCustomProviderDeleteMutation({
23 onSuccess: () => {
24 toast.success('Custom provider deleted successfully')
25 onClose()
26 },
27 })
28
29 const onConfirmDelete = () => {
30 mutate({
31 identifier: selectedProvider?.identifier,
32 projectRef,
33 clientEndpoint,
34 })
35 }
36
37 return (
38 <ConfirmationModal
39 variant="destructive"
40 size="medium"
41 loading={isPending}
42 visible={visible}
43 title={
44 <>
45 Confirm to delete custom provider{' '}
46 <code className="text-sm">{selectedProvider?.name}</code>
47 </>
48 }
49 confirmLabel="Confirm delete"
50 confirmLabelLoading="Deleting..."
51 onCancel={() => onClose()}
52 onConfirm={() => onConfirmDelete()}
53 alert={{
54 title: 'This action cannot be undone',
55 description:
56 'You will need to re-create the custom provider if you want to revert the deletion.',
57 }}
58 >
59 <p className="text-sm">Before deleting this custom provider, consider:</p>
60 <ul className="space-y-2 mt-2 text-sm text-foreground-light">
61 <li className="list-disc ml-6">
62 Any users authenticating with this provider will lose access
63 </li>
64 <li className="list-disc ml-6">This provider is no longer in use by any applications</li>
65 </ul>
66 </ConfirmationModal>
67 )
68}