Fix custom domain trust center design

Signed-off-by: Sacha Al Himdani <sacha@getprobo.com>

apps/trust/src/pages/OverviewPage.tsx

@@ -5,7 +5,7 @@ import type {
   OverviewPageFragment$key,
 } from "./__generated__/OverviewPageFragment.graphql";
 import { Link, useOutletContext } from "react-router";
-import { groupBy, objectEntries, sprintf } from "@probo/helpers";
+import { groupBy, objectEntries, sprintf, getTrustCenterUrl } from "@probo/helpers";
 import type { TrustGraphQuery$data } from "/queries/__generated__/TrustGraphQuery.graphql";
 import { useTranslate } from "@probo/i18n";
 import { Card, IconChevronRight } from "@probo/ui";
@@ -33,6 +33,7 @@ const overviewFragment = graphql`
       edges {
         node {
           id
+          countries
           ...VendorRowFragment
         }
       }
@@ -63,12 +64,12 @@ export function OverviewPage() {
       <Documents
         audits={trustCenter.audits.edges}
         documents={fragment.documents.edges}
-        url={`/trust/${trustCenter.slug}/documents`}
+        url={getTrustCenterUrl("documents")}
       />
       <Subprocessors
         organizationName={trustCenter.organization.name}
         vendors={fragment.vendors.edges}
-        url={`/trust/${trustCenter.slug}/subprocessors`}
+        url={getTrustCenterUrl("subprocessors")}
       />
     </div>
   );
@@ -143,6 +144,11 @@ function Subprocessors({
     return null;
   }
 
+  const hasAnyCountries = vendors.some(vendor => {
+    const vendorData = vendor.node as any;
+    return vendorData.countries && vendorData.countries.length > 0;
+  });
+
   return (
     <div>
       <h2 className="font-medium mb-1">{__("Subprocessors")}</h2>
@@ -154,7 +160,7 @@ function Subprocessors({
       </p>
       <Rows className="mb-8 *:py-5">
         {vendors.map((vendor) => (
-          <VendorRow key={vendor.node.id} vendor={vendor.node} />
+          <VendorRow key={vendor.node.id} vendor={vendor.node} hasAnyCountries={hasAnyCountries} />
         ))}
         <Link to={url} className="text-sm font-medium flex gap-2 items-center">
           {__("See all subprocessors")}

apps/trust/src/pages/SubprocessorsPage.tsx

@@ -15,6 +15,9 @@ export function SubprocessorsPage({ queryRef }: Props) {
   const data = usePreloadedQuery(currentTrustVendorsQuery, queryRef);
   const vendors =
     data.currentTrustCenter?.vendors.edges.map((edge) => edge.node) ?? [];
+
+  const hasAnyCountries = vendors.some(vendor => vendor.countries.length > 0);
+
   return (
     <div>
       <h2 className="font-medium mb-1">{__("Subprocessors")}</h2>
@@ -26,7 +29,7 @@ export function SubprocessorsPage({ queryRef }: Props) {
       </p>
       <Rows>
         {vendors.map((vendor) => (
-          <VendorRow key={vendor.id} vendor={vendor} />
+          <VendorRow key={vendor.id} vendor={vendor} hasAnyCountries={hasAnyCountries} />
         ))}
       </Rows>
     </div>

apps/trust/src/pages/__generated__/OverviewPageFragment.graphql.ts

@@ -1,5 +1,5 @@
 /**
- * @generated SignedSource<<9f96c62a3e185fed5c07415cf6fa85d1>>
+ * @generated SignedSource<<83bb224d046b751075c6a8667e91e88b>>
  * @lightSyntaxTransform
  * @nogrep
  */
@@ -9,6 +9,7 @@
 // @ts-nocheck
 
 import { ReaderFragment } from 'relay-runtime';
+export type CountryCode = "AD" | "AE" | "AF" | "AG" | "AI" | "AL" | "AM" | "AO" | "AQ" | "AR" | "AS" | "AT" | "AU" | "AW" | "AX" | "AZ" | "BA" | "BB" | "BD" | "BE" | "BF" | "BG" | "BH" | "BI" | "BJ" | "BL" | "BM" | "BN" | "BO" | "BQ" | "BR" | "BS" | "BT" | "BV" | "BW" | "BY" | "BZ" | "CA" | "CC" | "CD" | "CF" | "CG" | "CH" | "CI" | "CK" | "CL" | "CM" | "CN" | "CO" | "CR" | "CU" | "CV" | "CW" | "CX" | "CY" | "CZ" | "DE" | "DJ" | "DK" | "DM" | "DO" | "DZ" | "EC" | "EE" | "EG" | "EH" | "ER" | "ES" | "ET" | "FI" | "FJ" | "FK" | "FM" | "FO" | "FR" | "GA" | "GB" | "GD" | "GE" | "GF" | "GG" | "GH" | "GI" | "GL" | "GM" | "GN" | "GP" | "GQ" | "GR" | "GT" | "GU" | "GW" | "GY" | "HK" | "HM" | "HN" | "HR" | "HT" | "HU" | "ID" | "IE" | "IL" | "IM" | "IN" | "IO" | "IQ" | "IR" | "IS" | "IT" | "JE" | "JM" | "JO" | "JP" | "KE" | "KG" | "KH" | "KI" | "KM" | "KN" | "KP" | "KR" | "KW" | "KY" | "KZ" | "LA" | "LB" | "LC" | "LI" | "LK" | "LR" | "LS" | "LT" | "LU" | "LV" | "LY" | "MA" | "MC" | "MD" | "ME" | "MF" | "MG" | "MH" | "MK" | "ML" | "MM" | "MN" | "MO" | "MP" | "MQ" | "MR" | "MS" | "MT" | "MU" | "MV" | "MW" | "MX" | "MY" | "MZ" | "NA" | "NC" | "NE" | "NF" | "NG" | "NI" | "NL" | "NO" | "NP" | "NR" | "NU" | "NZ" | "OM" | "PA" | "PE" | "PF" | "PG" | "PH" | "PK" | "PL" | "PM" | "PN" | "PR" | "PS" | "PT" | "PW" | "PY" | "QA" | "RE" | "RO" | "RS" | "RU" | "RW" | "SA" | "SB" | "SC" | "SD" | "SE" | "SG" | "SH" | "SI" | "SJ" | "SK" | "SL" | "SM" | "SN" | "SO" | "SR" | "SS" | "ST" | "SV" | "SX" | "SY" | "SZ" | "TC" | "TD" | "TF" | "TG" | "TH" | "TJ" | "TK" | "TL" | "TM" | "TN" | "TO" | "TR" | "TT" | "TV" | "TW" | "TZ" | "UA" | "UG" | "UM" | "US" | "UY" | "UZ" | "VA" | "VC" | "VE" | "VG" | "VI" | "VN" | "VU" | "WF" | "WS" | "YE" | "YT" | "ZA" | "ZM" | "ZW";
 export type DocumentType = "ISMS" | "OTHER" | "POLICY";
 import { FragmentRefs } from "relay-runtime";
 export type OverviewPageFragment$data = {
@@ -34,6 +35,7 @@ export type OverviewPageFragment$data = {
   readonly vendors: {
     readonly edges: ReadonlyArray<{
       readonly node: {
+        readonly countries: ReadonlyArray<CountryCode>;
         readonly id: string;
         readonly " $fragmentSpreads": FragmentRefs<"VendorRowFragment">;
       };
@@ -152,6 +154,13 @@ return {
               "plural": false,
               "selections": [
                 (v0/*: any*/),
+                {
+                  "alias": null,
+                  "args": null,
+                  "kind": "ScalarField",
+                  "name": "countries",
+                  "storageKey": null
+                },
                 {
                   "args": null,
                   "kind": "FragmentSpread",
@@ -224,6 +233,6 @@ return {
 };
 })();
 
-(node as any).hash = "df15ec9b9040d1f4314e04085a932ecb";
+(node as any).hash = "0bda7993ef3be4cfe86083658fc77813";
 
 export default node;