@vtex/faststore-plugin-buyer-portal 1.3.25 → 1.3.27

package/CHANGELOG.md

@@ -7,6 +7,19 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+## [1.3.27] - 2025-11-25
+
+
+### Changed
+
+- Style improvements and consistency updates to the `basic-buying-policy-drawer.scss` file.
+
+## [1.3.26] - 2025-11-25
+
+### Added
+
+- Pre-populate default addresses in Address Settings drawer
+
 ## [1.3.25] - 2025-11-25
 
 ### Added
@@ -256,7 +269,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.25...HEAD
+[unreleased]: https://github.com/vtex/faststore-plugin-buyer-portal/compare/v1.3.27...HEAD
 [1.2.3]: https://github.com/vtex/faststore-plugin-buyer-portal/compare/v1.2.2...1.2.3
 [1.2.3]: https://github.com/vtex/faststore-plugin-buyer-portal/releases/tag/1.2.3
 [1.2.4]: https://github.com/vtex/faststore-plugin-buyer-portal/releases/tag/1.2.4
@@ -271,6 +284,8 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 # <<<<<<< HEAD
 
+[1.3.27]: https://github.com/vtex/faststore-plugin-buyer-portal/compare/v1.3.26...v1.3.27
+[1.3.26]: https://github.com/vtex/faststore-plugin-buyer-portal/compare/v1.3.25...v1.3.26
 [1.3.25]: https://github.com/vtex/faststore-plugin-buyer-portal/compare/v1.3.24...v1.3.25
 [1.3.24]: https://github.com/vtex/faststore-plugin-buyer-portal/compare/v1.3.23...v1.3.24
 [1.3.23]: https://github.com/vtex/faststore-plugin-buyer-portal/compare/v1.3.22...v1.3.23

package/package.json

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

package/src/features/addresses/clients/DefaultValuesClient.ts

@@ -1,7 +1,10 @@
 import { Client } from "../../shared/clients/Client";
 import { getApiUrl } from "../../shared/utils";
 
-import type { DefaultAddressParams } from "../types/AddressData";
+import type {
+  DefaultAddressParams,
+  DefaultAddressResponse,
+} from "../types/AddressData";
 
 export default class DefaultValuesClient extends Client {
   constructor() {
@@ -42,6 +45,33 @@ export default class DefaultValuesClient extends Client {
       }
     );
   }
+
+  getDefaultAddress({
+    customerId,
+    orgUnitId,
+    addressType,
+    cookie,
+  }: {
+    customerId: string;
+    orgUnitId: string;
+    addressType: "shipping" | "billing";
+    cookie: string;
+  }) {
+    const entity =
+      addressType === "shipping" ? "address/shipping" : "address/billing";
+
+    return this.get<DefaultAddressResponse>(
+      `/customers/${customerId}/units/${orgUnitId}/default-values`,
+      {
+        headers: {
+          Cookie: cookie,
+        },
+        params: {
+          entity,
+        },
+      }
+    );
+  }
 }
 
 const defaultValuesClient = new DefaultValuesClient();

package/src/features/addresses/components/CreateAddressSettingsDrawer/CreateAddressSettingsDrawer.tsx

@@ -1,8 +1,8 @@
-import { useState } from "react";
+import { useState, useEffect } from "react";
 
 import { useRouter } from "next/router";
 
