Calculation/Form: rename render function

rename SectionsConfig to FormComponentConfig
export rebass types from UIKit

Components/Calculation/Form/Leasing/config.ts

@@ -1,14 +1,16 @@
 /* eslint-disable object-curly-newline */
-import type { SectionsConfig } from 'Components/Calculation/types/sections';
+import type { FormComponentConfig } from '../../lib/renderFormComponent';
 
-const config: SectionsConfig = [
-  [['selectProduct'], { gridTemplateColumns: '1fr' }],
-  [['tbxLeaseObjectPrice', 'tbxVATInLeaseObjectPrice', 'tbxLeaseObjectPriceWthtVAT']],
-  [['selectSupplierCurrency', 'tbxSupplierDiscountRub', 'tbxSupplierDiscountPerc']],
-  [['tbxFirstPaymentPerc', 'tbxFirstPaymentRub']],
-  [['tbxLeasingPeriod', 'tbxSaleBonus', 'tbxRedemptionPaymentSum']],
-  [['selectSubsidy', 'labelSubsidySum']],
-  [['tbxLastPaymentPerc', 'tbxLastPaymentRub', 'radioLastPaymentRule']],
-];
+const config: FormComponentConfig = {
+  rows: [
+    [['selectProduct'], { gridTemplateColumns: '1fr' }],
+    [['tbxLeaseObjectPrice', 'tbxVATInLeaseObjectPrice', 'tbxLeaseObjectPriceWthtVAT']],
+    [['selectSupplierCurrency', 'tbxSupplierDiscountRub', 'tbxSupplierDiscountPerc']],
+    [['tbxFirstPaymentPerc', 'tbxFirstPaymentRub']],
+    [['tbxLeasingPeriod', 'tbxSaleBonus', 'tbxRedemptionPaymentSum']],
+    [['selectSubsidy', 'labelSubsidySum']],
+    [['tbxLastPaymentPerc', 'tbxLastPaymentRub', 'radioLastPaymentRule']],
+  ],
+};
 
 export default config;

Components/Calculation/Form/Leasing/index.jsx

@@ -1,8 +1,8 @@
-import renderElements from 'Components/Calculation/lib/renderElements';
+import renderFormComponent from 'Components/Calculation/lib/renderFormComponent';
 import config from './config';
 
 function Leasing() {
-  return renderElements(config);
+  return renderFormComponent(config);
 }
 
 export default Leasing;

Components/Calculation/Form/Payments/config.ts

@@ -1,8 +1,7 @@
 /* eslint-disable import/prefer-default-export */
+import type { FormComponentConfig } from '../../lib/renderFormComponent';
 
-import type { SectionsConfig } from 'Components/Calculation/types/sections';
-
-export const elements: SectionsConfig[number][0] = [
+export const elements: FormComponentConfig['rows'][number][0] = [
   'radioGraphType',
   'selectSeasonType',
   'tbxParmentsDecreasePercent',

Components/Calculation/Form/Payments/index.jsx

@@ -1,4 +1,3 @@
-/* eslint-disable operator-linebreak */
 import { Box, Flex } from 'UIKit/grid';
 import elementsRender from '../../config/elements-render';
 import { elements } from './config';
@@ -10,6 +9,7 @@ function Payments() {
     return render();
   });
 
+  // eslint-disable-next-line operator-linebreak
   const [radioGraphType, selectSeasonType, tbxParmentsDecreasePercent, selectHighSeasonStart] =
     renderedElements;
 

Components/Calculation/lib/renderFormComponent.tsx

@@ -1,9 +1,18 @@
+import type { BoxProps } from 'UIKit/grid';
 import { Box } from 'UIKit/grid';
 import elementsRender from '../config/elements-render';
-import type { SectionsConfig } from '../types/sections';
+import type { Elements as ActionElements } from '../config/map/actions';
+import type { Elements as ComputedElements } from '../config/map/computed';
+import type { Elements as ValuesElements } from '../config/map/values';
 
-function renderElements(config: SectionsConfig) {
-  const rows = config.map(([elements, style], i) => {
+export type FormComponentConfig = {
+  rows: Array<
+    [elements: (ValuesElements | ComputedElements | ActionElements)[], style?: BoxProps['style']]
+  >;
+};
+
+function renderFormComponent(config: FormComponentConfig) {
+  const rows = config.rows.map(([elements, style], i) => {
     const renderedElements = elements.map((elementName) => {
       const render = elementsRender[elementName]?.render;
 
@@ -38,4 +47,4 @@ function renderElements(config: SectionsConfig) {
   );
 }
 
-export default renderElements;
+export default renderFormComponent;

Components/Calculation/types/sections.ts

@@ -1,8 +0,0 @@
-import type { BoxProps } from 'rebass/styled-components';
-import type { Elements as ActionElements } from '../config/map/actions';
-import type { Elements as ComputedElements } from '../config/map/computed';
-import type { Elements as ValuesElements } from '../config/map/values';
-
-export type SectionsConfig = Array<
-  [elements: (ValuesElements | ComputedElements | ActionElements)[], style?: BoxProps['style']]
->;

UIKit/grid.js

@@ -1 +0,0 @@
-export { Box, Flex } from 'rebass/styled-components';

UIKit/grid.ts

@@ -0,0 +1,2 @@
+export { Box, Flex } from 'rebass/styled-components';
+export type { BoxProps, FlexProps } from 'rebass/styled-components';