Merge pull request #168 from bigcapitalhq/abouhuolia/big-30-create-a-new-warehouse-transfer-broken

fix(webapp): warehouses select component

packages/webapp/src/components/Warehouses/WarehouseSelect.tsx

@@ -1,75 +1,21 @@
 // @ts-nocheck
 import React from 'react';
-
-import { MenuItem, Button } from '@blueprintjs/core';
 import { FSelect } from '../Forms';
 
 /**
- *
- * @param {*} query
- * @param {*} warehouse
- * @param {*} _index
- * @param {*} exactMatch
- * @returns
- */
-const warehouseItemPredicate = (query, warehouse, _index, exactMatch) => {
-  const normalizedTitle = warehouse.name.toLowerCase();
-  const normalizedQuery = query.toLowerCase();
-
-  if (exactMatch) {
-    return normalizedTitle === normalizedQuery;
-  } else {
-    return (
-      `${warehouse.code}. ${normalizedTitle}`.indexOf(normalizedQuery) >= 0
-    );
-  }
-};
-
-/**
- *
- * @param {*} film
- * @param {*} param1
- * @returns
- */
-const warehouseItemRenderer = (
-  warehouse,
-  { handleClick, modifiers, query },
-) => {
-  const text = `${warehouse.name}`;
-
-  return (
-    <MenuItem
-      active={modifiers.active}
-      disabled={modifiers.disabled}
-      label={warehouse.code}
-      key={warehouse.id}
-      onClick={handleClick}
-      text={text}
-    />
-  );
-};
-
-const warehouseSelectProps = {
-  itemPredicate: warehouseItemPredicate,
-  itemRenderer: warehouseItemRenderer,
-  valueAccessor: 'id',
-  labelAccessor: 'name',
-};
-
-/**
- *
+ * Warehouse select field.
  * @param {*} param0
  * @returns
  */
 export function WarehouseSelect({ warehouses, ...rest }) {
-  return <FSelect {...warehouseSelectProps} {...rest} items={warehouses} />;
-}
-
-/**
- *
- * @param {*} param0
- * @returns
- */
-export function WarehouseSelectButton({ label, ...rest }) {
-  return <Button text={label} />;
-}
+  return (
+    <FSelect
+      valueAccessor={'id'}
+      labelAccessor={'code'}
+      textAccessor={'name'}
+      popoverProps={{ minimal: true, usePortal: true, inline: false }}
+      {...rest}
+      items={warehouses}
+    />
+  );
+}

packages/webapp/src/constants/sidebarMenu.tsx

@@ -71,12 +71,6 @@ export const SidebarMenu = [
                   ability: InventoryAdjustmentAction.View,
                 },
               },
-              {
-                text: <T id={'sidebar.warehouse_transfer'} />,
-                href: '/warehouses-transfers',
-                type: ISidebarMenuItemType.Link,
-                feature: Features.Warehouses,
-              },
               {
                 text: <T id={'category_list'} />,
                 href: '/items/categories',
@@ -86,6 +80,12 @@ export const SidebarMenu = [
                   ability: ItemAction.View,
                 },
               },
+              {
+                text: <T id={'sidebar.warehouse_transfer'} />,
+                href: '/warehouses-transfers',
+                type: ISidebarMenuItemType.Link,
+                feature: Features.Warehouses,
+              },
             ],
           },
           {
@@ -101,12 +101,6 @@ export const SidebarMenu = [
                   ability: ItemAction.Create,
                 },
               },
-              {
-                text: <T id={'sidebar.new_warehouse_transfer'} />,
-                href: '/warehouses-transfers/new',
-                type: ISidebarMenuItemType.Link,
-                feature: Features.Warehouses,
-              },
               {
                 text: <T id={'sidebar.new_service'} />,
                 href: '/items/new',
@@ -126,6 +120,12 @@ export const SidebarMenu = [
                   ability: ItemAction.Create,
                 },
               },
+              {
+                text: <T id={'sidebar.new_warehouse_transfer'} />,
+                href: '/warehouses-transfers/new',
+                type: ISidebarMenuItemType.Link,
+                feature: Features.Warehouses,
+              },
             ],
           },
         ],

packages/webapp/src/containers/Dialogs/InventoryAdjustmentFormDialog/InventoryAdjustmentFormDialogFields.tsx

@@ -23,7 +23,6 @@ import {
   BranchSelect,
   WarehouseSelect,
   BranchSelectButton,
-  WarehouseSelectButton,
   AccountsSuggestField,
 } from '@/components';
 import {
@@ -94,7 +93,6 @@ export default function InventoryAdjustmentFormDialogFields() {
               <WarehouseSelect
                 name={'warehouse_id'}
                 warehouses={warehouses}
-                input={WarehouseSelectButton}
                 popoverProps={{ minimal: true }}
               />
             </FormGroup>

packages/webapp/src/containers/WarehouseTransfers/WarehouseTransferForm/WarehouseTransferFormHeaderFields.tsx

@@ -6,19 +6,18 @@ import {
   Position,
   ControlGroup,
 } from '@blueprintjs/core';
-import { DateInput } from '@blueprintjs/datetime';
 import { FastField, Field, ErrorMessage } from 'formik';
-import { FFormGroup, FormattedMessage as T } from '@/components';
+import { DateInput } from '@blueprintjs/datetime';
+import {
+  FFormGroup,
+  FormattedMessage as T,
+  WarehouseSelect,
+} from '@/components';
 import { momentFormatter, compose, tansformDateValue } from '@/utils';
 import classNames from 'classnames';
 
 import { CLASSES } from '@/constants/classes';
-import {
-  AccountsSelect,
-  FieldRequiredHint,
-  Icon,
-  InputPrependButton,
-} from '@/components';
+import { FieldRequiredHint, Icon, InputPrependButton } from '@/components';
 import { inputIntent, handleDateChange } from '@/utils';
 import { useWarehouseTransferFormContext } from './WarehouseTransferFormProvider';
 import { useObserveTransferNoSettings } from './utils';
@@ -140,9 +139,9 @@ function WarehouseTransferFormHeaderFields({
         inline={true}
         labelInfo={<FieldRequiredHint />}
       >
-        <AccountsSelect
+        <WarehouseSelect
           name={'from_warehouse_id'}
-          items={warehouses}
+          warehouses={warehouses}
           placeholder={<T id={'select_warehouse_transfer'} />}
           allowCreate={true}
           fill={true}
@@ -156,9 +155,9 @@ function WarehouseTransferFormHeaderFields({
         inline={true}
         labelInfo={<FieldRequiredHint />}
       >
-        <AccountsSelect
+        <WarehouseSelect
           name={'to_warehouse_id'}
-          items={warehouses}
+          warehouses={warehouses}
           placeholder={<T id={'select_warehouse_transfer'} />}
           fill={true}
           allowCreate={true}

packages/webapp/src/hooks/query/warehousesTransfers.tsx

@@ -12,6 +12,10 @@ const commonInvalidateQueries = (queryClient) => {
 
   // Invalidate item warehouses.
   queryClient.invalidateQueries(t.ITEM_WAREHOUSES_LOCATION);
+
+  // Invalidate items.
+  queryClient.invalidateQueries(t.ITEMS);
+  queryClient.invalidateQueries(t.ITEM);
 };
 
 /**