59 lines
1.5 KiB
TypeScript
Executable File
59 lines
1.5 KiB
TypeScript
Executable File
import {useSettings} from '@common/core/settings/use-settings';
|
|
import {Trans} from '@common/i18n/trans';
|
|
import {ReactNode} from 'react';
|
|
import {ConnectDomainStepProps} from '@common/custom-domains/datatable/connect-domain-dialog/connect-domain-step';
|
|
import {isSubdomain} from '@common/custom-domains/datatable/connect-domain-dialog/is-subdomain';
|
|
import {DomainProgressIndicator} from '@common/custom-domains/datatable/connect-domain-dialog/domain-progress-indicator';
|
|
|
|
export function InfoStep({
|
|
stepper: {
|
|
state: {isLoading, host, serverIp},
|
|
},
|
|
}: ConnectDomainStepProps) {
|
|
const {base_url} = useSettings();
|
|
|
|
if (isLoading) {
|
|
return <DomainProgressIndicator />;
|
|
}
|
|
|
|
if (isSubdomain(host)) {
|
|
return (
|
|
<Message
|
|
title={
|
|
<Trans message="Add this CNAME record to your domain by visiting your DNS provider or registrar." />
|
|
}
|
|
record="CNAME"
|
|
target={base_url}
|
|
/>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<Message
|
|
title={
|
|
<Trans message="Add this A record to your domain by visiting your DNS provider or registrar." />
|
|
}
|
|
record="A"
|
|
target={serverIp}
|
|
/>
|
|
);
|
|
}
|
|
|
|
interface MessageProps {
|
|
title: ReactNode;
|
|
record: string;
|
|
target: string;
|
|
}
|
|
|
|
function Message({title, record, target}: MessageProps) {
|
|
return (
|
|
<div>
|
|
<div className="text-muted mb-10">{title}</div>
|
|
<div className="flex items-center gap-12 text-base p-12 rounded bg-primary/10 text-primary font-semibold">
|
|
<div>{record}</div>
|
|
{target}
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|