npm - @vtex/faststore-plugin-buyer-portal - Versions diffs - 1.3.82 → 1.3.84 - Mend

@vtex/faststore-plugin-buyer-portal 1.3.82 → 1.3.84

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (12) hide show

package/CHANGELOG.md CHANGED Viewed

@@ -7,6 +7,17 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ## [Unreleased]
+## [1.3.84] - 2026-05-07
+### Fixed
+- Align payment methods scope-config requests with the new `payment-groups` BFF by changing `SCOPE_KEYS.PAYMENT_SYSTEMS` value from `paymentSystemIds` to `paymentGroups`. The sync vs custom mode toggle and read on the payment methods page now hit `/scopes/configs?scopeName=paymentGroups`
+## [1.3.83] - 2026-05-05
+### Added
+- Show Contract ID in AboutDrawer component
 ## [1.3.82] - 2026-04-29
 ### Changed
@@ -610,7 +621,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Add CHANGELOG file
 - Add README file
-[unreleased]: https://github.com/vtex/faststore-plugin-buyer-portal/compare/v1.3.82...HEAD
+[unreleased]: https://github.com/vtex/faststore-plugin-buyer-portal/compare/v1.3.84...HEAD
 [1.3.55]: https://github.com/vtex/faststore-plugin-buyer-portal/compare/v1.3.54...v1.3.55
 [1.3.54]: https://github.com/vtex/faststore-plugin-buyer-portal/compare/v1.3.53...v1.3.54
 [1.3.53]: https://github.com/vtex/faststore-plugin-buyer-portal/compare/v1.3.52...v1.3.53
@@ -678,6 +689,8 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 [1.3.65]: https://github.com/vtex/faststore-plugin-buyer-portal/compare/v1.3.64...v1.3.65
 [1.3.64]: https://github.com/vtex/faststore-plugin-buyer-portal/releases/tag/1.3.64
 [1.3.69]: https://github.com/vtex/faststore-plugin-buyer-portal/releases/tag/1.3.69
