@vtex/faststore-plugin-buyer-portal 1.3.77 → 1.3.78

package/CHANGELOG.md

@@ -7,6 +7,14 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+## [1.3.78] - 2026-04-23
+
+### Changed
+- Move addresses list requests from server to client side
+
+### Fixed
+- Remove `for` loop from `AddressesClient.getAddressesByUnitId` to prevent failed requests
+
 ## [1.3.77] - 2026-04-14
 
 ### Changed
@@ -573,7 +581,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.77...HEAD
+[unreleased]: https://github.com/vtex/faststore-plugin-buyer-portal/compare/v1.3.78...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
@@ -641,6 +649,7 @@ 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.78]: https://github.com/vtex/faststore-plugin-buyer-portal/compare/v1.3.77...v1.3.78
 [1.3.77]: https://github.com/vtex/faststore-plugin-buyer-portal/compare/v1.3.76...v1.3.77
 [1.3.76]: https://github.com/vtex/faststore-plugin-buyer-portal/compare/v1.3.75...v1.3.76
 [1.3.75]: https://github.com/vtex/faststore-plugin-buyer-portal/compare/v1.3.74...v1.3.75

package/package.json

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

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

@@ -32,32 +32,14 @@ export default class AddressesClient extends Client {
     addressType,
     page = 1,
   }: GetAddressesByUnitIdParams) {
-    let allAddresses: AddressData[] = [];
-    let total = 0;
-
-    for (let currentPage = 1; currentPage <= page; currentPage++) {
-      const params = new URLSearchParams();
-      if (name) params.append("name", name);
-      if (currentPage > 1) params.append("page", String(currentPage));
-      if (addressType) params.append("addressType", addressType);
-      const queryString = params.toString();
-      const url = queryString
-        ? `units/${orgUnitId}/addresses?${queryString}`
-        : `units/${orgUnitId}/addresses`;
-
-      const response = await this.get<AddressResponse>(url, {
-        headers: {
-          Cookie: cookie,
-        },
-      });
-
-      if (response?.addresses) {
-        allAddresses = allAddresses.concat(response.addresses);
-        total = response.total;
-      }
-    }
-
-    return { addresses: allAddresses, total };
+    return this.get<AddressResponse>(`units/${orgUnitId}/addresses`, {
+      headers: { Cookie: cookie },
+      params: {
+        page,
+        name: name ?? "",
+        addressType: addressType ?? "",
+      },
+    });
   }
 
   getAddressById(

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

@@ -8,3 +8,4 @@ export * from "./useAddressLocationDelete";
 export * from "./useSetDefaultAddress";
 export * from "./useUnsetDefaultAddress";
 export * from "./useGetDefaultAddresses";
+export * from "./useListAddresses";

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

@@ -1,7 +1,7 @@
 import { useDebounce } from "../../shared/hooks";
 import { DEBOUNCE_TIMEOUT } from "../../shared/utils/constants";
 
-import { useSearchAddressByUnitId } from "./useSearchAddressByUnitId";
+import { useListAddresses } from "./useListAddresses";
 
 import type { AddressData } from "../types";
 import type { UseDebouncedSearchAddressByUnitIdProps } from "../types/AddressData";
@@ -12,12 +12,11 @@ export const useDebouncedSearchAddressByUnitId = ({
   addressType,
 }: UseDebouncedSearchAddressByUnitIdProps) => {
   const debouncedSearchTerm = useDebounce(search, DEBOUNCE_TIMEOUT);
-  const { searchedAddresses, isSearchedAddressesLoading } =
-    useSearchAddressByUnitId({
-      orgUnitId,
-      search: debouncedSearchTerm,
-      addressType,
-    });
+  const { listAddressesData, listAddressesLoading } = useListAddresses({
+    orgUnitId,
+    search: debouncedSearchTerm,
+    addressType,
+  });
 
   if (search === "") {
     return {
@@ -27,7 +26,7 @@ export const useDebouncedSearchAddressByUnitId = ({
   }
 
   return {
-    searchedAddresses: searchedAddresses?.data ?? [],
-    isDebouncedSearchAddressesLoading: isSearchedAddressesLoading,
+    searchedAddresses: listAddressesData?.data ?? [],
+    isDebouncedSearchAddressesLoading: listAddressesLoading,
   };
 };

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

@@ -0,0 +1,36 @@
+import { type QueryOptions, useQuery } from "../../shared/hooks";
+import { getAddressesByUnitIdService } from "../services";
+
+type UseListAddressesProps = {
+  orgUnitId: string;
+  search: string;
+  page?: number;
+  addressType?: string;
+};
+
+export const useListAddresses = (
+  { orgUnitId, search, page = 1, addressType }: UseListAddressesProps,
+  options?: QueryOptions<AwaitedType<typeof getAddressesByUnitIdService>>
+) => {
+  const { data, error, isLoading, refetch } = useQuery(
+    `api/addresses/unitId=${orgUnitId}/page=${page}/search=${
+      search ?? ""
+    }/addressType=${addressType ?? ""}`,
+    ({ cookie }) =>
+      getAddressesByUnitIdService({
+        orgUnitId,
+        search,
+        cookie,
+        addressType,
+        page,
+      }),
+    options
+  );
+
+  return {
+    listAddressesData: data,
+    listAddressesError: error,
+    listAddressesLoading: isLoading,
+    listAddressesRefresh: refetch,
+  };
+};

package/src/features/addresses/layouts/AddressesLayout/AddressesLayout.tsx

@@ -3,85 +3,42 @@ import { useEffect } from "react";
 import { useRouter } from "next/router";
 
 import {
+  EmptyState,
   HeaderInside,
   IconBookmarked,
   InternalSearch,
   Paginator,
+  Table,
 } from "../../../shared/components";
-import { EmptyState } from "../../../shared/components/EmptyState/EmptyState";
-import { Table } from "../../../shared/components/Table/Table";
 import { getTableColumns } from "../../../shared/components/Table/utils/tableColumns";
 import {
   useBuyerPortal,
   useDrawerProps,
   useGetScopeConfig,
+  useUrlPaginatedSearch,
   SCOPE_KEYS,
 } from "../../../shared/hooks";
-import { usePageItems } from "../../../shared/hooks/usePageItems";
 import { ContractTabsLayout, GlobalLayout } from "../../../shared/layouts";
 import { buyerPortalRoutes } from "../../../shared/utils/buyerPortalRoutes";
 import { AddressDropdownMenu, CreateAddressDrawer } from "../../components";
 import { CreateAddressSettingsDrawer } from "../../components/CreateAddressSettingsDrawer/CreateAddressSettingsDrawer";
-import { useSearchAddressByUnitId } from "../../hooks/useSearchAddressByUnitId";
+import { useListAddresses } from "../../hooks/useListAddresses";
 
-import type { AddressData } from "../../types";
+const PAGE_SIZE = 25;
 
-export type AddressLayoutProps = {
-  addresses: AddressData[];
-  total: number;
-  search: string;
-  page: number;
-};
-
-export const AddressLayout = ({
-  addresses: initialAddresses,
-  search,
-  total,
-  page,
-}: AddressLayoutProps) => {
+export const AddressLayout = () => {
   const router = useRouter();
 
   const {
-    isLoading,
-    items: addresses,
-    searchTerm,
-    setSearchTerm,
-    increasePage,
-    updateItemsFromRefetch,
-    setIsLoading,
-  } = usePageItems<AddressData>({
-    initialItems: initialAddresses,
-    search,
     page,
-  });
-
-  const { searchedAddresses: addressesData, refetchSearchedAddresses } =
-    useSearchAddressByUnitId(
-      {
-        orgUnitId: router.query.orgUnitId as string,
-        search: search ?? "",
-      },
-      { lazy: true }
-    );
-
-  useEffect(() => {
-    if (addresses.length === 0) {
-      setIsLoading(true);
-      refetchSearchedAddresses();
-    }
-  }, []);
-
-  useEffect(() => {
-    if (addressesData?.data) {
-      updateItemsFromRefetch(addressesData.data);
-    }
-  }, [addressesData]);
-
-  const handleRefetchAddresses = () => {
-    setIsLoading(true);
-    refetchScopeConfig();
-    refetchSearchedAddresses();
-  };
+    search,
+    committedSearch,
+    isRouterSynced,
+    setSearch,
+    goToPage,
+    nextPage,
+    previousPage,
+  } = useUrlPaginatedSearch();
 
   const {
     open: openCreateDrawer,
@@ -109,6 +66,21 @@ export const AddressLayout = ({
     }
   );
 
+  const { listAddressesData, listAddressesLoading, listAddressesRefresh } =
+    useListAddresses(
+      {
+        orgUnitId: (router.query.orgUnitId as string) ?? "",
+        page: isRouterSynced ? page : 0,
+        search: committedSearch,
+      },
+      { lazy: !isRouterSynced }
+    );
+
+  const handleRefetchAddresses = () => {
+    refetchScopeConfig();
+    listAddressesRefresh();
+  };
+
   const columns = getTableColumns({
     nameColumnSize: "18.125rem",
     actionsLength: 2,
@@ -123,6 +95,23 @@ export const AddressLayout = ({
     ],
   });
 
+  const intervalData = {
+    page,
+    itemsLength: listAddressesData?.data.length ?? 0,
+    total: listAddressesData?.total ?? 0,
+    isLoading: listAddressesLoading,
+  };
+
+  const totalPages = Math.ceil(intervalData.total / PAGE_SIZE);
+
+  useEffect(() => {
+    if (listAddressesLoading || intervalData.total === 0) return;
+
+    if (page > totalPages) {
+      goToPage(Math.max(totalPages, 1));
+    }
+  }, [page, totalPages, intervalData.total, listAddressesLoading]);
+
   return (
     <GlobalLayout>
       <ContractTabsLayout
@@ -142,103 +131,96 @@ export const AddressLayout = ({
             <HeaderInside.Button onClick={openCreateDrawer} />
           </HeaderInside>
 
-          {addresses.length === 0 && !isLoading && searchTerm.length === 0 ? (
-            <EmptyState title="No addresses yet" iconName="LocalPostOffice" />
+          <div data-fs-buyer-portal-address-filter>
+            <InternalSearch defaultValue={search} textSearch={setSearch} />
+            <Paginator.Interval {...intervalData} />
+          </div>
+
+          {!listAddressesLoading && intervalData.total === 0 ? (
+            <EmptyState
+              title={
+                committedSearch.length > 0
+                  ? "No results found"
+                  : "No addresses yet"
+              }
+              description={
+                committedSearch.length > 0
+                  ? "Try using different terms or filters"
+                  : undefined
+              }
+              iconName={
+                committedSearch.length > 0 ? undefined : "LocalPostOffice"
+              }
+            />
           ) : (
-            <>
-              <div data-fs-buyer-portal-address-filter>
-                <InternalSearch
-                  defaultValue={searchTerm}
-                  textSearch={setSearchTerm}
-                />
-                <div data-fs-bp-top-counter>
-                  <Paginator.Counter
-                    total={total}
-                    itemsLength={addresses.length}
-                  />
-                </div>
-              </div>
-              {!isLoading && addresses.length === 0 && searchTerm.length > 0 ? (
-                <EmptyState
-                  title="No results found"
-                  description="Try using different terms or filters"
-                />
-              ) : (
-                <div data-fs-addresses-table>
-                  <Table layoutFixed>
-                    <Table.Head columns={columns} />
-
-                    <Table.Body>
-                      {isLoading ? (
-                        <Table.Loading columns={columns.length} />
-                      ) : (
-                        addresses.map(({ id, ...address }) => (
-                          <Table.Row
-                            key={id}
-                            title={address.name}
-                            searchTerm={search}
-                            iconName="LocalPostOffice"
-                            iconSize={20}
-                            children={
-                              <Table.Cell hideOnScreenSize="phonemid">
-                                {Array.isArray(address.types) &&
-                                address.types.length > 0 ? (
-                                  <span>{address.types.join(", ")}</span>
-                                ) : null}
-                              </Table.Cell>
-                            }
-                            href={buyerPortalRoutes.addressDetails({
-                              orgUnitId: orgUnit?.id ?? "",
-                              contractId: contract?.id ?? "",
-                              addressId: id,
-                            })}
-                            actionIcons={
-                              address.isDefault ? <IconBookmarked /> : null
-                            }
-                            dropdownMenu={
-                              <AddressDropdownMenu
-                                currentAddress={{
-                                  id,
-                                  ...address,
-                                }}
-                                isSyncMode={isSyncMode}
-                                onUpdate={handleRefetchAddresses}
-                                onOpen={() => {
-                                  const url = buyerPortalRoutes.addressDetails({
-                                    orgUnitId: orgUnit?.id ?? "",
-                                    contractId: contract?.id ?? "",
-                                    addressId: id,
-                                  });
-
-                                  router.push(url);
-                                }}
-                              />
-                            }
+            <div data-fs-addresses-table>
+              <Table layoutFixed>
+                <Table.Head columns={columns} />
+                <Table.Body>
+                  {listAddressesLoading ? (
+                    <Table.Loading columns={columns.length} />
+                  ) : (
+                    listAddressesData?.data.map(({ id, ...address }) => (
+                      <Table.Row
+                        key={id}
+                        title={address.name}
+                        searchTerm={committedSearch}
+                        iconName="LocalPostOffice"
+                        iconSize={20}
+                        href={buyerPortalRoutes.addressDetails({
+                          orgUnitId: orgUnit?.id ?? "",
+                          contractId: contract?.id ?? "",
+                          addressId: id,
+                        })}
+                        actionIcons={
+                          address.isDefault ? <IconBookmarked /> : null
+                        }
+                        dropdownMenu={
+                          <AddressDropdownMenu
+                            currentAddress={{ id, ...address }}
+                            isSyncMode={isSyncMode}
+                            onUpdate={handleRefetchAddresses}
+                            onOpen={() => {
+                              const url = buyerPortalRoutes.addressDetails({
+                                orgUnitId: orgUnit?.id ?? "",
+                                contractId: contract?.id ?? "",
+                                addressId: id,
+                              });
+
+                              router.push(url);
+                            }}
                           />
-                        ))
-                      )}
-                    </Table.Body>
-                  </Table>
-
-                  {!isLoading && (
-                    <p
-                      data-fs-bp-addresses-paginator-last
-                    >{`${addresses.length} of ${total}`}</p>
-                  )}
-
-                  <div data-fs-bp-addresses-paginator>
-                    {total > addresses.length && (
-                      <Paginator.NextPageButton
-                        onClick={increasePage}
-                        disabled={isLoading}
+                        }
                       >
-                        {isLoading ? "Loading" : "Load More"}
-                      </Paginator.NextPageButton>
-                    )}
-                  </div>
-                </div>
-              )}
-            </>
+                        <Table.Cell hideOnScreenSize="phonemid">
+                          {Array.isArray(address.types) &&
+                          address.types.length > 0 ? (
+                            <span>{address.types.join(", ")}</span>
+                          ) : null}
+                        </Table.Cell>
+                      </Table.Row>
+                    ))
+                  )}
+                </Table.Body>
+              </Table>
+
+              <div data-fs-bp-addresses-paginator>
+                <Paginator.NextPageButton
+                  onClick={previousPage}
+                  disabled={page <= 1}
+                >
+                  Previous Page
+                </Paginator.NextPageButton>
+                <Paginator.NextPageButton
+                  data-fs-bp-addresses-next-page
+                  onClick={nextPage}
+                  disabled={page >= totalPages}
+                >
+                  Next Page
+                </Paginator.NextPageButton>
+                <Paginator.Interval {...intervalData} />
+              </div>
+            </div>
           )}
 
           {isCreateAddressDrawerOpen && (

package/src/features/addresses/layouts/AddressesLayout/addresses-layout.scss

@@ -146,8 +146,23 @@
 		display: flex;
 		align-items: center;
 		justify-content: flex-start;
-		margin-top: var(--fs-spacing-2);
-		padding: var(--fs-spacing-2) 0;
+		margin-top: var(--fs-bp-margin-3);
+		padding: var(--fs-bp-padding-3) 0;
+		gap: var(--fs-bp-gap-4);
+
+		[data-fs-bp-paginator-counter] {
+			margin-left: var(--fs-bp-margin-auto)
+		}
+
+		[data-fs-paginator-next-page-button]:disabled {			
+      cursor: not-allowed;
+      color: var(--fs-bp-color-neutral-6);
+      
+      &:hover {
+        color: var(--fs-bp-color-neutral-6);
+        background-color: transparent;
+      }
+		}
 
 		@include media("<=phonemid") {
 			padding: var(--fs-spacing-3) 0;

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

@@ -2,7 +2,4 @@ export {
   AddressDetailsLayout,
   type AddressDetailsLayoutProps,
 } from "./AddressDetailsLayout/AddressDetailsLayout";
-export {
-  AddressLayout,
-  type AddressLayoutProps,
-} from "./AddressesLayout/AddressesLayout";
+export { AddressLayout } from "./AddressesLayout/AddressesLayout";

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

@@ -18,3 +18,4 @@ export { useAnalytics } from "./analytics/useAnalytics";
 export { ANALYTICS_FALLBACK_CORRELATION_ID } from "./analytics/constants";
 export { useGetScopeConfig, SCOPE_KEYS } from "./useGetScopeConfig";
 export { useSetScopeConfig } from "./useSetScopeConfig";
+export { useUrlPaginatedSearch } from "./useUrlPaginatedSearch";

package/src/features/shared/hooks/useUrlPaginatedSearch.ts

@@ -0,0 +1,79 @@
+import { useEffect, useState } from "react";
+
+import { useRouter } from "next/router";
+
+import { getValidPage } from "../utils";
+
+import { useDebounce } from "./useDebounce";
+import { useQueryParams } from "./useQueryParams";
+
+type UseUrlPaginatedSearchOptions = {
+  pageParam?: string;
+  searchParam?: string;
+  debounceMs?: number;
+};
+
+export function useUrlPaginatedSearch(options?: UseUrlPaginatedSearchOptions) {
+  const {
+    pageParam = "page",
+    searchParam = "search",
+    debounceMs = 300,
+  } = options ?? {};
+
+  const router = useRouter();
+  const { setQueryStrings } = useQueryParams();
+
+  const [page, setPageState] = useState(1);
+  const [search, setSearch] = useState("");
+  const [committedSearch, setCommittedSearch] = useState("");
+  const [isRouterSynced, setIsRouterSynced] = useState(false);
+
+  useEffect(() => {
+    if (!router.isReady) return;
+
+    const urlPage = getValidPage(router.query[pageParam]);
+    const urlSearch = (router.query[searchParam] ?? "").toString();
+
+    setPageState(urlPage);
+    setSearch(urlSearch);
+    setCommittedSearch(urlSearch);
+    setIsRouterSynced(true);
+  }, [router.isReady, router.query[pageParam], router.query[searchParam]]);
+
+  useDebounce(search, debounceMs, {
+    onDebounce: (value) => {
+      setCommittedSearch((prev) => {
+        if (value === prev) return prev;
+
+        setPageState(1);
+        setQueryStrings({
+          [pageParam]: "1",
+          [searchParam]: value || null,
+        });
+
+        return value;
+      });
+    },
+  });
+
+  const goToPage = (newPage: number) => {
+    setPageState(() => {
+      setQueryStrings({ [pageParam]: `${newPage}` });
+      return newPage;
+    });
+  };
+
+  const nextPage = () => goToPage(page + 1);
+  const previousPage = () => goToPage(page - 1);
+
+  return {
+    page,
+    search,
+    committedSearch,
+    isRouterSynced,
+    setSearch,
+    goToPage,
+    nextPage,
+    previousPage,
+  };
+}

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

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

package/src/pages/addresses.tsx

@@ -1,8 +1,4 @@
 import { AddressLayout } from "../features/addresses/layouts";
-import {
-  getAddressesByUnitIdService,
-  type GetAddressesServiceProps,
-} from "../features/addresses/services";
 import { getContractDetailsService } from "../features/contracts/services";
 import { getOrgUnitBasicDataService } from "../features/org-units/services";
 import { withErrorBoundary } from "../features/shared/components";
@@ -10,24 +6,18 @@ import { ErrorBoundaryProps } from "../features/shared/components/ErrorBoundary/
 import { ErrorTabsLayout } from "../features/shared/layouts/ErrorTabsLayout/ErrorTabsLayout";
 import {
   type ClientContext,
-  getValidPage,
   withLoaderErrorBoundary,
   withAuthLoader,
   withProviders,
 } from "../features/shared/utils";
 import { getUserByIdService } from "../features/users/services";
 
-import type { AddressData } from "../features/addresses/types";
 import type { ContractData } from "../features/contracts/types";
 import type { OrgUnitBasicData } from "../features/org-units/types";
 import type { AuthRouteProps, LoaderData } from "../features/shared/types";
 import type { UserData } from "../features/users/types";
 
 export type AddressesPageData = {
-  data: AddressData[];
-  search: string;
-  total: number;
-  page: number;
   context: {
     currentContract: ContractData | null;
     clientContext: ClientContext;
@@ -38,28 +28,21 @@ export type AddressesPageData = {
   error?: ErrorBoundaryProps;
 };
 
-export type AddressesPageQuery = GetAddressesServiceProps & {
+export type AddressesPageQuery = {
   orgUnitId: string;
   contractId: string;
-  page?: string;
 };
 
 const loaderFunction = async (
   data: LoaderData<AddressesPageQuery>
 ): Promise<AuthRouteProps<AddressesPageData>> => {
-  const { contractId, orgUnitId, search, page: pageString } = data.query;
-
-  const page = getValidPage(pageString);
+  const { contractId, orgUnitId } = data.query;
 
   return withAuthLoader(
     data,
     async ({ cookie, userId, customerId, ...clientContext }) => {
       if (!contractId || !orgUnitId) {
         return {
-          data: [],
-          search: search ?? "",
-          total: 0,
-          page: page ?? 1,
           context: {
             clientContext: { customerId, cookie, userId, ...clientContext },
             currentOrgUnit: null,
@@ -69,31 +52,20 @@ const loaderFunction = async (
         };
       }
 
-      const [currentOrgUnit, user, contract, addressesResponse] =
-        await Promise.all([
-          getOrgUnitBasicDataService({
-            id: orgUnitId,
-            cookie,
-          }),
-          getUserByIdService({ orgUnitId, userId, cookie }),
-          getContractDetailsService({
-            contractId,
-            cookie,
-            unitId: orgUnitId,
-          }),
-          getAddressesByUnitIdService({
-            orgUnitId,
-            search,
-            page,
-            cookie,
-          }),
-        ]);
+      const [currentOrgUnit, user, contract] = await Promise.all([
+        getOrgUnitBasicDataService({
+          id: orgUnitId,
+          cookie,
+        }),
+        getUserByIdService({ orgUnitId, userId, cookie }),
+        getContractDetailsService({
+          contractId,
+          cookie,
+          unitId: orgUnitId,
+        }),
+      ]);
 
       return {
-        data: addressesResponse.data,
-        total: addressesResponse.total,
-        page,
-        search: search ?? "",
         context: {
           clientContext: { cookie, userId, customerId, ...clientContext },
           currentOrgUnit,
@@ -110,26 +82,8 @@ export const loader = withLoaderErrorBoundary(loaderFunction, {
   redirectToError: true,
 });
 
-const AddressPage = ({
-  data,
-  search,
-  page,
-  total,
-  hasError,
-  error,
-}: AddressesPageData) => (
-  <>
-    {hasError ? (
-      <ErrorTabsLayout error={error} />
-    ) : (
-      <AddressLayout
-        addresses={data}
-        search={search}
-        page={page}
-        total={total}
-      />
-    )}
-  </>
+const AddressPage = ({ hasError, error }: AddressesPageData) => (
+  <>{hasError ? <ErrorTabsLayout error={error} /> : <AddressLayout />}</>
 );
 
 export default withProviders(

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

@@ -1,27 +0,0 @@
-import { type QueryOptions, useQuery } from "../../shared/hooks";
-import { getAddressesByUnitIdService } from "../services";
-
-import type { UseDebouncedSearchAddressByUnitIdProps } from "../types/AddressData";
-
-export const useSearchAddressByUnitId = (
-  { orgUnitId, search, addressType }: UseDebouncedSearchAddressByUnitIdProps,
-  options?: QueryOptions<AwaitedType<typeof getAddressesByUnitIdService>>
-) => {
-  const { data, error, isLoading, refetch } = useQuery(
-    `api/search/addresses/${search}`,
-    ({ cookie }) =>
-      getAddressesByUnitIdService({
-        orgUnitId,
-        search,
-        cookie,
-        addressType,
-      }),
-    options
-  );
-  return {
-    searchedAddresses: data,
-    hasSearchedAddressesError: error,
-    isSearchedAddressesLoading: isLoading,
-    refetchSearchedAddresses: refetch,
-  };
-};