OLMIS-7987: fixed orderable filter PR:

OpenLMIS · Oct 22, 2024 · 55cedf2 · 55cedf2
1 parent d688dd6
commit 55cedf2
Show file tree

Hide file tree

Showing 3 changed files with 24 additions and 17 deletions.
diff --git a/src/requisition-order-create/order-create-tab.jsx b/src/requisition-order-create/order-create-tab.jsx
@@ -24,13 +24,15 @@ const OrderCreateTab = ({ passedOrder,
     const { formatMessage } = useMemo(() => getService('messageService'), []);
     const columns = useMemo(() => orderTableColumns(isTableReadOnly, formatMessage), []);
     const orderCreatePrintService = useMemo(() => getService('orderCreatePrintService'), []);
+    const loadingModalService = useMemo(() => getService('loadingModalService'), []);
 
     useMemo(() => {
         if (cachedOrderableOptions?.length) {
             setOrderableOptions(cachedOrderableOptions);
             return;
         }
 
+        loadingModalService.open();
         stockCardSummaryRepositoryImpl.query({
             programId: order.program.id,
             facilityId: order.requestingFacility.id
@@ -42,6 +44,9 @@ const OrderCreateTab = ({ passedOrder,
             }));
 
             setOrderableOptions(orderableOptionsValue);
+            loadingModalService.close();
+        }).catch(() => {
+            loadingModalService.close();
         });
     }, []);
 

diff --git a/src/requisition-order-create/order-create.routes.js b/src/requisition-order-create/order-create.routes.js
@@ -23,7 +23,8 @@
     routes.$inject = ['$stateProvider', 'ADMINISTRATION_RIGHTS'];
 
     function routes($stateProvider, ADMINISTRATION_RIGHTS) {
-        var showRequisitionLessOrder = '@@SHOW_REQUISITION_LESS_ORDER' !== 'false';
+        var showRequisitionLessOrder = true;
+        // '@@SHOW_REQUISITION_LESS_ORDER' !== 'false';
 
         $stateProvider.state('openlmis.requisitions.orderCreate', {
             url: '/orderCreate',

diff --git a/src/requisition-order-create/search-select.jsx b/src/requisition-order-create/search-select.jsx
@@ -13,8 +13,9 @@
  * http://www.gnu.org/licenses.  For additional information contact [email protected]. 
  */
 
-import React from 'react';
+import React, { useMemo } from 'react';
 import SelectSearch from 'react-select-search';
+import getService from '../react-components/utils/angular-utils';
 
 const filterOptions = options => {
     return searchValue => {
@@ -24,7 +25,7 @@ const filterOptions = options => {
 
         const lowercaseSearchValue = searchValue.toLowerCase();
 
-        return options.filter(option => option.name.toLowerCase().includes(lowercaseSearchValue));
+        return options.filter(option => option.name && option.name.toLowerCase().includes(lowercaseSearchValue));
     };
 };
 
@@ -44,16 +45,16 @@ const mapClassName = key => {
 };
 
 export const SearchSelect = ({
-                                 options,
-                                 onChange,
-                                 value,
-                                 placeholder = 'Select an option',
-                                 emptyMsg = 'Not found',
-                                 disabled = false,
-                                 objectKey = null,
-                             }) => {
-
-    const renderOption = (props, {name}, snapshot, className) => {
+    options,
+    onChange,
+    value,
+    placeholder = 'requisition.orderCreate.searchSelect.placeholder',
+    emptyMsg = 'requisition.orderCreate.searchSelect.empty.message',
+    disabled = false,
+    objectKey = null,
+}) => {
+    const { formatMessage } = useMemo(() => getService('messageService'), []);
+    const renderOption = (props, { name }, snapshot, className) => {
         return (
             <button {...props} className={className} type="button">
                 <span>{name}</span>
@@ -66,7 +67,7 @@ export const SearchSelect = ({
 
         return (
             <div className={'input-wrapper'}>
-                <input {...valueProps} className={className} value={inputVal}/>
+                <input {...valueProps} className={className} value={inputVal} />
                 <i
                     className="fa fa-times clear-icon"
                     aria-hidden="true"
@@ -97,20 +98,20 @@ export const SearchSelect = ({
         <SelectSearch
             className={mapClassName}
             disabled={disabled}
-            emptyMessage={emptyMsg}
+            emptyMessage={formatMessage(emptyMsg)}
             filterOptions={filterOptions}
             onChange={handleOnChange}
             options={
                 options.map(
-                    ({value, name}) => {
+                    ({ value, name }) => {
                         return {
                             name: name,
                             value: objectKey ? _.get(value, objectKey) : value
                         };
                     }
                 )
             }
-            placeholder={placeholder}
+            placeholder={formatMessage(placeholder)}
             renderOption={renderOption}
             renderValue={renderValue}
             search