91 lines
3.3 KiB
JavaScript
91 lines
3.3 KiB
JavaScript
import React from 'react';
|
|
import CustomDomain from './CustomDomain';
|
|
|
|
/**
|
|
* Main component for domain configuration
|
|
* @param {Object} props - Component props
|
|
* @param {Object} props.domainConfig - Domain configuration state
|
|
* @param {Object} props.validation - Domain validation state
|
|
* @param {Object} props.dnsVerified - DNS verification state
|
|
* @param {Object} props.handlers - Event handlers for domain config
|
|
* @param {Function} props.checkDnsConfig - Function to check DNS config
|
|
* @param {string} props.defaultSubdomain - Default SiliconPin subdomain
|
|
* @param {Function} props.showToast - Function to show toast notifications
|
|
* @returns {JSX.Element} - Rendered component
|
|
*/
|
|
const DomainConfiguration = ({
|
|
domainConfig,
|
|
validation,
|
|
dnsVerified,
|
|
handlers,
|
|
checkDnsConfig,
|
|
defaultSubdomain,
|
|
showToast
|
|
}) => {
|
|
const { useSubdomain, useCustomDomain } = domainConfig;
|
|
const {
|
|
handleUseSubdomainChange,
|
|
handleUseCustomDomainChange
|
|
} = handlers;
|
|
|
|
return (
|
|
<div className="pt-4 border-t border-neutral-700">
|
|
<h3 className="text-lg font-medium text-white mb-4">Destination</h3>
|
|
|
|
<div className="space-y-4">
|
|
{/* SiliconPin Subdomain */}
|
|
<div className="flex items-start gap-2">
|
|
<input
|
|
type="checkbox"
|
|
id="use-subdomain"
|
|
checked={useSubdomain}
|
|
onChange={handleUseSubdomainChange}
|
|
className="mt-1"
|
|
/>
|
|
<div className="flex-1">
|
|
<label htmlFor="use-subdomain" className="block text-white font-medium">Use SiliconPin Subdomain</label>
|
|
<div className="mt-2 flex">
|
|
<input
|
|
type="text"
|
|
id="subdomain"
|
|
value={defaultSubdomain}
|
|
className="rounded-l-md py-2 px-3 bg-neutral-600 border-y border-l border-neutral-600 text-neutral-300 focus:outline-none w-1/3 font-mono"
|
|
readOnly
|
|
aria-label="Default subdomain"
|
|
/>
|
|
<span className="rounded-r-md py-2 px-3 bg-neutral-800 border border-neutral-700 text-neutral-400 w-2/3">.subdomain.siliconpin.com</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{/* Custom Domain */}
|
|
<div className="flex items-start gap-2">
|
|
<input
|
|
type="checkbox"
|
|
id="use-custom-domain"
|
|
checked={useCustomDomain}
|
|
onChange={handleUseCustomDomainChange}
|
|
className="mt-1"
|
|
/>
|
|
<div className="flex-1">
|
|
<label htmlFor="use-custom-domain" className="block text-white font-medium">Use Custom Domain</label>
|
|
|
|
{useCustomDomain && (
|
|
<CustomDomain
|
|
domainConfig={domainConfig}
|
|
validation={validation}
|
|
dnsVerified={dnsVerified}
|
|
handlers={handlers}
|
|
checkDnsConfig={checkDnsConfig}
|
|
defaultSubdomain={defaultSubdomain}
|
|
showToast={showToast}
|
|
/>
|
|
)}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default DomainConfiguration; |