ResetTemplateDialog.tsx89 lines · main
1import { PermissionAction } from '@supabase/shared-types/out/constants'
2import { useParams } from 'common'
3import { useState } from 'react'
4import { toast } from 'sonner'
5import {
6 AlertDialog,
7 AlertDialogCancel,
8 AlertDialogContent,
9 AlertDialogDescription,
10 AlertDialogFooter,
11 AlertDialogHeader,
12 AlertDialogTitle,
13 AlertDialogTrigger,
14 Button,
15} from 'ui'
16
17import { type AuthTemplate } from './EmailTemplates.types'
18import { getAuthTemplateType } from './EmailTemplates.utils'
19import { AuthConfigResponse } from '@/data/auth/auth-config-query'
20import { useAuthTemplateResetMutation } from '@/data/auth/auth-template-reset-mutation'
21import { useAsyncCheckPermissions } from '@/hooks/misc/useCheckPermissions'
22
23export const ResetTemplateDialog = ({
24 template,
25 hasUnsavedChanges,
26 onResetSuccess,
27}: {
28 template: AuthTemplate
29 hasUnsavedChanges: boolean
30 onResetSuccess: (config: AuthConfigResponse) => void
31}) => {
32 const { ref: projectRef } = useParams()
33 const [open, setOpen] = useState(false)
34 const { can: canUpdateConfig } = useAsyncCheckPermissions(
35 PermissionAction.UPDATE,
36 'custom_config_gotrue'
37 )
38
39 const { id } = template
40 const templateType = getAuthTemplateType(id)
41
42 const { mutate: resetAuthTemplate, isPending: isResettingTemplate } =
43 useAuthTemplateResetMutation()
44
45 const resetTemplateToDefault = () => {
46 if (!projectRef) return console.error('Project ref is required')
47 if (!templateType) return console.error('Template type is required')
48
49 resetAuthTemplate(
50 {
51 projectRef,
52 template: templateType,
53 },
54 {
55 onSuccess: (config) => {
56 toast.success('Email template reset to default')
57 onResetSuccess(config)
58 setOpen(false)
59 },
60 }
61 )
62 }
63
64 return (
65 <AlertDialog open={open} onOpenChange={setOpen}>
66 <AlertDialogTrigger asChild>
67 <Button type="default" htmlType="button" disabled={!canUpdateConfig || isResettingTemplate}>
68 Reset template
69 </Button>
70 </AlertDialogTrigger>
71 <AlertDialogContent>
72 <AlertDialogHeader>
73 <AlertDialogTitle>Reset template to default</AlertDialogTitle>
74 <AlertDialogDescription>
75 {hasUnsavedChanges
76 ? 'This will discard your unsaved changes and use the default subject line and email body content.'
77 : 'This will remove your custom subject line and email body content. The default values will be used instead.'}
78 </AlertDialogDescription>
79 </AlertDialogHeader>
80 <AlertDialogFooter>
81 <AlertDialogCancel disabled={isResettingTemplate}>Cancel</AlertDialogCancel>
82 <Button type="warning" onClick={resetTemplateToDefault} loading={isResettingTemplate}>
83 Reset
84 </Button>
85 </AlertDialogFooter>
86 </AlertDialogContent>
87 </AlertDialog>
88 )
89}