@vtex/faststore-plugin-buyer-portal 2.0.24 → 2.0.25

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vtex/faststore-plugin-buyer-portal",
-  "version": "2.0.24",
+  "version": "2.0.25",
   "description": "A plugin for faststore with buyer portal",
   "main": "index.js",
   "files": [

package/src/features/contracts/types/ContractData.ts

@@ -8,4 +8,9 @@ export type ContractData = {
   salesRepresentative?: string;
   imageUrl?: string;
   assortment?: unknown[];
+  corporateName?: string | null;
+  tradeName?: string | null;
+  corporateDocument?: string | null;
+  documentType?: string | null;
+  localeDefault?: string | null;
 };

package/src/features/profile/layouts/ProfileLayout/ProfileLayout.tsx

@@ -1,8 +1,12 @@
+import { Fragment } from "react";
+
 import { HeaderInside } from "../../../shared/components";
 import { useBuyerPortal } from "../../../shared/hooks";
 import { GlobalLayout, ContractTabsLayout } from "../../../shared/layouts";
 import { useLocalization } from "../../../shared/localization/LocalizationContext";
 
+import { getProfileDetailRows } from "./utils";
+
 import type { ContractData } from "../../../contracts/types";
 
 export type ProfileLayoutProps = {
@@ -13,13 +17,7 @@ export const ProfileLayout = ({ data }: ProfileLayoutProps) => {
   const { t } = useLocalization();
   const { currentOrgUnit: orgUnit } = useBuyerPortal();
 
-  const creationDate = data
-    ? new Date(data.creationDate).toLocaleDateString("en-US", {
-        year: "numeric",
-        month: "long",
-        day: "numeric",
-      })
-    : null;
+  const rows = getProfileDetailRows(data);
 
   return (
     <GlobalLayout>
@@ -39,41 +37,25 @@ export const ProfileLayout = ({ data }: ProfileLayoutProps) => {
                 {t("profile.titles.details")}
               </span>
 
-              {!!data.name && (
-                <>
+              {rows.map((row) => (
+                <Fragment key={row.key}>
                   <hr data-fs-bp-profile-divider />
                   <div data-fs-bp-profile-details-row>
                     <span data-fs-bp-profile-details-row-label>
-                      {t("shared.labels.name")}
+                      {t(row.labelKey)}
                     </span>
                     <span data-fs-bp-profile-details-row-value>
-                      {data.name}
+                      {row.key === "email" ? (
+                        <a href={`mailto:${row.value}`}>{row.value}</a>
+                      ) : (
+                        row.value
+                      )}
                     </span>
                   </div>
-                </>
-              )}
-
-              <hr data-fs-bp-profile-divider />
-
-              <div data-fs-bp-profile-details-row>
-                <span data-fs-bp-profile-details-row-label>
-                  {t("shared.labels.email")}
-                </span>
-                <span data-fs-bp-profile-details-row-value>
-                  <a href={`mailto:${data.email}`}>{data.email}</a>
-                </span>
-              </div>
-
-              <hr data-fs-bp-profile-divider />
-
-              <div data-fs-bp-profile-details-row>
-                <span data-fs-bp-profile-details-row-label>
-                  {t("profile.labels.creationDate")}
-                </span>
-                <span data-fs-bp-profile-details-row-value>{creationDate}</span>
-              </div>
+                </Fragment>
+              ))}
 
-              <hr data-fs-bp-profile-divider />
+              {rows.length > 0 && <hr data-fs-bp-profile-divider />}
             </div>
           )}
         </section>

package/src/features/profile/layouts/ProfileLayout/__tests__/utils.test.ts

@@ -0,0 +1,143 @@
+import { describe, expect, it } from "vitest";
+
+import { getProfileDetailRows, hasContent } from "../utils";
+
+import type { ContractData } from "../../../../contracts/types";
+
+const baseContract: ContractData = {
+  id: "contract-a",
+  name: "Acme Corp",
+  email: "buyer@acme.com",
+  isActive: true,
+  // Noon UTC keeps the local calendar day stable across the timezones CI
+  // and local machines run in, so the formatted date assertion isn't flaky.
+  creationDate: "2026-01-15T12:00:00.000Z",
+};
+
+describe("hasContent", () => {
+  it("is true for a string with at least one non-whitespace character", () => {
+    expect(hasContent("Acme Corp")).toBe(true);
+  });
+
+  it.each([null, undefined, "", "   ", 42, {}])("is false for %p", (value) => {
+    expect(hasContent(value)).toBe(false);
+  });
+});
+
+describe("getProfileDetailRows", () => {
+  it("returns an empty list for a null contract", () => {
+    expect(getProfileDetailRows(null)).toEqual([]);
+  });
+
+  it("renders every row, in order, when all five new fields have content", () => {
+    const contract: ContractData = {
+      ...baseContract,
+      corporateName: "Acme Corporation",
+      tradeName: "Acme",
+      corporateDocument: "12.345.678/0001-90",
+      documentType: "CNPJ",
+      localeDefault: "pt-BR",
+    };
+
+    expect(getProfileDetailRows(contract).map((row) => row.key)).toEqual([
+      "name",
+      "email",
+      "creationDate",
+      "corporateName",
+      "tradeName",
+      "corporateDocument",
+      "documentType",
+      "localeDefault",
+    ]);
+  });
+
+  it("renders only the rows with content, keeping the fixed order", () => {
+    const contract: ContractData = {
+      ...baseContract,
+      documentType: "CNPJ",
+    };
+
+    expect(getProfileDetailRows(contract).map((row) => row.key)).toEqual([
+      "name",
+      "email",
+      "creationDate",
+      "documentType",
+    ]);
+  });
+
+  it.each([null, undefined, "", "   "])(
+    "omits a new field when it resolves to %p",
+    (value) => {
+      const contract: ContractData = {
+        ...baseContract,
+        corporateName: value as string | null | undefined,
+      };
+
+      expect(
+        getProfileDetailRows(contract).some(
+          (row) => row.key === "corporateName"
+        )
+      ).toBe(false);
+    }
+  );
+
+  it("omits a new field that is absent from the payload altogether", () => {
+    expect(
+      getProfileDetailRows(baseContract).some(
+        (row) => row.key === "corporateDocument"
+      )
+    ).toBe(false);
+  });
+
+  it("returns the three legacy rows, byte-equivalent to today's page, when none of the five new fields have content", () => {
+    expect(getProfileDetailRows(baseContract).map((row) => row.key)).toEqual([
+      "name",
+      "email",
+      "creationDate",
+    ]);
+  });
+
+  it("formats creationDate with toLocaleDateString('en-US', { year: 'numeric', month: 'long', day: 'numeric' })", () => {
+    const rows = getProfileDetailRows(baseContract);
+    const creationDateRow = rows.find((row) => row.key === "creationDate");
+
+    expect(creationDateRow?.value).toBe("January 15, 2026");
+  });
+
+  it("omits the creationDate row instead of rendering 'Invalid Date' when the date can't be parsed", () => {
+    const contract: ContractData = {
+      ...baseContract,
+      creationDate: "not-a-date",
+    };
+
+    expect(
+      getProfileDetailRows(contract).some((row) => row.key === "creationDate")
+    ).toBe(false);
+  });
+
+  it("carries the correct labelKey for each of the five new rows", () => {
+    const contract: ContractData = {
+      ...baseContract,
+      corporateName: "Acme Corporation",
+      tradeName: "Acme",
+      corporateDocument: "12.345.678/0001-90",
+      documentType: "CNPJ",
+      localeDefault: "pt-BR",
+    };
+
+    const labelKeysByKey = Object.fromEntries(
+      getProfileDetailRows(contract).map((row) => [row.key, row.labelKey])
+    );
+
+    expect(labelKeysByKey).toEqual({
+      name: "shared.labels.name",
+      email: "shared.labels.email",
+      creationDate: "profile.labels.creationDate",
+      corporateName: "shared.labels.corporateName",
+      tradeName: "shared.labels.tradeName",
+      corporateDocument: "shared.labels.corporateDocument",
+      documentType: "shared.labels.documentType",
+      localeDefault: "shared.labels.localeDefault",
+    });
+  });
+});

package/src/features/profile/layouts/ProfileLayout/utils.ts

@@ -0,0 +1,106 @@
+import type { ContractData } from "../../../contracts/types";
+
+export type ProfileDetailFieldKey =
+  | "name"
+  | "email"
+  | "creationDate"
+  | "corporateName"
+  | "tradeName"
+  | "corporateDocument"
+  | "documentType"
+  | "localeDefault";
+
+/** A row the layout will render. Only rows with content are ever produced. */
+export type ProfileDetailRow = {
+  key: ProfileDetailFieldKey;
+  labelKey: string;
+  value: string;
+};
+
+type ProfileDetailField = {
+  key: ProfileDetailFieldKey;
+  labelKey: string;
+  /** Reads the display value off the contract. May return no content. */
+  resolve: (contract: ContractData) => string | null | undefined;
+};
+
+/** A value is renderable only if it is a string with at least one non-whitespace char. */
+export const hasContent = (value: unknown): value is string =>
+  typeof value === "string" && value.trim().length > 0;
+
+const resolveCreationDate = (contract: ContractData) => {
+  const date = new Date(contract.creationDate);
+
+  if (Number.isNaN(date.getTime())) {
+    return null;
+  }
+
+  return date.toLocaleDateString("en-US", {
+    year: "numeric",
+    month: "long",
+    day: "numeric",
+  });
+};
+
+/** Ordered. This array is the single source of truth for which rows exist and in what order. */
+export const PROFILE_DETAIL_FIELDS: readonly ProfileDetailField[] = [
+  {
+    key: "name",
+    labelKey: "shared.labels.name",
+    resolve: (contract) => contract.name,
+  },
+  {
+    key: "email",
+    labelKey: "shared.labels.email",
+    resolve: (contract) => contract.email,
+  },
+  {
+    key: "creationDate",
+    labelKey: "profile.labels.creationDate",
+    resolve: resolveCreationDate,
+  },
+  {
+    key: "corporateName",
+    labelKey: "shared.labels.corporateName",
+    resolve: (contract) => contract.corporateName,
+  },
+  {
+    key: "tradeName",
+    labelKey: "shared.labels.tradeName",
+    resolve: (contract) => contract.tradeName,
+  },
+  {
+    key: "corporateDocument",
+    labelKey: "shared.labels.corporateDocument",
+    resolve: (contract) => contract.corporateDocument,
+  },
+  {
+    key: "documentType",
+    labelKey: "shared.labels.documentType",
+    resolve: (contract) => contract.documentType,
+  },
+  {
+    key: "localeDefault",
+    labelKey: "shared.labels.localeDefault",
+    resolve: (contract) => contract.localeDefault,
+  },
+];
+
+/** Maps the descriptors over the contract and drops every row without content. */
+export const getProfileDetailRows = (
+  contract: ContractData | null
+): ProfileDetailRow[] => {
+  if (!contract) {
+    return [];
+  }
+
+  return PROFILE_DETAIL_FIELDS.reduce<ProfileDetailRow[]>((rows, field) => {
+    const value = field.resolve(contract);
+
+    if (hasContent(value)) {
+      rows.push({ key: field.key, labelKey: field.labelKey, value });
+    }
+
+    return rows;
+  }, []);
+};

package/src/features/shared/utils/constants.ts

@@ -22,4 +22,4 @@ export const SCOPE_KEYS = {
   CREDIT_CARDS: "creditCards",
 } as const;
 
-export const CURRENT_VERSION = "2.0.24";
+export const CURRENT_VERSION = "2.0.25";