add domain.

This commit is contained in:
Simon Larsen 2023-03-02 15:46:28 +00:00
parent 9ff88f6162
commit a3fa523ef1
No known key found for this signature in database
GPG Key ID: AB45983AA9C81CDE
2 changed files with 196 additions and 89 deletions

0
Certs/StatusPageCerts/Readme.md Normal file → Executable file
View File

View File

@ -1,6 +1,6 @@
import Route from 'Common/Types/API/Route';
import Page from 'CommonUI/src/Components/Page/Page';
import React, { FunctionComponent, ReactElement } from 'react';
import React, { FunctionComponent, ReactElement, useState } from 'react';
import PageMap from '../../../Utils/PageMap';
import RouteMap, { RouteUtil } from '../../../Utils/RouteMap';
import PageComponentProps from '../../PageComponentProps';
@ -16,11 +16,18 @@ import ModelTable from 'CommonUI/src/Components/ModelTable/ModelTable';
import BadDataException from 'Common/Types/Exception/BadDataException';
import { StatusPageCNameRecord } from 'CommonUI/src/Config';
import Navigation from 'CommonUI/src/Utils/Navigation';
import { ButtonStyleType } from 'CommonUI/src/Components/Button/Button';
import { JSONObject } from 'Common/Types/JSON';
import ConfirmModal from 'CommonUI/src/Components/Modal/ConfirmModal';
const StatusPageDelete: FunctionComponent<PageComponentProps> = (
props: PageComponentProps
): ReactElement => {
const modelId: ObjectID = Navigation.getLastParamAsObjectID(1);
const [cnameModalText, setCnameModalText] = useState<string>('');
const [showSslProvisioningModal, setShowSslProvisioningModal] = useState<boolean>(false);
return (
<Page
title={'Status Page'}
@ -56,101 +63,201 @@ const StatusPageDelete: FunctionComponent<PageComponentProps> = (
]}
sideMenu={<SideMenu modelId={modelId} />}
>
<ModelTable<StatusPageDomain>
modelType={StatusPageDomain}
query={{
projectId: DashboardNavigation.getProjectId()?.toString(),
statusPageId: modelId,
}}
name="Status Page > Domains"
id="domains-table"
isDeleteable={true}
isCreateable={true}
cardProps={{
icon: IconProp.Globe,
title: 'Custom Domains',
description: `Important: Please add ${StatusPageCNameRecord} as your CNAME for these domains for this to work.`,
}}
onBeforeCreate={(
item: StatusPageDomain
): Promise<StatusPageDomain> => {
if (!props.currentProject || !props.currentProject.id) {
throw new BadDataException('Project ID cannot be null');
}
item.statusPageId = modelId;
item.projectId = props.currentProject.id;
return Promise.resolve(item);
}}
noItemsMessage={'No custom domains found.'}
viewPageRoute={Navigation.getCurrentRoute()}
formFields={[
{
field: {
subdomain: true,
<>
<ModelTable<StatusPageDomain>
modelType={StatusPageDomain}
query={{
projectId: DashboardNavigation.getProjectId()?.toString(),
statusPageId: modelId,
}}
name="Status Page > Domains"
id="domains-table"
isDeleteable={true}
isCreateable={true}
cardProps={{
icon: IconProp.Globe,
title: 'Custom Domains',
description: `Important: Please add ${StatusPageCNameRecord} as your CNAME for these domains for this to work.`,
}}
onBeforeCreate={(
item: StatusPageDomain
): Promise<StatusPageDomain> => {
if (!props.currentProject || !props.currentProject.id) {
throw new BadDataException('Project ID cannot be null');
}
item.statusPageId = modelId;
item.projectId = props.currentProject.id;
return Promise.resolve(item);
}}
actionButtons={[
{
title: 'Add CNAME',
buttonStyleType: ButtonStyleType.SUCCESS_OUTLINE,
icon: IconProp.Check,
isVisible: (item: JSONObject): boolean => {
if (item['isCnameVerified']) {
return false;
}
return true;
},
onClick: async (
item: JSONObject,
onCompleteAction: Function,
onError: (err: Error) => void
) => {
try {
setCnameModalText(`${item['fullDomain']}`);
onCompleteAction();
} catch (err) {
onCompleteAction();
onError(err as Error);
}
},
},
title: 'Subdomain',
fieldType: FormFieldSchemaType.Text,
required: true,
placeholder: 'status',
validation: {
minLength: 2,
{
title: 'Provision SSL',
buttonStyleType: ButtonStyleType.SUCCESS_OUTLINE,
icon: IconProp.Check,
isVisible: (item: JSONObject): boolean => {
if (item['isCnameVerified'] && !item['isSslProvisioned']) {
return true;
}
return false;
},
onClick: async (
_item: JSONObject,
onCompleteAction: Function,
onError: (err: Error) => void
) => {
try {
setShowSslProvisioningModal(true)
onCompleteAction();
} catch (err) {
onCompleteAction();
onError(err as Error);
}
},
},
},
{
field: {
domain: true,
]}
noItemsMessage={'No custom domains found.'}
viewPageRoute={Navigation.getCurrentRoute()}
formFields={[
{
field: {
subdomain: true,
},
title: 'Subdomain',
fieldType: FormFieldSchemaType.Text,
required: true,
placeholder: 'status',
validation: {
minLength: 2,
},
},
title: 'Domain',
description:
'Please select a verified domain from this list. If you do not see any domains in this list, please head over to settings to add some.',
fieldType: FormFieldSchemaType.Dropdown,
dropdownModal: {
type: Domain,
labelField: 'domain',
valueField: '_id',
{
field: {
domain: true,
},
title: 'Domain',
description:
'Please select a verified domain from this list. If you do not see any domains in this list, please head over to settings to add some.',
fieldType: FormFieldSchemaType.Dropdown,
dropdownModal: {
type: Domain,
labelField: 'domain',
valueField: '_id',
},
required: true,
placeholder: 'Select domain',
},
required: true,
placeholder: 'Select domain',
},
]}
showRefreshButton={true}
showFilterButton={true}
columns={[
{
field: {
fullDomain: true,
]}
showRefreshButton={true}
showFilterButton={true}
columns={[
{
field: {
fullDomain: true,
},
title: 'Name',
type: FieldType.Text,
isFilterable: true,
},
title: 'Name',
type: FieldType.Text,
isFilterable: true,
},
{
field: {
isCnameVerified: true,
{
field: {
isCnameVerified: true,
},
title: 'CNAME Valid',
type: FieldType.Boolean,
isFilterable: true,
tooltipText: (item: StatusPageDomain): string => {
if (item['isCnameVerified']) {
return 'We have verified your CNAME record.';
}
return `Please add a new CNAME record to your domain ${item['fullDomain']}. It should look like CNAME ${item['fullDomain']} ${StatusPageCNameRecord}`;
},
},
title: 'CNAME Valid',
type: FieldType.Boolean,
isFilterable: true,
tooltipText: (item: StatusPageDomain): string => {
if (item['isCnameVerified']) {
return 'We have verified your CNAME record.';
}
return `Please add a new CNAME record to your domain ${item['fullDomain']}. It should look like CNAME ${item['fullDomain']} ${StatusPageCNameRecord}`;
{
field: {
isSslProvisioned: true,
},
title: 'SSL Provisioned',
type: FieldType.Boolean,
isFilterable: true,
tooltipText: (_item: StatusPageDomain): string => {
return 'This will happen automatically after CNAME is verified. Please allow 24 hours for SSL to be provisioned after CNAME is verified. If that does not happen in 24 hours, please contact support.';
},
},
},
{
field: {
isSslProvisioned: true,
},
title: 'SSL Provisioned',
type: FieldType.Boolean,
isFilterable: true,
tooltipText: (_item: StatusPageDomain): string => {
return 'This will happen automatically after CNAME is verified. Please allow 24 hours for SSL to be provisioned after CNAME is verified. If it does not happen in 24 hours, please contact support.';
},
},
]}
/>
]}
/>
{cnameModalText && <ConfirmModal
title={`Add CNAME`}
description={ <div>
<span>
Please add CNAME record to your domain. Details of
the CNAME records are:
</span>
<br />
<br />
<span>
<b>Record Type: </b> CNAME
</span>
<br />
<span>
<b>Name: </b>
{cnameModalText}
</span>
<br />
<span>
<b>Content: </b>
{StatusPageCNameRecord}
</span>
<br />
<br />
<span>
Once you have done this, it should take 24 hours to automatically verify.
</span>
</div>}
submitButtonText={'Close'}
onSubmit={() => {
return setCnameModalText('')
}}
/>}
{showSslProvisioningModal && <ConfirmModal
title={`Provision SSL`}
description={`This is an automatic process and takes around 24 hours to complete. If you do not see your SSL provisioned in 24 hours. Please contact support@oneuptime.com`}
submitButtonText={'Close'}
onSubmit={() => {
return setShowSslProvisioningModal(false)
}}
/>}
</>
</Page>
);
};