+[1.3.84]: https://github.com/vtex/faststore-plugin-buyer-portal/compare/v1.3.83...v1.3.84
+[1.3.83]: https://github.com/vtex/faststore-plugin-buyer-portal/compare/v1.3.82...v1.3.83
 [1.3.82]: https://github.com/vtex/faststore-plugin-buyer-portal/compare/v1.3.81...v1.3.82
 [1.3.81]: https://github.com/vtex/faststore-plugin-buyer-portal/compare/v1.3.80...v1.3.81
 [1.3.80]: https://github.com/vtex/faststore-plugin-buyer-portal/compare/v1.3.79...v1.3.80

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@vtex/faststore-plugin-buyer-portal",
-  "version": "1.3.82",
+  "version": "1.3.84",
   "description": "A plugin for faststore with buyer portal",
   "main": "index.js",
   "scripts": {

package/src/features/org-units/components/OrgUnitDetailsNavbar/OrgUnitDetailsNavbar.tsx CHANGED Viewed

@@ -12,6 +12,7 @@ import { doLogout } from "../../../shared/utils";
 export type OrgUnitDetailsNavbarProps = {
   orgId: string;
+  contractId?: string;
   orgName: string;
   person: {
     image?: string;
@@ -26,6 +27,7 @@ export const OrgUnitDetailsNavbar = ({
   person,
   orgName,
   orgId,
+  contractId = "",
 }: OrgUnitDetailsNavbarProps) => {
   const {
     open: openAboutMenu,
@@ -73,6 +75,7 @@ export const OrgUnitDetailsNavbar = ({
       </div>
       {isOpenAboutMenu && (
         <AboutDrawer
+          contractId={contractId}
           {...aboutMenuDrawerProps}
           isOpen={isOpenAboutMenu}
           unitId={orgId}

package/src/features/org-units/layouts/OrgUnitDetailsLayout/OrgUnitDetailsLayout.tsx CHANGED Viewed

@@ -63,6 +63,7 @@ export const OrgUnitsDetailsLayout = ({
       <OrgUnitDetailsNavbar
         orgId={orgUnit.id}
         orgName={orgUnit.name}
+        contractId={isSingleContract ? contracts[0]?.id : ""}
         person={{
           name: user?.name ?? "",
           email: user?.email ?? "",

package/src/features/shared/layouts/BaseTabsLayout/Navbar.tsx CHANGED Viewed

@@ -18,6 +18,7 @@ import type { OrgUnitBasicData } from "../../../org-units/types";
 export type NavbarProps = {
   orgUnit?: OrgUnitBasicData | null;
+  contractId?: string;
   pageName: string;
   person: {
     image?: ReactNode;
@@ -34,6 +35,7 @@ export const Navbar = ({
   person,
   pageName,
   loading = false,
+  contractId = "",
   ...otherProps
 }: NavbarProps) => {
   const {
@@ -111,6 +113,7 @@ export const Navbar = ({
       )}
       {isOpenAboutMenu && (
         <AboutDrawer
+          contractId={contractId}
           {...aboutMenuDrawerProps}
           unitId={orgUnit?.id ?? ""}
           isOpen={isOpenAboutMenu}

package/src/features/shared/layouts/BaseTabsLayout/about-drawer/AboutDrawer.tsx CHANGED Viewed

@@ -6,10 +6,16 @@ import { CURRENT_VERSION } from "../../../utils/constants";
 export type AboutDrawerProps = Omit<BasicDrawerProps, "children"> & {
   unitId: string;
+  contractId?: string;
   close: () => void;
 };
-export const AboutDrawer = ({ unitId, close, ...props }: AboutDrawerProps) => {
+export const AboutDrawer = ({
+  unitId,
+  close,
+  contractId = "",
+  ...props
+}: AboutDrawerProps) => {
   const { dependenciesVersion, isDependenciesVersionLoading } =
     useGetDependenciesVersion(unitId);
@@ -22,24 +28,20 @@ export const AboutDrawer = ({ unitId, close, ...props }: AboutDrawerProps) => {
     >
       <BasicDrawer.Heading title="About" onClose={close} />
       <BasicDrawer.Body data-bp-about-menu-drawer-body>
-        Version details
-        {isDependenciesVersionLoading && (
-          <div data-fs-bp-basic-buying-policy-drawer-skeleton>
+        <div data-fs-bp-about-information>
+          <p data-fs-bp-about-information-title>Version details</p>
+          {isDependenciesVersionLoading ? (
             <Skeleton size={{ width: "100%", height: "3.5rem" }} />
-          </div>
-        )}
-        {!isDependenciesVersionLoading && (
-          <div data-fs-bp-about-information>
-            <div data-fs-bp-about-row>
-              <span data-fs-bp-about-row-label>Organization Account</span>
-              <span data-fs-bp-about-row-value>{CURRENT_VERSION}</span>
-            </div>
-            <hr data-fs-bp-about-divider />
-            {dependenciesVersion &&
-              dependenciesVersion.buyerPortalApps.map((buyerPortalApp) => {
-                return (
-                  <div key={buyerPortalApp.appName}>
-                    <div data-fs-bp-about-row>
+          ) : (
+            <>
+              <div data-fs-bp-about-row>
+                <span data-fs-bp-about-row-label>Organization Account</span>
+                <span data-fs-bp-about-row-value>{CURRENT_VERSION}</span>
+              </div>
+              {dependenciesVersion &&
+                dependenciesVersion.buyerPortalApps.map((buyerPortalApp) => {
+                  return (
+                    <div data-fs-bp-about-row key={buyerPortalApp.appName}>
                       <span data-fs-bp-about-row-label>
                         {buyerPortalApp.appName}
                       </span>
@@ -47,12 +49,22 @@ export const AboutDrawer = ({ unitId, close, ...props }: AboutDrawerProps) => {
                         {buyerPortalApp.appVersion}
                       </span>
                     </div>
-                    <hr data-fs-bp-about-divider />
-                  </div>
-                );
-              })}
-          </div>
-        )}
+                  );
+                })}
+            </>
+          )}
+        </div>
+        <div data-fs-bp-about-information>
+          <p data-fs-bp-about-information-title>Navigation Details</p>
+          {!!contractId && (
+            <>
+              <div data-fs-bp-about-row data-fs-bp-about-row-contract-id>
+                <span data-fs-bp-about-row-label>Contract ID</span>
+                <span data-fs-bp-about-row-value>{contractId}</span>
+              </div>
+            </>
+          )}
+        </div>
       </BasicDrawer.Body>
     </BasicDrawer>
   );

package/src/features/shared/layouts/BaseTabsLayout/about-drawer/about-drawer.scss CHANGED Viewed

@@ -29,29 +29,44 @@
   [data-fs-bp-about-row] {
     display: flex;
-    padding: 1.375rem 0;
-    font-weight: var(--fs-text-weight-medium);
-    size: var(--fs-text-size-1);
-    line-height: calc(var(--fs-spacing-3) + var(--fs-spacing-0));
+    padding: var(--fs-bp-padding-4) var(--fs-bp-padding-1);
+    color: var(--fs-bp-color-black);
+    border-bottom: var(--fs-border-width) solid var(--fs-bp-color-neutral-3);
+    @include text-style('body');
+    line-height: var(--fs-bp-line-height-lg);
+    &[data-fs-bp-about-row-contract-id] {
+      flex-direction: column;
+      align-items: flex-start;
+      gap: var(--fs-bp-gap-2);
+      [data-fs-bp-about-row-value] {
+        word-break: break-word;
+      }
+      [data-fs-bp-about-row-label] {
+        flex: 0 0 auto;
+      }
+    }
     [data-fs-bp-about-row-label] {
-      width: 12.5rem;
-      color: #707070;
-      font-size: var(--fs-text-size-1);
-      font-weight: 500;
+      flex: 0 0 12.5rem;
+      color: var(--fs-bp-color-neutral-7);
     }
-    [data-fs-bp-about-row-details] {
-      color: #000;
-      font-size: var(--fs-text-size-1);
-      font-weight: 500;
+    [data-fs-bp-about-row-value] {
+      flex: 1;
     }
   }
-  [data-fs-bp-about-divider] {
-    border: calc(var(--fs-border-width) / 2) solid #e0e0e0;
-  }
   [data-fs-bp-about-information] {
-    padding-top: 1rem;
+    padding-bottom: var(--fs-bp-padding-8);
+    [data-fs-bp-about-information-title] {
+      @include text-style('body-big');
+      color: var(--fs-bp-color-black);
+      padding-bottom: var(--fs-bp-padding-4);
+      font-weight: var(--fs-bp-weight-semibold);
+    }
   }
 }

package/src/features/shared/layouts/ContractTabsLayout/ContractTabsLayout.tsx CHANGED Viewed

@@ -35,6 +35,7 @@ export const ContractTabsLayout = ({
   return (
     <BaseTabsLayout data-fs-bp-contract-tabs-layout>
       <BaseTabsLayout.Navbar
+        contractId={currentContract?.id ?? contractId ?? ""}
         orgUnit={currentOrgUnit}
         pageName={pageName}
         person={{

package/src/features/shared/layouts/ErrorTabsLayout/ErrorTabsLayout.tsx CHANGED Viewed

@@ -107,6 +107,7 @@ export const ErrorTabsLayout = ({ children, error }: ErrorTabsLayoutProps) => {
               name: user?.name ?? "",
             }}
             loading={false}
+            contractId={contract?.id ?? ""}
           />
           <ErrorTabsLayoutContent title={pageTitle} error={error} />
         </div>

package/src/features/shared/layouts/FinanceTabsLayout/FinanceTabsLayout.tsx CHANGED Viewed

@@ -25,6 +25,7 @@ export const FinanceTabsLayout = ({
   return (
     <BaseTabsLayout data-fs-bp-finance-tabs-layout>
       <BaseTabsLayout.Navbar
+        contractId={currentContract?.id ?? ""}
         orgUnit={currentOrgUnit}
         pageName={pageName}
         person={{

package/src/features/shared/layouts/OrgUnitTabsLayout/OrgUnitTabLayout.tsx CHANGED Viewed

@@ -15,13 +15,14 @@ export const OrgUnitTabsLayout = ({
   children,
   loading = false,
 }: OrgUnitTabsLayoutProps) => {
-  const { currentOrgUnit, currentUser } = useBuyerPortal();
+  const { currentOrgUnit, currentUser, currentContract } = useBuyerPortal();
   const verticalLinks = getOrganizationSettingsLinks(currentOrgUnit?.id ?? "");
   return (
     <BaseTabsLayout data-fs-bp-org-unit-tabs-layout>
       <BaseTabsLayout.Navbar
+        contractId={currentContract?.id ?? ""}
         orgUnit={currentOrgUnit}
         pageName={pageName}
         person={{

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

@@ -18,11 +18,11 @@ export const SCOPE_KEYS = {
   ADDRESSES: "addresses",
   CUSTOM_FIELDS: "customFields",
   COLLECTIONS: "collectionIds",
-  PAYMENT_SYSTEMS: "paymentSystemIds",
+  PAYMENT_SYSTEMS: "paymentGroups",
   CREDIT_CARDS: "creditCards",
 } as const;
-export const CURRENT_VERSION = "1.3.82";
+export const CURRENT_VERSION = "1.3.84";
 export const CHANGES_TIMEOUT_MESSAGE =
   "Changes may take up to 10 minutes to apply.";