@vtex/faststore-plugin-buyer-portal 1.0.27 → 1.0.28

package/package.json

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

package/src/apis/new-route.ts

@@ -1,4 +1,4 @@
-import { NextApiRequest, NextApiResponse } from "next/types";
+import type { NextApiRequest, NextApiResponse } from "next/types";
 
 // TODO: Remove when Plugin API feature be merged
 export default function handle(req: NextApiRequest, res: NextApiResponse) {

package/src/clients/BuyerPortalClient.ts

@@ -1,11 +1,11 @@
-import type { AddressData } from "../types/AddressData";
-import type { ContractData } from "../types/ContractData";
-import type { OrgUnitData } from "../types/OrgUnitsData";
+import type { AddressData } from "../features/addresses/types";
+import type { ContractData } from "../features/contracts/types";
 import type {
   OrgUnitBasicData,
   OrgUnitSummaryData,
-} from "../types/OrgUnitSummaryData";
-import { getApiUrl } from "../utils/api";
+  OrgUnitData,
+} from "../features/org-units/types";
+import { getApiUrl } from "../features/shared/utils";
 import Client from "./Client";
 
 class BuyerPortalClient extends Client {

package/src/clients/Client.ts

@@ -1,4 +1,4 @@
-import { toQueryParams } from "../utils/toQueryParams";
+import { toQueryParams } from "../features/shared/utils";
 
 interface RequestConfig<T> {
   url: string;

package/src/components/overrides/Navbar.tsx

@@ -1,6 +1,6 @@
-import { SectionOverride } from "@faststore/core";
+import type { SectionOverride } from "@faststore/core";
 import { useSession_unstable as useSession } from "@faststore/core/experimental";
-import { SelfManagementSignInButton } from "../SelfManagementSignInButton";
+import { SelfManagementSignInButton } from "../../features/shared/components";
 
 const SECTION: SectionOverride["section"] = "Navbar";
 

package/src/{components → features/addresses/components}/AddressLine/AddressLine.tsx

@@ -1,7 +1,6 @@
 import { Toggle } from "@faststore/ui";
 import Link from "next/link";
-import { Tag } from "../Tag/Tag";
-import { Icon } from "../Icon";
+import { Icon, Tag } from "../../../shared/components";
 
 export type AddressLineProps = {
   id: string;
@@ -31,12 +30,12 @@ export const AddressLine = ({
       </span>
 
       {types.map((type, index) => (
-        <Tag key={index}>{type}</Tag>
+        <Tag key={type}>{type}</Tag>
       ))}
     </Link>
 
     <Toggle id={id} defaultChecked={isActive} />
-    <button data-fs-addresses-dropdown-trigger>
+    <button type="button" data-fs-addresses-dropdown-trigger>
       <Icon
         name="MoreVert"
         width={20}

package/src/{components → features/addresses/components}/AddressesCard/AddressesCard.tsx

@@ -5,10 +5,8 @@ import {
   DropdownMenu,
   DropdownButton,
 } from "@faststore/ui";
-import { Tag } from "../Tag/Tag";
-import type { AddressData } from "../../types/AddressData";
-import { Icon } from "../Icon";
-import { BasicCard } from "../BasicCard/BasicCard";
+import type { AddressData } from "../../types";
+import { BasicCard, Icon, Tag } from "../../../shared/components";
 
 type AddressesCardProps = {
   addresses?: AddressData[];

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

@@ -0,0 +1,2 @@
+export { AddressLine, type AddressLineProps } from "./AddressLine/AddressLine";
+export { default as AddressesCard } from "./AddressesCard/AddressesCard";

package/src/{layouts → features/addresses/layouts}/AddressDetailsLayout/AddressDetailsLayout.tsx

@@ -1,16 +1,19 @@
 import { DropdownItem, DropdownMenu, Toggle } from "@faststore/ui";
-import { useState } from "react";
-import { InternalTopBar } from "../../components/InternalTopbar/InternalTopbar";
-import type { AddressData } from "../../types/AddressData";
-import { addressLabelToPropMapping } from "../../utils/addresLabelToPropMapping";
-import { GlobalLayout } from "../GlobalLayout/GlobalLayout";
-import { Icon } from "../../components/Icon";
+import { useId, useState } from "react";
+import { Icon, InternalTopBar } from "../../../shared/components";
+import { GlobalLayout } from "../../../shared/layouts";
+import { addressLabelToPropMapping } from "../../../shared/utils";
+import type { AddressData } from "../../types";
 
-export type AddressDetailsLayoutProps = { data: AddressData };
+export type AddressDetailsLayoutProps = { data: AddressData | null };
 
-export const AddressDetailsLayout = ({
-  data: { id, isActive, ...addressData },
-}: AddressDetailsLayoutProps) => {
+export const AddressDetailsLayout = ({ data }: AddressDetailsLayoutProps) => {
+  // TODO: Implement the AddressDetailsLayout Fallback component
+  if (!data) {
+    return null;
+  }
+
+  const { id, isActive, ...addressData } = data;
   const [checked, setChecked] = useState(isActive);
 
   const props = Object.keys(addressLabelToPropMapping) as Array<
@@ -104,19 +107,25 @@ export const AddressDetailsLayout = ({
           </div>
 
           <div data-fs-address-details-locations>
-            {addressData.locations.map((location) => (
-              <div key={location} data-fs-address-details-location>
-                <span data-fs-address-details-location-name>{location}</span>
-                <span data-fs-address-details-location-actions>
-                  <button type="button" data-fs-address-details-location-delete>
-                    <Icon name="Delete" width={24} height={24} />
-                  </button>
-                  <button type="button" data-fs-address-details-location-more>
-                    <Icon name="MoreVert" width={24} height={24} />
-                  </button>
-                </span>
-              </div>
-            ))}
+            {addressData.locations.map((location) => {
+              const id = useId();
+              return (
+                <div key={`${location}-${id}`} data-fs-address-details-location>
+                  <span data-fs-address-details-location-name>{location}</span>
+                  <span data-fs-address-details-location-actions>
+                    <button
+                      type="button"
+                      data-fs-address-details-location-delete
+                    >
+                      <Icon name="Delete" width={24} height={24} />
+                    </button>
+                    <button type="button" data-fs-address-details-location-more>
+                      <Icon name="MoreVert" width={24} height={24} />
+                    </button>
+                  </span>
+                </div>
+              );
+            })}
           </div>
         </div>
       </section>

package/src/{layouts → features/addresses/layouts}/AddressDetailsLayout/address-details-layout.scss

@@ -1,6 +1,6 @@
 [data-fs-address-details-section] {
   @import "@faststore/ui/src/components/molecules/Toggle/styles.scss";
-  @import "../../components/InternalTopbar/internal-top-bar.scss";
+  @import "../../../shared/components/InternalTopbar/internal-top-bar.scss";
 
   width: 100%;
 

package/src/{layouts → features/addresses/layouts}/AddressesLayout/AddressesLayout.tsx

@@ -1,16 +1,16 @@
-import { AddressLine } from "../../components/AddressLine/AddressLine";
-import DropdownFilter from "../../components/DropdownFilter/DropdownFilter";
-import InternalSearch from "../../components/InternalSearch/InternalSearch";
-import { InternalTopBar } from "../../components/InternalTopbar/InternalTopbar";
-import SortFilter from "../../components/SortFilter/SortFilter";
-import { statusFilters } from "../../utils/search";
-
-import type { AddressSummaryData } from "../../types/AddressData";
-import { GlobalLayout } from "../GlobalLayout/GlobalLayout";
-import { Icon } from "../../components/Icon";
-import { useQueryParams } from "../../hooks/useQueryParams";
-import { DropdownItem, DropdownMenu } from "@faststore/ui";
-import { MainLinksDropdownMenu } from "../../components/MainLinksDropdownMenu/MainLinksDropdownMenu";
+import {
+  InternalTopBar,
+  MainLinksDropdownMenu,
+  InternalSearch,
+  DropdownFilter,
+  SortFilter,
+  Icon,
+} from "../../../shared/components";
+import { useQueryParams } from "../../../shared/hooks";
+import { GlobalLayout } from "../../../shared/layouts";
+import { statusFilters } from "../../../shared/utils";
+import { AddressLine } from "../../components";
+import type { AddressSummaryData } from "../../types";
 
 export type AddressLayoutProps = {
   data: AddressSummaryData[];

package/src/{layouts → features/addresses/layouts}/AddressesLayout/addresses-layout.scss

@@ -1,14 +1,15 @@
-@import "../../components/MainLinksDropdownMenu/main-links-dropdown-menu.scss";
+@import "../../../shared/components/MainLinksDropdownMenu/main-links-dropdown-menu.scss";
 
 [data-fs-addresses-section] {
   @import "@faststore/ui/src/components/molecules/Toggle/styles.scss";
 
   @import "../../components/AddressLine/address-line.scss";
-  @import "../../components/InternalSearch/internal-search.scss";
-  @import "../../components/DropdownFilter/dropdown-filter.scss";
-  @import "../../components/Tag/tag.scss";
-  @import "../../components/SortFilter/sort-filter.scss";
-  @import "../../components/InternalTopbar/internal-top-bar.scss";
+
+  @import "../../../shared/components/InternalSearch/internal-search.scss";
+  @import "../../../shared/components/DropdownFilter/dropdown-filter.scss";
+  @import "../../../shared/components/Tag/tag.scss";
+  @import "../../../shared/components/SortFilter/sort-filter.scss";
+  @import "../../../shared/components/InternalTopbar/internal-top-bar.scss";
 
   [data-fs-topbar-actions-wrapper] {
     display: flex;

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

@@ -0,0 +1,8 @@
+export {
+  AddressDetailsLayout,
+  type AddressDetailsLayoutProps,
+} from "./AddressDetailsLayout/AddressDetailsLayout";
+export {
+  AddressLayout,
+  type AddressLayoutProps,
+} from "./AddressesLayout/AddressesLayout";

package/src/{mock → features/addresses/mocks}/addresses-data.ts

@@ -1,4 +1,4 @@
-import { AddressData } from "../types/AddressData";
+import type { AddressData } from "../types";
 
 export const addressesData: AddressData[] = [
   {

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

@@ -0,0 +1 @@
+export { addressesData } from "./addresses-data";

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

@@ -0,0 +1,11 @@
+import { addressesData } from "../mocks";
+import type { AddressData } from "../types/AddressData";
+
+export const getAddressDetailsService = async (
+  id: string
+): Promise<AddressData | null> => {
+  // TODO: Need to create get of single address on api
+  const addressData =
+    addressesData.find((address) => String(address.id) === id) ?? null;
+  return addressData;
+};

package/src/{services → features/addresses/services}/get-addresses.service.ts

@@ -1,7 +1,6 @@
 import type { AddressSummaryData } from "../types/AddressData";
-import { statusFilters } from "../utils/search";
-import { buyerPortalClient } from "../clients/BuyerPortalClient";
-import { compareItems } from "../utils/compareItems";
+import { buyerPortalClient } from "../../../clients/BuyerPortalClient";
+import { compareItems, statusFilters } from "../../shared/utils";
 
 export type GetAddressesServiceProps = Partial<{
   search: string;

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

@@ -0,0 +1,5 @@
+export { getAddressDetailsService } from "./get-address-details.service";
+export {
+  getAddressesService,
+  type GetAddressesServiceProps,
+} from "./get-addresses.service";

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

@@ -0,0 +1 @@
+export { AddressData, AddressSummaryData } from "./AddressData";

package/src/{components → features/contracts/components}/ContractsCard/ContractsCard.tsx

@@ -6,9 +6,8 @@ import {
   DropdownMenu,
   DropdownButton,
 } from "@faststore/ui";
-import { Icon } from "../Icon";
-import { BasicCard } from "../BasicCard/BasicCard";
-import type { ContractData } from "../../types/ContractData";
+import type { ContractData } from "../../types";
+import { BasicCard, Icon } from "../../../shared/components";
 
 type ContractsCardProps = {
   orgUnitData?: {

package/src/features/contracts/components/index.ts

@@ -0,0 +1 @@
+export { default as ContractsCard } from "./ContractsCard/ContractsCard";

package/src/{layouts → features/contracts/layouts}/ContractsLayout/ContractsLayout.tsx

@@ -1,15 +1,17 @@
-import { DropdownMenu, DropdownItem, Toggle } from "@faststore/ui";
-import DropdownFilter from "../../components/DropdownFilter/DropdownFilter";
-import InternalSearch from "../../components/InternalSearch/InternalSearch";
-import { InternalTopBar } from "../../components/InternalTopbar/InternalTopbar";
-import SortFilter from "../../components/SortFilter/SortFilter";
-import { statusFilters } from "../../utils/search";
+import { Toggle } from "@faststore/ui";
 
 import type { ContractData } from "../../types/ContractData";
-import { GlobalLayout } from "../GlobalLayout/GlobalLayout";
-import { Icon } from "../../components/Icon";
-import { useQueryParams } from "../../hooks/useQueryParams";
-import { MainLinksDropdownMenu } from "../../components/MainLinksDropdownMenu/MainLinksDropdownMenu";
+import {
+  InternalTopBar,
+  MainLinksDropdownMenu,
+  InternalSearch,
+  DropdownFilter,
+  SortFilter,
+  Icon,
+} from "../../../shared/components";
+import { useQueryParams } from "../../../shared/hooks";
+import { GlobalLayout } from "../../../shared/layouts";
+import { statusFilters } from "../../../shared/utils";
 
 export type ContractsLayoutProps = {
   data: ContractData[];

package/src/{layouts → features/contracts/layouts}/ContractsLayout/contracts-layout.scss

@@ -1,11 +1,11 @@
 [data-fs-contracts-section] {
   @import "@faststore/ui/src/components/molecules/Toggle/styles.scss";
 
-  @import "../../components/InternalSearch/internal-search.scss";
-  @import "../../components/DropdownFilter/dropdown-filter.scss";
-  @import "../../components/Tag/tag.scss";
-  @import "../../components/SortFilter/sort-filter.scss";
-  @import "../../components/InternalTopbar/internal-top-bar.scss";
+  @import "../../../shared/components/InternalSearch/internal-search.scss";
+  @import "../../../shared/components/DropdownFilter/dropdown-filter.scss";
+  @import "../../../shared/components/Tag/tag.scss";
+  @import "../../../shared/components/SortFilter/sort-filter.scss";
+  @import "../../../shared/components/InternalTopbar/internal-top-bar.scss";
 
   [data-fs-contracts-page] {
     padding: 0 calc(var(--fs-spacing-8) + var(--fs-spacing-0));

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

@@ -0,0 +1,4 @@
+export {
+  ContractsLayout,
+  type ContractsLayoutProps,
+} from "./ContractsLayout/ContractsLayout";

package/src/{mock → features/contracts/mocks}/contracts-data.ts

@@ -1,4 +1,4 @@
-import { ContractData } from "../types/ContractData";
+import type { ContractData } from "../types";
 
 export const contractsData: ContractData[] = [
   // Uncomment to test with a single contract

package/src/features/contracts/mocks/index.ts

@@ -0,0 +1 @@
+export { contractsData } from "./contracts-data";

package/src/{services → features/contracts/services}/get-contracts.service.ts

@@ -1,7 +1,6 @@
-import { ContractData } from "../types/ContractData";
-import { statusFilters } from "../utils/search";
-import { buyerPortalClient } from "../clients/BuyerPortalClient";
-import { compareItems } from "../utils/compareItems";
+import { buyerPortalClient } from "../../../clients/BuyerPortalClient";
+import { compareItems, statusFilters } from "../../shared/utils";
+import type { ContractData } from "../types";
 
 export type GetContractsServiceProps = {
   search?: string;

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

@@ -0,0 +1,4 @@
+export {
+  getContractsService,
+  type GetContractsServiceProps,
+} from "./get-contracts.service";

package/src/{types → features/contracts/types}/ContractData.ts

@@ -6,5 +6,5 @@ export type ContractData = {
   creationDate: string;
   salesRepresentative?: string;
   imageUrl?: string;
-  assortment?: any[];
+  assortment?: unknown[];
 };

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

@@ -0,0 +1 @@
+export type { ContractData } from "./ContractData";

package/src/{components → features/org-units/components}/CreateOrgUnitDrawer/CreateOrgUnitDrawer.tsx

@@ -1,12 +1,16 @@
 import { useState } from "react";
-import { AutocompleteDropdown } from "../AutocompleteDropdown/AutocompleteDropdown";
-import { BasicDrawer, BasicDrawerProps } from "../BasicDrawer/BasicDrawer";
-import { InputText } from "../InputText/InputText";
-import { Icon } from "../Icon";
-import { ErrorMessage } from "../ErrorMessage/ErrorMessage";
-import { useCreateNewOrgUnit } from "../../hooks/useCreateNewOrgUnit";
+
 import { useUI } from "@faststore/ui";
 import { useRouter } from "next/router";
+import {
+  type BasicDrawerProps,
+  BasicDrawer,
+  AutocompleteDropdown,
+  ErrorMessage,
+  InputText,
+  Icon,
+} from "../../../shared/components";
+import { useCreateNewOrgUnit } from "../../hooks";
 
 export type CreateOrgUnitDrawerProps = Omit<BasicDrawerProps, "children"> & {
   options?: { id: string; name: string }[];

package/src/features/org-units/components/CreateOrgUnitDrawer/create-org-unit-drawer.scss

@@ -0,0 +1,6 @@
+@import "../../../shared/components/BasicDrawer/basic-drawer.scss";
+
+[data-fs-bp-create-org-unit-drawer] {
+  @import "../../../shared/components/InputText/input-text.scss";
+  @import "../../../shared/components/ErrorMessage/error-message.scss";
+}

package/src/{components → features/org-units/components}/DeleteOrgUnitDrawer/DeleteOrgUnitDrawer.tsx

@@ -1,13 +1,18 @@
 import { useUI } from "@faststore/ui";
-import { useChildrenOrgUnits } from "../../hooks/useChildrenOrgUnits";
-import { useDeleteOrgUnit } from "../../hooks/useDeleteOrgUnit";
-import { useUsersByOrgUnit } from "../../hooks/useUsersByOrgUnit";
-import { BasicDrawer, BasicDrawerProps } from "../BasicDrawer/BasicDrawer";
-import { Icon } from "../Icon";
-import { OrgUnitsHierarchyTree } from "../OrgUnitsHierarchyTree/OrgUnitsHierarchyTree";
-import { Tab } from "../Tab/Tab";
+
 import { useRouter } from "next/router";
 
+import { useDeleteOrgUnit } from "../../hooks/useDeleteOrgUnit";
+import { OrgUnitsHierarchyTree } from "..";
+import { useChildrenOrgUnits } from "../../hooks";
+import { useUsersByOrgUnit } from "../../../users/hooks";
+import {
+  BasicDrawer,
+  Icon,
+  Tab,
+  type BasicDrawerProps,
+} from "../../../shared/components";
+
 export type DeleteOrgUnitDrawerProps = Omit<BasicDrawerProps, "children"> & {
   id: string;
   name: string;
@@ -116,7 +121,7 @@ export const DeleteOrgUnitDrawer = ({
                       {user.name}
                     </span>
                     <span data-fs-bp-delete-org-unit-drawer-user-org>
-                      {user.orgUnit}
+                      {user.orgUnit.name}
                     </span>
                     <span data-fs-bp-delete-org-unit-drawer-user-type>
                       {user.userType}

package/src/{components → features/org-units/components}/DeleteOrgUnitDrawer/delete-org-unit-drawer.scss

@@ -1,7 +1,7 @@
-@import "../BasicDrawer/basic-drawer.scss";
+@import "../../../shared/components/BasicDrawer/basic-drawer.scss";
 
 [data-fs-bp-basic-drawer][data-fs-bp-delete-org-unit-drawer] {
-  @import "../Tab/tab.scss";
+  @import "../../../shared/components/Tab/tab.scss";
   @import "../OrgUnitsHierarchyTree/org-units-hierarchy-tree.scss";
 
   &[data-fs-bp-delete-org-unit-drawer-has-content="true"] {

package/src/{components → features/org-units/components}/OrgUnitsDropdownMenu/OrgUnitsDropdownMenu.tsx

@@ -1,11 +1,13 @@
 import { DropdownItem, Toggle } from "@faststore/ui";
-import { CreateOrgUnitDrawer } from "../CreateOrgUnitDrawer/CreateOrgUnitDrawer";
-import { useDrawerProps } from "../../hooks/useDrawerProps";
-import { Icon } from "../Icon";
-import { DeleteOrgUnitDrawer } from "../DeleteOrgUnitDrawer/DeleteOrgUnitDrawer";
-import { UpdateOrgUnitDrawer } from "../UpdateOrgUnitDrawer/UpdateOrgUnitDrawer";
 import { useRouter } from "next/router";
-import { BasicDropdownMenu } from "../BasicDropdownMenu/BasicDropdownMenu";
+
+import {
+  CreateOrgUnitDrawer,
+  DeleteOrgUnitDrawer,
+  UpdateOrgUnitDrawer,
+} from "..";
+import { useDrawerProps } from "../../../shared/hooks";
+import { BasicDropdownMenu, Icon } from "../../../shared/components";
 
 export type OrgUnitsDropdownMenuProps = {
   id: string;

package/src/{components → features/org-units/components}/OrgUnitsDropdownMenu/org-units-dropdown-menu.scss

@@ -1,4 +1,4 @@
-@import "../BasicDropdownMenu/basic-dropdown-menu.scss";
+@import "../../../shared/components/BasicDropdownMenu/basic-dropdown-menu.scss";
 @import "../UpdateOrgUnitDrawer/update-org-unit-drawer.scss";
 @import "../CreateOrgUnitDrawer/create-org-unit-drawer.scss";
 @import "../DeleteOrgUnitDrawer/delete-org-unit-drawer.scss";

package/src/{components → features/org-units/components}/OrgUnitsHierarchyTree/OrgUnitsHierarchyTree.tsx

@@ -1,11 +1,9 @@
-import { Dropdown, DropdownButton, Toggle } from "@faststore/ui";
-import { HierarchyTree } from "../HierarchyTree/HierarchyTree";
-import { OrgUnitHierarchyData } from "../../types/OrgUnitsData";
-import { Icon } from "../Icon";
-import { useOrgUnitStructure } from "../../hooks/useOrgUnitStructure";
-import { useChildrenOrgUnits } from "../../hooks/useChildrenOrgUnits";
-import Link from "next/link";
-import { OrgUnitsDropdownMenu } from "../OrgUnitsDropdownMenu/OrgUnitsDropdownMenu";
+import { Link, Toggle, Dropdown, DropdownButton } from "@faststore/ui";
+
+import type { OrgUnitHierarchyData } from "../../types";
+import { OrgUnitsDropdownMenu } from "..";
+import { useChildrenOrgUnits, useOrgUnitStructure } from "../../hooks";
+import { HierarchyTree, Icon } from "../../../shared/components";
 
 export type OrgUnitsHierarchyTreeProps = {
   orgUnitHierarchyData: OrgUnitHierarchyData;
@@ -26,7 +24,7 @@ export const OrgUnitsHierarchyTree = ({
       data-fs-org-units-hierarchy-root
     >
       {({ isRoot, isOpen, toggle, isLastNode, name, id }) => {
-        const { refetchChildrenOrgUnits } = useChildrenOrgUnits(id, {
+        useChildrenOrgUnits(id, {
           onSuccess: (orgUnitHierarchyData) => {
             orgUnitHierarchyData?.nodes &&
               setNode(id, orgUnitHierarchyData.nodes);
@@ -45,6 +43,7 @@ export const OrgUnitsHierarchyTree = ({
                 />
               )}
               <button
+                type="button"
                 data-fs-org-unit-item-toggle
                 disabled={isLastNode}
                 onClick={toggle}
@@ -71,7 +70,10 @@ export const OrgUnitsHierarchyTree = ({
                   {!isRoot && <Toggle id={id} />}
                   <Dropdown>
                     <DropdownButton asChild>
-                      <button data-fs-org-unit-item-content-actions-more-button>
+                      <button
+                        type="button"
+                        data-fs-org-unit-item-content-actions-more-button
+                      >
                         <Icon name="MoreVert" width={24} height={24} />
                       </button>
                     </DropdownButton>

package/src/{components → features/org-units/components}/OrgUnitsHierarchyTree/org-units-hierarchy-tree.scss

@@ -1,5 +1,5 @@
 [data-fs-org-units-hierarchy] {
-  @import "../HierarchyTree/hierarchy-tree.scss";
+  @import "../../../shared/components/HierarchyTree/hierarchy-tree.scss";
 
   border-top: var(--fs-border-width) solid #e0e0e0;
 

package/src/{components → features/org-units/components}/OrganizationalUnitsCard/OrganizationalUnitsCard.tsx

@@ -1,11 +1,9 @@
 import { Toggle, Button, Dropdown, DropdownButton } from "@faststore/ui";
+import { CreateOrgUnitDrawer, OrgUnitsDropdownMenu } from "..";
 
-import { OrgUnitData } from "../../types/OrgUnitsData";
-import { Icon } from "../Icon";
-import { BasicCard } from "../BasicCard/BasicCard";
-import { OrgUnitsDropdownMenu } from "../OrgUnitsDropdownMenu/OrgUnitsDropdownMenu";
-import { CreateOrgUnitDrawer } from "../CreateOrgUnitDrawer/CreateOrgUnitDrawer";
-import { useDrawerProps } from "../../hooks/useDrawerProps";
+import type { OrgUnitData } from "../../types";
+import { BasicCard, Icon } from "../../../shared/components";
+import { useDrawerProps } from "../../../shared/hooks";
 
 type OrganizationalUnitsCardProps = {
   orgUnitData?: {

package/src/{components → features/org-units/components}/UpdateOrgUnitDrawer/UpdateOrgUnitDrawer.tsx

@@ -1,12 +1,17 @@
 import { useState } from "react";
-import { BasicDrawer, BasicDrawerProps } from "../BasicDrawer/BasicDrawer";
-import { InputText } from "../InputText/InputText";
-import { ErrorMessage } from "../ErrorMessage/ErrorMessage";
-import { useUI } from "@faststore/ui";
-import { useUpdateOrgUnit } from "../../hooks/useUpdateOrgUnit";
-import { AutocompleteDropdown } from "../AutocompleteDropdown/AutocompleteDropdown";
-import { Icon } from "../Icon";
+
 import { useRouter } from "next/router";
+import { useUI } from "@faststore/ui";
+
+import { useUpdateOrgUnit } from "../../hooks";
+import {
+  AutocompleteDropdown,
+  BasicDrawer,
+  type BasicDrawerProps,
+  ErrorMessage,
+  Icon,
+  InputText,
+} from "../../../shared/components";
 
 export type UpdateOrgUnitDrawerProps = Omit<BasicDrawerProps, "children"> & {
   options?: { id: string; name: string }[];

package/src/features/org-units/components/UpdateOrgUnitDrawer/update-org-unit-drawer.scss

@@ -0,0 +1,6 @@
+@import "../../../shared/components/BasicDrawer/basic-drawer.scss";
+
+[data-fs-bp-update-org-unit-drawer] {
+  @import "../../../shared/components/InputText/input-text.scss";
+  @import "../../../shared/components/ErrorMessage/error-message.scss";
+}