stores: add computed-values store

Components/Calculation/builders/build-computed.tsx

@@ -0,0 +1,20 @@
+import { observer } from 'mobx-react-lite';
+import { useStatus } from 'stores/calculation/statuses/hooks';
+import { useValidation } from 'stores/calculation/validation/hooks';
+import { useComputedValue } from 'stores/calculation/values/hooks';
+import { getComputedValueName } from '../config/map-computed';
+import type { BuilderProps } from './types';
+
+export default function buildComputedValue({ elementName, Component, ...props }: BuilderProps) {
+  const computedValueName = getComputedValueName(elementName);
+
+  return observer(() => {
+    const { computedValue } = useComputedValue(computedValueName);
+    const { status } = useStatus(elementName);
+    const { isValid, help } = useValidation(elementName);
+
+    return (
+      <Component value={computedValue} status={status} isValid={isValid} help={help} {...props} />
+    );
+  });
+}

Components/Calculation/builders/build-options.tsx

@@ -3,7 +3,7 @@ import { useOptions } from 'stores/calculation/options/hooks';
 import { useStatus } from 'stores/calculation/statuses/hooks';
 import { useValidation } from 'stores/calculation/validation/hooks';
 import { useValue } from 'stores/calculation/values/hooks';
-import { getValueName } from '../config/map';
+import { getValueName } from '../config/map-values';
 import type { BuilderProps } from './types';
 
 export default function buildValueElement({ elementName, Component, ...props }: BuilderProps) {

Components/Calculation/builders/build-readonly.tsx

@@ -1,6 +1,6 @@
 import { observer } from 'mobx-react-lite';
 import { useValue } from 'stores/calculation/values/hooks';
-import { getValueName } from '../config/map';
+import { getValueName } from '../config/map-values';
 import type { BuilderProps } from './types';
 
 export default function buildValueElement({ elementName, Component, ...props }: BuilderProps) {

Components/Calculation/builders/build-value.tsx

@@ -2,7 +2,7 @@ import { observer } from 'mobx-react-lite';
 import { useStatus } from 'stores/calculation/statuses/hooks';
 import { useValidation } from 'stores/calculation/validation/hooks';
 import { useValue } from 'stores/calculation/values/hooks';
-import { getValueName } from '../config/map';
+import { getValueName } from '../config/map-values';
 import type { BuilderProps } from './types';
 
 export default function buildValueElement({ elementName, Component, ...props }: BuilderProps) {

Components/Calculation/builders/types.ts

@@ -1,5 +1,5 @@
 import type { FC } from 'react';
-import type { Elements } from '../config/map';
+import type { Elements } from '../config/map-values';
 
 export interface BuilderProps {
   elementName: Elements;

Components/Calculation/config/map-computed.ts

@@ -0,0 +1,14 @@
+import type { ComputedValues } from 'stores/calculation/values/computed';
+
+export const elementsToComputed: Record<string, ComputedValues> = {
+  labelLeaseObjectRisk: 'leaseObjectRiskName',
+  tbxInsKaskoPriceLeasePeriod: 'insKaskoPriceLeasePeriod',
+  labelIrrInfo: 'irrInfo',
+  labelRegistrationDescription: 'registrationDescription',
+};
+
+export type Elements = keyof typeof elementsToComputed;
+
+export function getComputedValueName(elementName: Elements) {
+  return elementsToComputed[elementName];
+}

Components/Calculation/config/map-values.ts

@@ -1,4 +1,4 @@
-import { Values, ValuesTypes } from 'stores/calculation/values/types';
+import type { Values, ValuesTypes } from 'stores/calculation/values/types';
 
 function wrapElementsMap<T extends Record<string, Values>>(arg: T) {
   return arg;
@@ -150,14 +150,14 @@ export const elementsToValues = wrapElementsMap({
   linkDownloadKp: 'kpUrl',
 });
 
-export type ElementsValues = typeof elementsToValues;
+type ElementsValues = typeof elementsToValues;
 
 export type ElementsTypes = {
   [Key in keyof ElementsValues]: ValuesTypes[ElementsValues[Key]];
 };
 
+export type Elements = keyof ElementsValues;
+
 export function getValueName(elementName: Elements) {
   return elementsToValues[elementName];
 }
-
-export type Elements = keyof ElementsValues;

stores/calculation/options/index.ts

@@ -3,7 +3,7 @@
 /* eslint-disable no-confusing-arrow */
 /* eslint-disable object-curly-newline */
 /* eslint-disable import/no-cycle */
-import type { Elements } from 'Components/Calculation/config/map';
+import type { Elements } from 'Components/Calculation/config/map-values';
 import type { BaseOption } from 'Elements/types';
 import { mergeWith } from 'lodash';
 import { makeAutoObservable } from 'mobx';

stores/calculation/options/types.ts

@@ -1,4 +1,4 @@
-import type { Elements } from 'Components/Calculation/config/map';
+import type { Elements } from 'Components/Calculation/config/map-values';
 import type { BaseOption } from 'Elements/types';
 
 export type CalculationOptions = Record<Elements, BaseOption[]>;

stores/calculation/statuses/index.ts

@@ -1,6 +1,6 @@
 /* eslint-disable object-curly-newline */
 /* eslint-disable import/no-cycle */
-import type { Elements } from 'Components/Calculation/config/map';
+import type { Elements } from 'Components/Calculation/config/map-values';
 import type { Status } from 'Elements/types';
 import { makeAutoObservable } from 'mobx';
 import RootStore from 'stores/root';

stores/calculation/statuses/types.ts

@@ -1,4 +1,4 @@
-import type { Elements } from 'Components/Calculation/config/map';
+import type { Elements } from 'Components/Calculation/config/map-values';
 import type { Status } from 'Elements/types';
 
 export type CalculationStatuses = Partial<Record<Elements, Status>>;

stores/calculation/validation/index.ts

@@ -1,7 +1,7 @@
 /* eslint-disable import/no-cycle */
 /* eslint-disable implicit-arrow-linebreak */
 /* eslint-disable object-curly-newline */
-import type { Elements } from 'Components/Calculation/config/map';
+import type { Elements } from 'Components/Calculation/config/map-values';
 import { makeAutoObservable, observable } from 'mobx';
 import RootStore from 'stores/root';
 import type { Error, Messages } from './types';

stores/calculation/validation/types.ts

@@ -1,4 +1,4 @@
-import type { Elements } from 'Components/Calculation/config/map';
+import type { Elements } from 'Components/Calculation/config/map-values';
 import type { IObservableArray } from 'mobx';
 
 export type Error = { name: string; text: string };

stores/calculation/values/computed.ts

@@ -0,0 +1,30 @@
+/* eslint-disable import/no-cycle */
+import { makeAutoObservable } from 'mobx';
+import RootStore from 'stores/root';
+
+export default class Computed {
+  root: RootStore;
+
+  constructor(rootStore: RootStore) {
+    makeAutoObservable(this);
+    this.root = rootStore;
+  }
+
+  get leaseObjectRiskName() {
+    return '';
+  }
+
+  get irrInfo() {
+    return '';
+  }
+
+  get registrationDescription() {
+    return '';
+  }
+
+  get insKaskoPriceLeasePeriod() {
+    return '';
+  }
+}
+
+export type ComputedValues = Exclude<keyof Computed, 'root'>;

stores/calculation/values/hooks.js

@@ -15,9 +15,7 @@ export function useValue(valueName) {
   );
 
   const setStoreValue = useDebouncedCallback(
-    (value) => {
-      $calculation.$values.setValue(valueName, value);
-    },
+    (value) => $calculation.$values.setValue(valueName, value),
     DEBOUNCE_DELAY,
     {
       maxWait: 2000,
@@ -29,3 +27,13 @@ export function useValue(valueName) {
     setValue: setStoreValue,
   };
 }
+
+export function useComputedValue(valueName) {
+  const { $calculation } = useStore();
+
+  const computedValue = $calculation.$values.$computed[valueName];
+
+  return {
+    computedValue,
+  };
+}

stores/calculation/values/index.ts

@@ -1,19 +1,22 @@
 /* eslint-disable implicit-arrow-linebreak */
 /* eslint-disable object-curly-newline */
 /* eslint-disable import/no-cycle */
-import type { Elements, ElementsTypes } from 'Components/Calculation/config/map';
-import { getValueName } from 'Components/Calculation/config/map';
+import type { Elements, ElementsTypes } from 'Components/Calculation/config/map-values';
+import { getValueName } from 'Components/Calculation/config/map-values';
 import { makeAutoObservable } from 'mobx';
 import RootStore from '../../root';
+import Computed from './computed';
 import type { CalculationValues, Values, ValuesTypes } from './types';
 
 export default class ValuesStore {
   root: RootStore;
   values: CalculationValues = {};
+  $computed: Computed;
 
   constructor(rootStore: RootStore) {
     makeAutoObservable(this);
     this.root = rootStore;
+    this.$computed = new Computed(rootStore);
   }
 
   hydrate = (initialValues: CalculationValues) => {