11import { ApplyLocalSettingsDialog } from '@/components/common/ApplyLocalSettingsDialog' ;
22import { useDialog } from '@/components/common/DialogProvider' ;
3- import { useUI } from '@/components/common/UIProvider' ;
43import { Form } from '@/components/form/Form' ;
54import { SettingsContainer } from '@/components/layout/SettingsContainer' ;
65import { ActivityIndicator } from '@/components/ui/v2/ActivityIndicator' ;
@@ -10,12 +9,12 @@ import { VerifyDomain } from '@/features/orgs/projects/custom-domains/settings/c
109import { useLocalMimirClient } from '@/features/orgs/projects/hooks/useLocalMimirClient' ;
1110import { useProject } from '@/features/orgs/projects/hooks/useProject' ;
1211import { execPromiseWithErrorToast } from '@/features/orgs/utils/execPromiseWithErrorToast' ;
12+ import type { ConfigIngressUpdateInput } from '@/generated/graphql' ;
1313import {
1414 useGetHasuraSettingsQuery ,
1515 useUpdateConfigMutation ,
16- type ConfigIngressUpdateInput ,
1716} from '@/generated/graphql' ;
18- import { isNotEmptyValue } from '@/lib/utils' ;
17+ import { isEmptyValue , isNotEmptyValue } from '@/lib/utils' ;
1918import { yupResolver } from '@hookform/resolvers/yup' ;
2019import { useEffect , useState } from 'react' ;
2120import { FormProvider , useForm } from 'react-hook-form' ;
@@ -30,7 +29,6 @@ export type HasuraDomainFormValues = Yup.InferType<typeof validationSchema>;
3029export default function HasuraDomain ( ) {
3130 const { openDialog } = useDialog ( ) ;
3231 const isPlatform = useIsPlatform ( ) ;
33- const { maintenanceActive } = useUI ( ) ;
3432 const localMimirClient = useLocalMimirClient ( ) ;
3533 const [ isVerified , setIsVerified ] = useState ( false ) ;
3634
@@ -66,6 +64,23 @@ export default function HasuraDomain() {
6664 }
6765 } , [ data , loading , form , initialValue ] ) ;
6866
67+ const { formState, watch, setValue } = form ;
68+ const isDirty = Object . keys ( formState . dirtyFields ) . length > 0 ;
69+
70+ const hasura_fqdn = watch ( 'hasura_fqdn' ) ;
71+
72+ const submitButtonDisabled = ( ( ) => {
73+ if ( ! isPlatform ) {
74+ return ! isDirty ;
75+ }
76+
77+ if ( isEmptyValue ( hasura_fqdn ) && isDirty ) {
78+ return false ;
79+ }
80+
81+ return ! isDirty || ! isVerified ;
82+ } ) ( ) ;
83+
6984 if ( loadingProject || loading ) {
7085 return (
7186 < ActivityIndicator
@@ -80,17 +95,17 @@ export default function HasuraDomain() {
8095 throw error ;
8196 }
8297
83- const { formState, register, watch } = form ;
84- const isDirty = Object . keys ( formState . dirtyFields ) . length > 0 ;
85-
86- const hasura_fqdn = watch ( 'hasura_fqdn' ) ;
87-
8898 async function handleSubmit ( formValues : HasuraDomainFormValues ) {
89- const ingresses : ConfigIngressUpdateInput [ ] = isNotEmptyValue (
90- formValues . hasura_fqdn ,
91- )
92- ? [ { fqdn : [ formValues . hasura_fqdn ] } ]
93- : [ ] ;
99+ let ingresses : ConfigIngressUpdateInput [ ] | null ;
100+ let successMessage = '' ;
101+
102+ if ( isNotEmptyValue ( formValues . hasura_fqdn ) ) {
103+ ingresses = [ { fqdn : [ formValues . hasura_fqdn ] } ] ;
104+ successMessage = 'Hasura domain has been updated successfully.' ;
105+ } else {
106+ ingresses = null ;
107+ successMessage = 'Custom Hasura domain has been removed successfully.' ;
108+ }
94109
95110 const updateConfigPromise = updateConfig ( {
96111 variables : {
@@ -127,21 +142,13 @@ export default function HasuraDomain() {
127142 } ,
128143 {
129144 loadingMessage : 'Hasura domain is being updated...' ,
130- successMessage : 'Hasura domain has been updated successfully.' ,
145+ successMessage,
131146 errorMessage :
132147 'An error occurred while trying to update the Hasura domain.' ,
133148 } ,
134149 ) ;
135150 }
136151
137- const isDisabled = ( ) => {
138- if ( ! isPlatform ) {
139- return ! isDirty || maintenanceActive ;
140- }
141-
142- return ! isDirty || maintenanceActive || ( ! isVerified && ! initialValue ) ;
143- } ;
144-
145152 return (
146153 < FormProvider { ...form } >
147154 < Form onSubmit = { handleSubmit } >
@@ -150,14 +157,22 @@ export default function HasuraDomain() {
150157 description = "Enter below your custom domain for the Hasura/GraphQL service."
151158 slotProps = { {
152159 submitButton : {
153- disabled : isDisabled ( ) ,
160+ disabled : submitButtonDisabled ,
154161 loading : formState . isSubmitting ,
155162 } ,
156163 } }
157164 className = "grid grid-flow-row gap-x-4 gap-y-4 px-4 lg:grid-cols-5"
158165 >
159166 < Input
160- { ...register ( 'hasura_fqdn' ) }
167+ value = { hasura_fqdn }
168+ onChange = { ( e ) => {
169+ setValue ( 'hasura_fqdn' , e . target . value , {
170+ shouldDirty : true ,
171+ } ) ;
172+ if ( isVerified ) {
173+ setIsVerified ( false ) ;
174+ }
175+ } }
161176 id = "hasura_fqdn"
162177 name = "hasura_fqdn"
163178 type = "string"
@@ -174,6 +189,7 @@ export default function HasuraDomain() {
174189 hostname = { hasura_fqdn }
175190 value = { `lb.${ project ?. region . name } .${ project ?. region . domain } .` }
176191 onHostNameVerified = { ( ) => setIsVerified ( true ) }
192+ saveEnabled = { ! submitButtonDisabled }
177193 />
178194 </ div >
179195 </ SettingsContainer >
0 commit comments