react error scopes, fix removing generated objects

web/app/sketcher.js

@@ -12,6 +12,7 @@ import {SketcherApp} from "./sketcher/components/SketcherApp";
 import React from "react";
 import {stream} from "lstream";
 import {loadUIState, saveUIState} from "./sketcher/uiState";
+import {Scope} from "./sketcher/components/Scope";
 
 function initializeSketcherApplication() {
   var app = new App2D();
@@ -156,7 +157,7 @@ function startReact(appCtx) {
     // e.preventDefault();
   };
   ReactDOM.render(
-    <SketcherApp applicationContext={appCtx} />,
+    <Scope><SketcherApp applicationContext={appCtx} /></Scope>,
     reactControls
   );
 }

web/app/sketcher/components/ContextualControls.jsx

@@ -4,12 +4,12 @@ import {matchAvailableActions} from "../actions";
 import {useStream} from "../../../../modules/ui/effects";
 import {SketcherAppContext} from "./SketcherApp";
 import {MatchIndex, matchSelection} from "../selectionMatcher";
-import {ConstraintButton} from "./ConstraintExplorer";
+import {ConstraintButton, GeneratorButton} from "./ConstraintExplorer";
 
 export function ContextualControls() {
 
   const selection = useStream(ctx => ctx.viewer.streams.selection);
-  const ___ = useStream(ctx => ctx.viewer.parametricManager.$constraints);
+  const ___ = useStream(ctx => ctx.viewer.parametricManager.$update);
 
   const ctx = useContext(SketcherAppContext);
 
@@ -26,7 +26,7 @@ export function ContextualControls() {
   return <div className={ls.root}>
 
     {
-      selection.map(s => <div onDoubleClick={debugEgg(s)} className={ls.item}>{s.simpleClassName}: {s.id}</div>)
+      selection.map(s => <div key={s.id} onDoubleClick={debugEgg(s)} className={ls.item}>{s.simpleClassName}: {s.id}</div>)
     }
 
     <div className={ls.hr}>AVAILABLE ACTIONS:</div>
@@ -38,6 +38,7 @@ export function ContextualControls() {
     }}>
       {
         availableActions.map(a => <button
+          key={a.id}
           style={{
             margin: 3
           }}
@@ -51,6 +52,18 @@ export function ContextualControls() {
         {nonInternalConstraints.map(c => <ConstraintButton constraint={c} key={c.id} style={{borderColor: 'white'}}/>)}
       </>
     }
+    {
+      obj && obj.generators.size !== 0 && <>
+        <div className={ls.hr}>PARTICIPATES IN GENERATORS:</div>
+        {Array.from(obj.generators).map(c => <GeneratorButton generator={c} key={c.id} style={{borderColor: 'white'}}/>)}
+      </>
+    }
+    {
+      obj && obj.generator && <>
+        <div className={ls.hr}>GENERATED BY:</div>
+        <GeneratorButton generator={obj.generator} style={{borderColor: 'white'}}/>
+      </>
+    }
 
   </div>;
 

web/app/sketcher/components/Scope.jsx

@@ -0,0 +1,34 @@
+import React from "react";
+
+export class Scope extends React.Component {
+
+  state = {
+    hasError: false,
+  };
+
+  recover = () => {
+    toRecover.delete(this.recover);
+    this.setState({hasError: false});
+  };
+
+  componentDidCatch(e) {
+    this.setState({hasError: true});
+    setTimeout(() => toRecover.add(this.recover), 300);
+    console.error(e);
+  }
+
+  render() {
+    if (this.state.hasError) {
+      return this.props.message || null;
+    }
+    return this.props.children;
+  }
+}
+
+const toRecover = new Set();
+
+document.addEventListener('DOMContentLoaded', function() {
+  document.addEventListener("mouseup", function( e ) {
+    setTimeout(() => toRecover.forEach(r => r()), 300);
+  }, false)
+}, false);

web/app/sketcher/components/SketcherApp.jsx

@@ -8,6 +8,7 @@ import {ToastContainer} from "react-toastify";
 import 'react-toastify/dist/ReactToastify.css';
 import SketcherOperationWizard from "./SketcherOperationWizard";
 import {StageControl} from "./StageControl";
+import {Scope} from "./Scope";
 
 export const SketcherAppContext = React.createContext({});
 
@@ -15,9 +16,9 @@ export function SketcherApp({applicationContext}) {
   return <SketcherAppContext.Provider value={applicationContext}>
     <StreamsContext.Provider value={applicationContext}>
       <ToastContainer />
-      <RightSideControls />
+      <Scope><RightSideControls /></Scope>
       {ReactDOM.createPortal(
-        <ConstraintList />,
+        <Scope><ConstraintList /></Scope>,
         document.getElementById('constraint-list')
       )}
     </StreamsContext.Provider>
@@ -27,9 +28,9 @@ export function SketcherApp({applicationContext}) {
 
 function RightSideControls() {
   return <React.Fragment>
-    <ContextualControls />
-    <ConstraintEditor />
-    <SketcherOperationWizard />
-    <StageControl />
+    <Scope><ContextualControls /></Scope>
+    <Scope><ConstraintEditor /></Scope>
+    <Scope><SketcherOperationWizard /></Scope>
+    <Scope><StageControl /></Scope>
   </React.Fragment>
 }

web/app/sketcher/generators/sketchGenerator.js

@@ -73,7 +73,7 @@ export class SketchGenerator {
       if (!restoredObject) {
         throw 'generator refers to non existent object';
       }
-      restoredObject.generator = this;
+      restoredObject.generator = sketchGenerator;
       return restoredObject;
     });
     sketchGenerator.init();

web/app/sketcher/parametric.js

@@ -200,6 +200,7 @@ class ParametricManager {
   };
 
   removeGenerator(generator) {
+    this.viewer.deselectAll();
     this.startTransaction();
     this._removeGenerator(generator);
     this.finishTransaction();
@@ -407,7 +408,7 @@ class SolveStage {
 
   removeGenerator(generator) {
     this.generators.delete(generator);
-    generator.sourceObjects(obj => obj.generators.delete(this.generators))
+    generator.sourceObjects(obj => obj.generators.delete(generator))
   }
 
   createAlgNumSystem() {

web/app/sketcher/sketcher-app.js

@@ -243,7 +243,7 @@ function App2D() {
   });
 
   this.registerAction('tangentConstraint', "Tangent Constraint", function () {
-    app.viewer.parametricManager.tangent(app.viewer.selected);
+    runActionOrToastWhyNot('Tangent', app.viewer.selected, app.context);
   });
 
   this.registerAction('lockConstraint', "Lock Constraint", function () {

web/app/sketcher/tools/circle.js

@@ -32,7 +32,6 @@ export class EditCircleTool extends Tool {
   }
 
   solveRequest(rough) {
-    // this.viewer.parametricManager.prepare([this.circle.r]);
     this.viewer.parametricManager.solve(rough);
   }
 
@@ -55,6 +54,7 @@ export class EditCircleTool extends Tool {
     this.pointPicked(this.circle.c.x, this.circle.c.y);
     this.sendHint('specify radius');
     this.viewer.activeLayer.add(this.circle);
+    this.viewer.parametricManager.prepare([this.circle]);
     this.viewer.refresh();
   }
 

web/app/sketcher/tools/drag.js

@@ -1,6 +1,7 @@
 import {Tool} from './tool'
 import {optim} from '../../math/optim'
 import * as math from '../../math/math'
+import {toast} from "react-toastify";
 
 export class DragTool extends Tool {
   
@@ -33,6 +34,9 @@ export class DragTool extends Tool {
   }
 
   mousedown(e) {
+    if (this.obj.isGenerated) {
+      toast("You cannot drag generated object. To move them, drag the objects they are generated off of ")
+    }
     this.origin.x = e.offsetX;
     this.origin.y = e.offsetY;
     this.viewer.screenToModel2(e.offsetX, e.offsetY, this._point);

web/app/sketcher/tools/manager.js

@@ -49,7 +49,6 @@ export class ToolManager {
         this.releaseControl();
       } else if (e.keyCode === 46 || e.keyCode === 8) {
         let selection = viewer.selected.slice();
-        viewer.deselectAll();
         viewer.removeAll(selection);
         viewer.refresh();
       }

web/app/sketcher/viewer2d.js

@@ -138,6 +138,7 @@ class Viewer {
   };
 
   removeAll(objects) {
+    this.deselectAll();
     this.parametricManager.removeObjects(objects);
   };