@@ -6,24 +6,25 @@ import { customDomainSchema } from '@/lib/validate'
6
6
import ActionTooltip from './action-tooltip'
7
7
import { useToast } from '@/components/toast'
8
8
9
- const UPDATE_CUSTOM_DOMAIN = gql `
10
- mutation UpdateCustomDomain ($subName: String!, $domain: String!) {
11
- updateCustomDomain (subName: $subName, domain: $domain) {
9
+ const SET_CUSTOM_DOMAIN = gql `
10
+ mutation SetCustomDomain ($subName: String!, $domain: String!) {
11
+ setCustomDomain (subName: $subName, domain: $domain) {
12
12
domain
13
- verificationState
13
+ dnsState
14
+ sslState
14
15
}
15
16
}
16
17
`
17
18
18
19
// TODO: verification states should refresh
19
20
export default function CustomDomainForm ( { sub } ) {
20
- const [ updateCustomDomain ] = useMutation ( UPDATE_CUSTOM_DOMAIN , {
21
+ const [ setCustomDomain ] = useMutation ( SET_CUSTOM_DOMAIN , {
21
22
refetchQueries : [ 'Sub' ]
22
23
} )
23
24
const toaster = useToast ( )
24
25
25
26
const onSubmit = async ( { domain } ) => {
26
- await updateCustomDomain ( {
27
+ await setCustomDomain ( {
27
28
variables : {
28
29
subName : sub . name ,
29
30
domain
@@ -35,20 +36,22 @@ export default function CustomDomainForm ({ sub }) {
35
36
const getStatusBadge = ( status ) => {
36
37
switch ( status ) {
37
38
case 'VERIFIED' :
38
- return < Badge bg = 'success' > verified</ Badge >
39
+ return < Badge bg = 'success' > DNS verified</ Badge >
39
40
case 'PENDING' :
40
- return < Badge bg = 'warning' > pending</ Badge >
41
+ return < Badge bg = 'warning' > DNS pending</ Badge >
41
42
case 'FAILED' :
42
- return < Badge bg = 'danger' > failed</ Badge >
43
+ return < Badge bg = 'danger' > DNS failed</ Badge >
43
44
}
44
45
}
45
46
46
- const getSSLStatusBadge = ( sslEnabled ) => {
47
- switch ( sslEnabled ) {
48
- case true :
49
- return < Badge bg = 'success' > SSL enabled</ Badge >
50
- case false :
51
- return < Badge bg = 'danger' > SSL disabled</ Badge >
47
+ const getSSLStatusBadge = ( sslState ) => {
48
+ switch ( sslState ) {
49
+ case 'VERIFIED' :
50
+ return < Badge bg = 'success' > SSL verified</ Badge >
51
+ case 'PENDING' :
52
+ return < Badge bg = 'warning' > SSL pending</ Badge >
53
+ case 'FAILED' :
54
+ return < Badge bg = 'danger' > SSL failed</ Badge >
52
55
}
53
56
}
54
57
@@ -71,10 +74,10 @@ export default function CustomDomainForm ({ sub }) {
71
74
< >
72
75
< div className = 'd-flex align-items-center gap-2' >
73
76
< ActionTooltip overlayText = { new Date ( sub . customDomain . lastVerifiedAt ) . toUTCString ( ) } >
74
- { getStatusBadge ( sub . customDomain . verificationState ) }
77
+ { getStatusBadge ( sub . customDomain . dnsState ) }
75
78
</ ActionTooltip >
76
- { getSSLStatusBadge ( sub . customDomain . sslEnabled ) }
77
- { sub . customDomain . verificationState === 'PENDING' && (
79
+ { getSSLStatusBadge ( sub . customDomain . sslState ) }
80
+ { sub . customDomain . dnsState === 'PENDING' && (
78
81
< Info >
79
82
< h6 > Verify your domain</ h6 >
80
83
< p > Add the following DNS records to verify ownership of your domain:</ p >
@@ -85,6 +88,12 @@ export default function CustomDomainForm ({ sub }) {
85
88
</ pre >
86
89
</ Info >
87
90
) }
91
+ { sub . customDomain . sslState === 'PENDING' && (
92
+ < Info >
93
+ < h6 > SSL certificate pending</ h6 >
94
+ < p > Our system will issue an SSL certificate for your domain.</ p >
95
+ </ Info >
96
+ ) }
88
97
</ div >
89
98
</ >
90
99
) }
0 commit comments