diff --git a/src/components/DomainPicker.tsx b/src/components/DomainPicker.tsx index 957d759eb..2abb403cb 100644 --- a/src/components/DomainPicker.tsx +++ b/src/components/DomainPicker.tsx @@ -38,14 +38,11 @@ import { useQuery } from "@tanstack/react-query"; import { AxiosResponse } from "axios"; import { AlertCircle, - Building2, - Check, - CheckCircle2, + CheckIcon, ChevronsUpDown, ExternalLink, Globe, - KeyRound, - Zap + KeyRound } from "lucide-react"; import { useTranslations } from "next-intl"; import Link from "next/link"; @@ -609,61 +606,72 @@ export default function DomainPicker({ - - + + - -
+ + {t("domainPickerNoDomainsFound")} -
-
- - {organizationDomains.length > 0 && ( - <> + + {organizationDomains.length > 0 && ( - - {organizationDomains.map( - (orgDomain) => ( + {organizationDomains.map( + (orgDomain) => { + const description = + orgDomain.type === + "wildcard" + ? t( + "domainPickerManual" + ) + : `${orgDomain.type.toUpperCase()} · ${ + orgDomain.verified + ? t( + "domainPickerVerified" + ) + : t( + "domainPickerUnverified" + ) + }`; + const optionId = `org-${orgDomain.domainId}`; + + return ( handleBaseDomainSelect( { - id: `org-${orgDomain.domainId}`, + id: optionId, domain: orgDomain.baseDomain, type: "organization", verified: @@ -675,80 +683,63 @@ export default function DomainPicker({ } ) } - className="mx-2 rounded-md" - disabled={ - !orgDomain.verified - } > -
- -
-
- - { - orgDomain.baseDomain - } - - - {orgDomain.type === - "wildcard" ? ( - t( - "domainPickerManual" - ) - ) : ( - <> - {orgDomain.type.toUpperCase()}{" "} - •{" "} - {orgDomain.verified - ? t( - "domainPickerVerified" - ) - : t( - "domainPickerUnverified" - )} - - )} - -
- +
+ + { + orgDomain.baseDomain + } + + + { + description + } + +
- ) - )} -
-
- {(build === "saas" || - build === "enterprise") && - !hideFreeDomain && ( - + ); + } )} - - )} - - {(build === "saas" || build === "enterprise") && - !hideFreeDomain && ( - - + + )} + {organizationDomains.length > 0 && + (build === "saas" || + build === "enterprise") && + !hideFreeDomain && } + {(build === "saas" || + build === "enterprise") && + !hideFreeDomain && ( + handleBaseDomainSelect({ id: "provided-search", @@ -764,14 +755,18 @@ export default function DomainPicker({ type: "provided-search" }) } - className="mx-2 rounded-md" - disabled={requiresPaywall} > -
- -
-
- + +
+ {build === "enterprise" ? t( @@ -781,25 +776,16 @@ export default function DomainPicker({ "domainPickerFreeProvidedDomain" )} - + {t( "domainPickerSearchForAvailableDomains" )}
- - - - )} + + )} +