-import { useUI } from "@faststore/ui";
+import { useUI, Skeleton } from "@faststore/ui";
 
 import {
   type BasicDrawerProps,
@@ -14,6 +14,7 @@ import { OptionSelected } from "../../../shared/components/OptionSelected/Option
 import { SearchHighlight } from "../../../shared/components/SearchHighlight/SearchHighlight";
 import { ADDRESS_MESSAGES } from "../../constants/messages";
 import { useDebouncedSearchAddressByUnitId } from "../../hooks/useDebouncedSearchAddressByUnitId";
+import { useGetDefaultAddress } from "../../hooks/useGetDefaultAddresses";
 import { useSetDefaultAddress } from "../../hooks/useSetDefaultAddress";
 import AddressDisplay from "../AddressInfoDisplay/AddressInfoDisplay";
 
@@ -33,7 +34,6 @@ export const CreateAddressSettingsDrawer = ({
   ...props
 }: CreateAddressSettingsDrawerProps) => {
   const { pushToast } = useUI();
-
   const router = useRouter();
 
   const [searchValue, setSearchValue] = useState("");
@@ -47,6 +47,36 @@ export const CreateAddressSettingsDrawer = ({
     {} as AddressData
   );
 
+  const {
+    defaultAddress: defaultShippingAddress,
+    isDefaultAddressLoading: isLoadingShipping,
+  } = useGetDefaultAddress({
+    customerId: router.query.contractId as string,
+    orgUnitId: router.query.orgUnitId as string,
+    addressType: "shipping",
+  });
+
+  const {
+    defaultAddress: defaultBillingAddress,
+    isDefaultAddressLoading: isLoadingBilling,
+  } = useGetDefaultAddress({
+    customerId: router.query.contractId as string,
+    orgUnitId: router.query.orgUnitId as string,
+    addressType: "billing",
+  });
+
+  useEffect(() => {
+    if (defaultShippingAddress && !shippingAddress?.id) {
+      setShippingAddress(defaultShippingAddress);
+    }
+  }, [defaultShippingAddress]);
+
+  useEffect(() => {
+    if (defaultBillingAddress && !billingAddress?.id) {
+      setBillingAddress(defaultBillingAddress);
+    }
+  }, [defaultBillingAddress]);
+
   const { searchedAddresses } = useDebouncedSearchAddressByUnitId({
     orgUnitId: router.query.orgUnitId as string,
     search: searchValue,
@@ -118,7 +148,9 @@ export const CreateAddressSettingsDrawer = ({
           Default shipping address (optional)
         </p>
 
-        {shippingAddress?.id ? (
+        {isLoadingShipping ? (
+          <Skeleton size={{ height: "3.5rem", width: "100%" }} />
+        ) : shippingAddress?.id ? (
           <OptionSelected
             label={shippingAddress.name}
             triggerIcon={<Icon name="MinusCircle" />}
@@ -169,7 +201,9 @@ export const CreateAddressSettingsDrawer = ({
           Default billing address (optional)
         </p>
 
-        {billingAddress?.id ? (
+        {isLoadingBilling ? (
+          <Skeleton size={{ height: "3.5rem", width: "100%" }} />
+        ) : billingAddress?.id ? (
           <OptionSelected
             label={billingAddress.name}
             triggerIcon={<Icon name="MinusCircle" />}

package/src/features/addresses/hooks/index.ts

@@ -5,3 +5,6 @@ export * from "./useAddLocationsToAddress";
 export * from "./useAddressLocationList";
 export * from "./useAddressLocationEdit";
 export * from "./useAddressLocationDelete";
+export * from "./useSetDefaultAddress";
+export * from "./useUnsetDefaultAddress";
+export * from "./useGetDefaultAddresses";

package/src/features/addresses/hooks/useGetDefaultAddresses.ts

@@ -0,0 +1,34 @@
+import { type QueryOptions, useQuery } from "../../shared/hooks";
+import { getDefaultAddressService } from "../services";
+
+import type { AddressData } from "../types";
+
+interface GetDefaultAddressParams {
+  customerId: string;
+  orgUnitId: string;
+  addressType: "shipping" | "billing";
+}
+
+export const useGetDefaultAddress = (
+  { customerId, orgUnitId, addressType }: GetDefaultAddressParams,
+  options?: QueryOptions<AddressData | null>
+) => {
+  const { data, error, isLoading, refetch } = useQuery(
+    `defaultAddress/${customerId}/${orgUnitId}/${addressType}`,
+    ({ cookie }) =>
+      getDefaultAddressService({
+        customerId,
+        orgUnitId,
+        addressType,
+        cookie,
+      }),
+    options
+  );
+
+  return {
+    defaultAddress: data,
+    hasDefaultAddressError: error,
+    isDefaultAddressLoading: isLoading,
+    refetchDefaultAddress: refetch,
+  };
+};

package/src/features/addresses/services/default-values/get-default-address.service.ts

@@ -0,0 +1,58 @@
+import { defaultValuesClient } from "../../clients/DefaultValuesClient";
+
+import type { AddressData, DefaultAddressResponse } from "../../types";
+
+export interface GetDefaultAddressServiceProps {
+  customerId: string;
+  orgUnitId: string;
+  addressType: "shipping" | "billing";
+  cookie: string;
+}
+
+const mapDefaultAddressToAddressData = (
+  response: DefaultAddressResponse
+): AddressData => {
+  return {
+    id: response.userId || "",
+    name: response.addressLabel,
+    types: [response.addressType],
+    isActive: response.isActive,
+    isDefault: true,
+    streetAddress: response.street,
+    streetAddress2: response.complement,
+    streetNumber: response.number,
+    number: response.number,
+    unit: "",
+    neighborhood: response.neighborhood,
+    city: response.city,
+    state: response.state,
+    zip: response.postalCode,
+    country: response.country,
+    geoCoordinates: response.geoCoordinate || "",
+    locations: [],
+  };
+};
+
+export async function getDefaultAddressService({
+  customerId,
+  orgUnitId,
+  addressType,
+  cookie,
+}: GetDefaultAddressServiceProps): Promise<AddressData | null> {
+  try {
+    const data = await defaultValuesClient.getDefaultAddress({
+      customerId,
+      orgUnitId,
+      addressType,
+      cookie,
+    });
+
+    if (!data) {
+      return null;
+    }
+
+    return mapDefaultAddressToAddressData(data);
+  } catch {
+    return null;
+  }
+}

package/src/features/addresses/services/index.ts

@@ -31,3 +31,7 @@ export {
   getAddressRecipientsService,
   type GetAddressRecipientsServiceProps,
 } from "./recipients/get-address-recipients.service";
+export {
+  getDefaultAddressService,
+  type GetDefaultAddressServiceProps,
+} from "./default-values/get-default-address.service";

package/src/features/addresses/types/AddressData.ts

@@ -171,3 +171,17 @@ export type EditDeleteLocationParams = {
   location: LocationData;
   unitId: string;
 };
+
+export type DefaultAddressResponse = Pick<
+  CheckoutAddress,
+  "postalCode" | "city" | "state" | "street" | "number" | "complement"
+> &
+  Pick<PaymentAddress, "addressType" | "receiverName"> & {
+    addressName: string;
+    addressLabel: string;
+    neighborhood: string;
+    country: string;
+    geoCoordinate: string | null;
+    isActive: boolean;
+    userId?: string;
+  };

package/src/features/addresses/types/index.ts

@@ -5,4 +5,5 @@ export type {
   RecipientInput,
   RecipientData,
   AddressInput,
+  DefaultAddressResponse,
 } from "./AddressData";

package/src/features/buying-policies/components/BasicBuyingPolicyDrawer/basic-buying-policy-drawer.scss

@@ -1,14 +1,14 @@
-@import "../../../shared/components/BasicDrawer/basic-drawer.scss";
-@import "../../../shared/components/OrgUnitInputSearch/org-unit-input-search.scss";
-@import "../../../shared/components/CustomDropdown/custom-dropdown.scss";
-@import "../BudgetCriteriaSelector/budget-criteria-selector.scss";
+@import '../../../shared/components/BasicDrawer/basic-drawer.scss';
+@import '../../../shared/components/OrgUnitInputSearch/org-unit-input-search.scss';
+@import '../../../shared/components/CustomDropdown/custom-dropdown.scss';
+@import '../BudgetCriteriaSelector/budget-criteria-selector.scss';
 
 [data-fs-bp-basic-buying-policy-drawer] {
-  @import "../../../shared/components/InputText/input-text.scss";
-  @import "../../../shared/components/ErrorMessage/error-message.scss";
-  @import "../../../shared/components/LevelDivider/level-divider.scss";
-  @import "@faststore/ui/src/components/molecules/Tooltip/styles.scss";
-  @import "@faststore/ui/src/components/molecules/Dropdown/styles.scss";
+  @import '../../../shared/components/InputText/input-text.scss';
+  @import '../../../shared/components/ErrorMessage/error-message.scss';
+  @import '../../../shared/components/LevelDivider/level-divider.scss';
+  @import '@faststore/ui/src/components/molecules/Tooltip/styles.scss';
+  @import '@faststore/ui/src/components/molecules/Dropdown/styles.scss';
 
   [data-fs-bp-autocomplete-dropdown] {
     [data-fs-bp-input-text-input] {
@@ -65,7 +65,7 @@
       gap: var(--fs-spacing-2);
       margin-top: calc(var(--fs-spacing-0) + var(--fs-spacing-3));
 
-      @include media("<=tablet") {
+      @include media('<=tablet') {
         justify-content: center;
       }
     }
@@ -94,15 +94,16 @@
         height: 100%;
         margin: 0;
         background-color: #f5f5f5;
-        font-family: "Roboto", monospace;
+        font-family: 'Roboto', monospace;
         font-size: var(--fs-text-size-1);
         border: var(--fs-border-width) solid #d6d6d6;
-        padding: calc(var(--fs-spacing-3) + var(--fs-spacing-0))
-          var(--fs-spacing-3);
+        padding: calc(var(--fs-spacing-3) + var(--fs-spacing-0)) var(--fs-spacing-3);
         border-radius: calc(var(--fs-border-radius) * 2);
         text-wrap: nowrap;
         text-overflow: ellipsis;
         white-space: nowrap;
+        overflow: hidden;
+        max-width: 840px;
         cursor: pointer;
 
         [data-fs-bp-label] {
@@ -119,18 +120,17 @@
       }
     }
 
-
     [data-fs-bp-input-text-criteria] {
       color: #5c5c5c;
 
       label {
-        font-family: "Roboto", monospace;
+        font-family: 'Roboto', monospace;
         font-size: var(--fs-text-size-1);
       }
 
       &[data-fs-bp-input-text-code] {
         background-color: #f5f5f5;
-        font-family: "Roboto", monospace;
+        font-family: 'Roboto', monospace;
         font-size: var(--fs-text-size-1);
       }
 
@@ -142,8 +142,7 @@
     }
 
     [data-fs-bp-buying-policy-add-level-button] {
-      padding: var(--fs-spacing-2)
-        calc(var(--fs-spacing-0) + var(--fs-spacing-3));
+      padding: var(--fs-spacing-2) calc(var(--fs-spacing-0) + var(--fs-spacing-3));
       margin: calc(var(--fs-spacing-0) + var(--fs-spacing-3)) 0;
       border-radius: var(--fs-border-radius-pill);
       border: var(--fs-border-width) solid #d6d6d6;
@@ -160,4 +159,12 @@
   [data-fs-bp-basic-buying-policy-drawer-skeleton] {
     margin-bottom: var(--fs-spacing-3);
   }
+
+  @include media('<=tablet') {
+    [data-fs-bp-basic-drawer-body],
+    [data-fs-bp-basic-drawer-heading],
+    [data-fs-bp-basic-drawer-footer] {
+      max-width: 430px;
+    }
+  }
 }

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

@@ -13,4 +13,4 @@ export const LOCAL_STORAGE_LOCATION_EDIT_KEY = "bp_hide_edit_location_confirm";
 export const LOCAL_STORAGE_RECIPIENT_EDIT_KEY =
   "bp_hide_edit_recipient_confirm";
 
-export const CURRENT_VERSION = "1.3.25";
+export const CURRENT_VERSION = "1.3.27";