select component

src/client/Containers/Calculation/Sections/index.js

@@ -4,6 +4,7 @@ import Checkbox from 'client/Elements/Checkbox';
 import InputNumber from 'client/Elements/InputNumber';
 import TextArea from 'client/Elements/TextArea';
 import Switch from 'client/Elements/Switch';
+import Select from 'client/Elements/Select';
 
 export default [
   {
@@ -64,6 +65,13 @@ export default [
           name: 'switch',
           valueName: 'cbx'
         }
+      },
+      {
+        Component: withTitle('Cars')(Select),
+        props: {
+          name: 'cars',
+          valueName: 'cars'
+        }
       }
     ]
   },

src/client/Elements/Select.jsx

@@ -17,7 +17,7 @@ const Select = ({ name, showSearch, computedValue, valueName }) => {
   return (
     <AntSelect
       disabled={status === Status.Disabled}
-      showSearch={showSearch}
+      showSearch={showSearch || true}
       optionFilterProp="children"
       filterOption={filter}
       value={value}

src/client/hooks/useOptions.js

@@ -1,8 +1,8 @@
 import { useStores } from './useStores';
 
-export const useOptions = ({ elementName }) => {
+export const useOptions = elementName => {
   const { calculationStore } = useStores();
-  const options = calculationStore.options[elementName];
+  const options = calculationStore.options[elementName] || [];
   const filter = calculationStore.filters[elementName];
 
   return {

src/client/hooks/useStatus.js

@@ -1,6 +1,6 @@
 import { useStores } from './useStores';
 
-export const useStatus = ({ elementName }) => {
+export const useStatus = elementName => {
   const { calculationStore } = useStores();
   const status = calculationStore.statuses[elementName];
 

src/client/stores/CalculationStore/Effects/reaction.ts

@@ -1,4 +1,5 @@
 import { IReactionEffect } from 'core/types/effect';
+import { Status } from 'core/types/elements';
 
 const reactionEffects: IReactionEffect[] = [
   calculationStore => ({
@@ -11,7 +12,18 @@ const reactionEffects: IReactionEffect[] = [
   }),
   calculationStore => ({
     expression: () => calculationStore.values.cbx,
-    effect: cbx => console.log('cbx: ', cbx)
+    effect: cbx => {
+      if (cbx === true) {
+        calculationStore.statuses.cars = Status.Disabled;
+      } else {
+        calculationStore.statuses.cars = Status.Default;
+      }
+      console.log('cbx: ', cbx);
+    }
+  }),
+  calculationStore => ({
+    expression: () => calculationStore.values.cars,
+    effect: cars => console.log('cars: ', cars)
   })
 ];
 

src/core/config/initialOptions.ts

@@ -1,5 +1,5 @@
 const initialOptions: any = {
-  carsList: [
+  cars: [
     {
       name: 'Audi',
       value: '11111',