fix mirror operation

modules/ui/components/Window.tsx

@@ -18,7 +18,7 @@ export interface WindowProps {
   className?: string;
   resizeCapturingBuffer?: number;
   resize?: number;
-  onResize?: () => void;
+  onResize?: any;
   enableResize?: boolean;
   children?: any;
   title: string,
@@ -46,7 +46,8 @@ export default class Window extends React.Component<WindowProps> {
   render() {
 
     let {initWidth, initHeight, initLeft, initTop, initRight, initBottom, centerScreen, setFocus, className, resizeCapturingBuffer,
-      resize, enableResize, children, title, icon, minimizable = false, onClose, controlButtons, footer, compact, ...props} = this.props;
+      resize, enableResize, children, title, icon, minimizable = false, onClose, controlButtons, footer, compact,
+      onResize, ...props} = this.props;
 
     return <div className={cx(ls.root, this.resizeConfig&&ls.mandatoryBorder, compact&&ls.compact, className)} {...props} ref={this.keepRef}>
       <div className={ls.bar + ' disable-selection'} onMouseDown={this.startDrag} onMouseUp={this.stopDrag}>

web/app/cad/craft/wizard/components/Wizard.tsx

@@ -2,7 +2,7 @@ import React, {useContext} from 'react';
 
 import ls from './Wizard.less';
 import CadError from '../../../../utils/errors';
-import {FormParamsContext, FormPathContext, FormStateContext} from './form/Form';
+import {FormEditContext, FormParamsContext, FormPathContext, FormStateContext} from './form/Form';
 import {GenericWizard} from "ui/components/GenericWizard";
 import {useStream} from "ui/effects";
 import {AppContext} from "cad/dom/components/AppContext";
@@ -23,6 +23,13 @@ export default function Wizard(props: WizardProps) {
   const state = useStream(ctx => ctx.wizardService.state$);
   const workingRequest = useStream(ctx =>  ctx.wizardService.workingRequest$);
 
+  const formEdit = {
+    onChange: (fullPath, value) => ctx.wizardService.updateParam(fullPath, value),
+    setActive: (fullPathFlatten, isActive) => ctx.wizardService.updateState(state => {
+      state.activeParam = isActive ? fullPathFlatten : null;
+    })
+  };
+
   if (!workingRequest) {
     return;
   }
@@ -92,7 +99,9 @@ export default function Wizard(props: WizardProps) {
     <FormParamsContext.Provider value={workingRequest.params}>
       <FormPathContext.Provider value={[]}>
         <FormStateContext.Provider value={state}>
-          <Form/>
+          <FormEditContext.Provider value={formEdit}>
+            <Form/>
+          </FormEditContext.Provider>
         </FormStateContext.Provider>
       </FormPathContext.Provider>
     </FormParamsContext.Provider>

web/app/cad/craft/wizard/components/form/Form.tsx

@@ -6,11 +6,16 @@ import {camelCaseSplitToStr} from 'gems/camelCaseSplit';
 import {ParamsPath, ParamsPathSegment, WizardState} from "cad/craft/wizard/wizardTypes";
 import {flattenPath, OperationParams, OperationParamValue} from "cad/craft/schema/schema";
 import {AppContext} from "cad/dom/components/AppContext";
-import _ from "lodash";
+
+interface FormEdit {
+  onChange: any;
+  setActive: any
+}
 
 export const FormStateContext: React.Context<WizardState> = React.createContext(null);
 export const FormParamsContext: React.Context<OperationParams> = React.createContext(null);
 export const FormPathContext: React.Context<ParamsPath> = React.createContext([]);
+export const FormEditContext: React.Context<FormEdit> = React.createContext(null);
 
 
 export function Group({children}) {
@@ -39,17 +44,16 @@ export function attachToForm(Control): any {
 
   return function FormField({name, ...props}: FormFieldProps) {
 
-    const ctx = useContext(AppContext);
     const formPath = useContext(FormPathContext);
     const formState = useContext(FormStateContext);
     const params = useContext(FormParamsContext);
+    const formEdit = useContext(FormEditContext);
 
     const fullPath = [...formPath, name];
     const fullPathFlatten = flattenPath(fullPath);
-    const onChange = value => ctx.wizardService.updateParam(fullPath, value);
-    const setActive = (isActive) => ctx.wizardService.updateState(state => {
-      state.activeParam = isActive ? fullPathFlatten : null;
-    });
+
+    const onChange = value => formEdit.onChange(fullPath, value);
+    const setActive = (isActive) => formEdit.setActive(fullPathFlatten, isActive);
 
     const value = params[name];
 

web/app/sketcher/components/SketcherOperationWizard.jsx

@@ -1,4 +1,10 @@
-import {FormContext, Group} from "../../cad/craft/wizard/components/form/Form";
+import {
+  FormEditContext,
+  FormParamsContext,
+  FormPathContext,
+  FormStateContext,
+  Group
+} from "cad/craft/wizard/components/form/Form";
 import Entity from "../../cad/craft/wizard/components/form/EntityList";
 import React, {useContext, useEffect, useState} from "react";
 import Window from "ui/components/Window";
@@ -83,38 +89,42 @@ export default function SketcherOperationWizard({}) {
   const {title, schema} = operationRequest;
   const {activeParam, params} = state;
 
-  let formContext = {
-    data: params,
-    activeParam,
-    setActiveParam: (activeParam) => setState(state => ({...state, activeParam})),
-    updateParam: (name, val) => setState(state => ({...state, params: {...params, name: val}}))
+  const formEdit = {
+    onChange: (name, val) => setState(state => ({...state, params: {...params, name: val}})),
+    setActive: (fullPathFlatten, isActive) => setState(state => ({...state,
+      activeParam: isActive ? fullPathFlatten : null
+    }))
   };
 
-
-
   return <Window initWidth={250} initLeft={255} initTop={5}
                  title={title.toUpperCase()}
                  onClose={onClose}>
 
-    <FormContext.Provider value={formContext}>
 
-      <Group>
-        {schema.map(field => {
-          return (() => {
+    <FormParamsContext.Provider value={params}>
+      <FormPathContext.Provider value={[]}>
+        <FormStateContext.Provider value={state}>
+          <FormEditContext.Provider value={formEdit}>
+            <Group>
+            {schema.map(field => {
+              return (() => {
 
-            if (field.type === 'selection') {
-              return <Entity name={field.name} title={field.title || field.name}
-                             placeholder={schema.placeholder} key={field.name}
-                             onEntityEnter={obj => {viewer.capture('highlight2', [obj], true); viewer.refresh();}}
-                             onEntityLeave={obj => {viewer.withdrawAll('highlight2');viewer.refresh();}}
-                             entityRenderer={entityRenderer}/>
-            }
-          })();
+                if (field.type === 'selection') {
+                  return <Entity name={field.name} title={field.title || field.name}
+                                 placeholder={schema.placeholder} key={field.name}
+                                 onEntityEnter={obj => {viewer.capture('highlight2', [obj], true); viewer.refresh();}}
+                                 onEntityLeave={obj => {viewer.withdrawAll('highlight2');viewer.refresh();}}
+                                 entityRenderer={entityRenderer}/>
+                }
+              })();
 
-        })}
-      </Group>
+            })}
+          </Group>
+          </FormEditContext.Provider>
+        </FormStateContext.Provider>
+      </FormPathContext.Provider>
+    </FormParamsContext.Provider>
 
-    </FormContext.Provider>
     <Stack>
       <ButtonGroup>
         <Button onClick={onClose}>Cancel</Button>