Update public apps for dedicated host routing

Stop relying on the /trust/{id} path prefix in the public trust app and
serve it from the host root, reading contact and profile data from the
trust center instead of the organization. Mirror the same fragment
ownership change in the compliance portal hero.

Signed-off-by: Bryan Frimin <bryan@probo.com>
This commit is contained in:
Bryan Frimin
2026-07-10 15:17:28 +02:00
parent de367f032f
commit ec80798243
19 changed files with 63 additions and 145 deletions

View File

@@ -24,29 +24,29 @@ import { graphql, useFragment } from "react-relay";
import { externalHref, hostnameOf } from "#/lib/url/hostname";
import type { OrganizationContactInfo_organization$key } from "./__generated__/OrganizationContactInfo_organization.graphql";
import type { TrustCenterContactInfo_trustCenter$key } from "./__generated__/TrustCenterContactInfo_trustCenter.graphql";
import { organizationContactInfo } from "./variants";
const organizationContactInfoFragment = graphql`
fragment OrganizationContactInfo_organization on Organization {
const trustCenterContactInfoFragment = graphql`
fragment TrustCenterContactInfo_trustCenter on TrustCenter {
websiteUrl
email
headquarterAddress
}
`;
interface OrganizationContactInfoProps {
organizationKey: OrganizationContactInfo_organization$key;
interface TrustCenterContactInfoProps {
trustCenterKey: TrustCenterContactInfo_trustCenter$key;
}
// Organization contact details (website, email, HQ) rendered as an icon + label
// row. Owns its fragment so it can be reused wherever the org is in scope.
export function OrganizationContactInfo({ organizationKey }: OrganizationContactInfoProps) {
const organization = useFragment(organizationContactInfoFragment, organizationKey);
// Trust center contact details (website, email, HQ) rendered as an icon + label
// row. Owns its fragment so it can be reused wherever the trust center is in scope.
export function TrustCenterContactInfo({ trustCenterKey }: TrustCenterContactInfoProps) {
const trustCenter = useFragment(trustCenterContactInfoFragment, trustCenterKey);
const hasWebsite = organization.websiteUrl != null && organization.websiteUrl !== "";
const hasEmail = organization.email != null && organization.email !== "";
const hasAddress = organization.headquarterAddress != null && organization.headquarterAddress !== "";
const hasWebsite = trustCenter.websiteUrl != null && trustCenter.websiteUrl !== "";
const hasEmail = trustCenter.email != null && trustCenter.email !== "";
const hasAddress = trustCenter.headquarterAddress != null && trustCenter.headquarterAddress !== "";
// Nothing to show — render no row (and therefore no divider) at all.
if (!hasWebsite && !hasEmail && !hasAddress) {
@@ -60,21 +60,21 @@ export function OrganizationContactInfo({ organizationKey }: OrganizationContact
{hasWebsite && (
<a
className={link()}
href={externalHref(organization.websiteUrl)}
href={externalHref(trustCenter.websiteUrl)}
target="_blank"
rel="noopener noreferrer"
>
<GlobeSimpleIcon />
<Text size={2} color="neutral">
{hostnameOf(organization.websiteUrl)}
{hostnameOf(trustCenter.websiteUrl)}
</Text>
</a>
)}
{hasEmail && (
<a className={link()} href={`mailto:${organization.email}`}>
<a className={link()} href={`mailto:${trustCenter.email}`}>
<EnvelopeIcon />
<Text size={2} color="neutral">
{organization.email}
{trustCenter.email}
</Text>
</a>
)}
@@ -82,7 +82,7 @@ export function OrganizationContactInfo({ organizationKey }: OrganizationContact
<div className={item()}>
<MapPinSimpleIcon />
<Text size={2} color="neutral">
{organization.headquarterAddress}
{trustCenter.headquarterAddress}
</Text>
</div>
)}

View File

@@ -24,7 +24,7 @@ import { graphql, usePreloadedQuery } from "react-relay";
import { ComplianceFrameworksSection } from "#/components/ComplianceFrameworks/ComplianceFrameworksSection";
import { Hero } from "#/components/Hero/Hero";
import { OrganizationContactInfo } from "#/components/Hero/OrganizationContactInfo";
import { TrustCenterContactInfo } from "#/components/Hero/TrustCenterContactInfo";
import { RecentUpdatesSection } from "#/components/RecentUpdates/RecentUpdatesSection";
import { SecurityCommitmentsSection } from "#/components/SecurityCommitments/SecurityCommitmentsSection";
import { TrustedBySection } from "#/components/TrustedBy/TrustedBySection";
@@ -36,8 +36,8 @@ export const homePageQuery = graphql`
currentTrustCenter @required(action: THROW) {
organization {
name
...OrganizationContactInfo_organization
}
...TrustCenterContactInfo_trustCenter
...ComplianceFrameworksSection_trustCenter
...SecurityCommitmentsSection_trustCenter
...TrustedBySection_trustCenter
@@ -62,7 +62,7 @@ export function HomePage({ queryRef }: HomePageProps) {
title={t("home.heroTitle", { name: organization.name })}
description={t("home.heroDescription")}
>
<OrganizationContactInfo organizationKey={organization} />
<TrustCenterContactInfo trustCenterKey={currentTrustCenter} />
</Hero>
<div className="flex w-full flex-col items-center px-8 max-md:px-4">
<div className="flex w-full max-w-5xl flex-col">