Improved icon used for failing status domains

This commit is contained in:
Alejandro Celaya
2021-12-28 22:54:17 +01:00
parent ecd6e6a066
commit 0268bb6930
3 changed files with 11 additions and 5 deletions

View File

@@ -3,7 +3,7 @@ import { UncontrolledTooltip } from 'reactstrap';
import { ExternalLink } from 'react-external-link';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import {
faBan as forbiddenIcon,
faTimes as invalidIcon,
faCheck as checkIcon,
faCircleNotch as loadingStatusIcon,
} from '@fortawesome/free-solid-svg-icons';
@@ -25,14 +25,14 @@ export const DomainStatusIcon: FC<{ status: DomainStatus }> = ({ status }) => {
>
{status === 'valid'
? <FontAwesomeIcon fixedWidth icon={checkIcon} className="text-muted" />
: <FontAwesomeIcon fixedWidth icon={forbiddenIcon} className="text-danger" />}
: <FontAwesomeIcon fixedWidth icon={invalidIcon} className="text-danger" />}
</span>
<UncontrolledTooltip target={(() => ref.current) as any} placement="bottom" autohide={status === 'valid'}>
{status === 'valid' ? 'Congratulations! This domain is properly configured.' : (
<span>
Oops! There is some missing configuration, and short URLs shared with this domain will not work.
<br />
Follow <ExternalLink href="https://slnk.to/multi-domain-docs">the documentation</ExternalLink> in order to
Check the <ExternalLink href="https://slnk.to/multi-domain-docs">documentation</ExternalLink> in order to
find out what is missing.
</span>
)}