mirror of
https://github.com/OneUptime/oneuptime.git
synced 2026-04-06 00:32:12 +02:00
add domain.
This commit is contained in:
Simon Larsen
0
Certs/StatusPageCerts/Readme.md
Normal file → Executable file
0
Certs/StatusPageCerts/Readme.md
Normal file → Executable file
@@ -1,6 +1,6 @@
|
|||||||
import Route from 'Common/Types/API/Route';
|
import Route from 'Common/Types/API/Route';
|
||||||
import Page from 'CommonUI/src/Components/Page/Page';
|
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 PageMap from '../../../Utils/PageMap';
|
||||||
import RouteMap, { RouteUtil } from '../../../Utils/RouteMap';
|
import RouteMap, { RouteUtil } from '../../../Utils/RouteMap';
|
||||||
import PageComponentProps from '../../PageComponentProps';
|
import PageComponentProps from '../../PageComponentProps';
|
||||||
@@ -16,11 +16,18 @@ import ModelTable from 'CommonUI/src/Components/ModelTable/ModelTable';
|
|||||||
import BadDataException from 'Common/Types/Exception/BadDataException';
|
import BadDataException from 'Common/Types/Exception/BadDataException';
|
||||||
import { StatusPageCNameRecord } from 'CommonUI/src/Config';
|
import { StatusPageCNameRecord } from 'CommonUI/src/Config';
|
||||||
import Navigation from 'CommonUI/src/Utils/Navigation';
|
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> = (
|
const StatusPageDelete: FunctionComponent<PageComponentProps> = (
|
||||||
props: PageComponentProps
|
props: PageComponentProps
|
||||||
): ReactElement => {
|
): ReactElement => {
|
||||||
const modelId: ObjectID = Navigation.getLastParamAsObjectID(1);
|
const modelId: ObjectID = Navigation.getLastParamAsObjectID(1);
|
||||||
|
|
||||||
|
|
||||||
|
const [cnameModalText, setCnameModalText] = useState<string>('');
|
||||||
|
const [showSslProvisioningModal, setShowSslProvisioningModal] = useState<boolean>(false);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Page
|
<Page
|
||||||
title={'Status Page'}
|
title={'Status Page'}
|
||||||
@@ -56,101 +63,201 @@ const StatusPageDelete: FunctionComponent<PageComponentProps> = (
|
|||||||
]}
|
]}
|
||||||
sideMenu={<SideMenu modelId={modelId} />}
|
sideMenu={<SideMenu modelId={modelId} />}
|
||||||
>
|
>
|
||||||
<ModelTable<StatusPageDomain>
|
<>
|
||||||
modelType={StatusPageDomain}
|
<ModelTable<StatusPageDomain>
|
||||||
query={{
|
modelType={StatusPageDomain}
|
||||||
projectId: DashboardNavigation.getProjectId()?.toString(),
|
query={{
|
||||||
statusPageId: modelId,
|
projectId: DashboardNavigation.getProjectId()?.toString(),
|
||||||
}}
|
statusPageId: modelId,
|
||||||
name="Status Page > Domains"
|
}}
|
||||||
id="domains-table"
|
name="Status Page > Domains"
|
||||||
isDeleteable={true}
|
id="domains-table"
|
||||||
isCreateable={true}
|
isDeleteable={true}
|
||||||
cardProps={{
|
isCreateable={true}
|
||||||
icon: IconProp.Globe,
|
cardProps={{
|
||||||
title: 'Custom Domains',
|
icon: IconProp.Globe,
|
||||||
description: `Important: Please add ${StatusPageCNameRecord} as your CNAME for these domains for this to work.`,
|
title: 'Custom Domains',
|
||||||
}}
|
description: `Important: Please add ${StatusPageCNameRecord} as your CNAME for these domains for this to work.`,
|
||||||
onBeforeCreate={(
|
}}
|
||||||
item: StatusPageDomain
|
onBeforeCreate={(
|
||||||
): Promise<StatusPageDomain> => {
|
item: StatusPageDomain
|
||||||
if (!props.currentProject || !props.currentProject.id) {
|
): Promise<StatusPageDomain> => {
|
||||||
throw new BadDataException('Project ID cannot be null');
|
if (!props.currentProject || !props.currentProject.id) {
|
||||||
}
|
throw new BadDataException('Project ID cannot be null');
|
||||||
item.statusPageId = modelId;
|
}
|
||||||
item.projectId = props.currentProject.id;
|
item.statusPageId = modelId;
|
||||||
return Promise.resolve(item);
|
item.projectId = props.currentProject.id;
|
||||||
}}
|
return Promise.resolve(item);
|
||||||
noItemsMessage={'No custom domains found.'}
|
}}
|
||||||
viewPageRoute={Navigation.getCurrentRoute()}
|
actionButtons={[
|
||||||
formFields={[
|
{
|
||||||
{
|
title: 'Add CNAME',
|
||||||
field: {
|
buttonStyleType: ButtonStyleType.SUCCESS_OUTLINE,
|
||||||
subdomain: true,
|
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,
|
title: 'Provision SSL',
|
||||||
required: true,
|
buttonStyleType: ButtonStyleType.SUCCESS_OUTLINE,
|
||||||
placeholder: 'status',
|
icon: IconProp.Check,
|
||||||
validation: {
|
isVisible: (item: JSONObject): boolean => {
|
||||||
minLength: 2,
|
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);
|
||||||
|
}
|
||||||
|
},
|
||||||
},
|
},
|
||||||
},
|
]}
|
||||||
{
|
noItemsMessage={'No custom domains found.'}
|
||||||
field: {
|
viewPageRoute={Navigation.getCurrentRoute()}
|
||||||
domain: true,
|
formFields={[
|
||||||
|
{
|
||||||
|
field: {
|
||||||
|
subdomain: true,
|
||||||
|
},
|
||||||
|
title: 'Subdomain',
|
||||||
|
fieldType: FormFieldSchemaType.Text,
|
||||||
|
required: true,
|
||||||
|
placeholder: 'status',
|
||||||
|
validation: {
|
||||||
|
minLength: 2,
|
||||||
|
},
|
||||||
},
|
},
|
||||||
title: 'Domain',
|
{
|
||||||
description:
|
field: {
|
||||||
'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.',
|
domain: true,
|
||||||
fieldType: FormFieldSchemaType.Dropdown,
|
},
|
||||||
dropdownModal: {
|
title: 'Domain',
|
||||||
type: Domain,
|
description:
|
||||||
labelField: 'domain',
|
'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.',
|
||||||
valueField: '_id',
|
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={[
|
||||||
showRefreshButton={true}
|
{
|
||||||
showFilterButton={true}
|
field: {
|
||||||
columns={[
|
fullDomain: true,
|
||||||
{
|
},
|
||||||
field: {
|
title: 'Name',
|
||||||
fullDomain: true,
|
type: FieldType.Text,
|
||||||
|
isFilterable: true,
|
||||||
},
|
},
|
||||||
title: 'Name',
|
{
|
||||||
type: FieldType.Text,
|
field: {
|
||||||
isFilterable: true,
|
isCnameVerified: true,
|
||||||
},
|
},
|
||||||
{
|
title: 'CNAME Valid',
|
||||||
field: {
|
type: FieldType.Boolean,
|
||||||
isCnameVerified: true,
|
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,
|
field: {
|
||||||
isFilterable: true,
|
isSslProvisioned: true,
|
||||||
tooltipText: (item: StatusPageDomain): string => {
|
},
|
||||||
if (item['isCnameVerified']) {
|
title: 'SSL Provisioned',
|
||||||
return 'We have verified your CNAME record.';
|
type: FieldType.Boolean,
|
||||||
}
|
isFilterable: true,
|
||||||
return `Please add a new CNAME record to your domain ${item['fullDomain']}. It should look like CNAME ${item['fullDomain']} ${StatusPageCNameRecord}`;
|
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,
|
{cnameModalText && <ConfirmModal
|
||||||
},
|
title={`Add CNAME`}
|
||||||
title: 'SSL Provisioned',
|
description={ <div>
|
||||||
type: FieldType.Boolean,
|
<span>
|
||||||
isFilterable: true,
|
Please add CNAME record to your domain. Details of
|
||||||
tooltipText: (_item: StatusPageDomain): string => {
|
the CNAME records are:
|
||||||
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.';
|
</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>
|
</Page>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
Reference in New Issue
Block a user