188363563 Formula Editor API Requests

v3/src/components/case-card/case-card.v2.js

@@ -2,12 +2,12 @@
 import PropTypes from 'prop-types'
 import React from 'react'
 import ReactDOMFactories from "react-dom-factories"
+import { getSharedCaseMetadataFromDataset } from "../../models/shared/shared-data-utils"
+import { uiState } from "../../models/ui-state"
 import { preventCollectionReorg } from "../../utilities/plugin-utils"
 import { createReactFactory, DG } from "../../v2/dg-compat.v2"
 import { SC } from "../../v2/sc-compat"
-import { getSharedCaseMetadataFromDataset } from "../../models/shared/shared-data-utils"
 import { EditAttributePropertiesModal } from "../case-tile-common/attribute-menu/edit-attribute-properties-modal"
-import { EditFormulaModal } from "../case-tile-common/attribute-menu/edit-formula-modal"
 
 import "./attribute-name-cell.v2"
 import "./attribute-value-cell.v2"
@@ -249,17 +249,6 @@
             this.setState({ editAttributePropModalIsOpen: false, currentAttributeId: null })
           },
 
-          editFormulaModal(attributeId, isOpen) {
-            if (attributeId) {
-              this.setState({editFormulaModalIsOpen: isOpen, currentAttributeId: attributeId})
-            }
-          },
-
-          closeEditFormulaModal() {
-            this.setState({ editFormulaModalIsOpen: false, currentAttributeId: null })
-            this.incrementStateCount()
-          },
-
           /**
            *  ------------------Below here are rendering functions---------------
            */
@@ -534,7 +523,7 @@
                 }.bind(this),
 
                 editFormula = function () {
-                  this.editFormulaModal(iAttr.get('id'), true)
+                  uiState.setEditFormulaAttributeId(iAttr.get('id'))
                 }.bind(this),
 
                 hideAttribute = function () {
@@ -934,11 +923,6 @@
               attributeId: this.state.currentAttributeId,
               isOpen: this.state.editAttributePropModalIsOpen,
               onClose: this.closeEditAttributePropModal
-            }),
-            this.state.editFormulaModalIsOpen && React.createElement(EditFormulaModal, {
-              attributeId: this.state.currentAttributeId,
-              isOpen: this.state.editFormulaModalIsOpen,
-              onClose: this.closeEditFormulaModal
             }))
           }
         }

v3/src/components/case-tile-common/attribute-menu/attribute-menu-list.tsx

@@ -9,12 +9,12 @@ import {
 } from "../../../models/data/data-set-notifications"
 import { IAttributeChangeResult } from "../../../models/data/data-set-types"
 import { sortItemsWithCustomUndoRedo } from "../../../models/data/data-set-undo"
+import { uiState } from "../../../models/ui-state"
 import {
   allowAttributeDeletion, preventCollectionReorg, preventTopLevelReorg
 } from "../../../utilities/plugin-utils"
 import { t } from "../../../utilities/translation/translate"
 import { EditAttributePropertiesModal } from "./edit-attribute-properties-modal"
-import { EditFormulaModal } from "./edit-formula-modal"
 
 interface IProps {
   attributeId: string
@@ -28,7 +28,6 @@ const AttributeMenuListComp = forwardRef<HTMLDivElement, IProps>(
   const caseMetadata = useCaseMetadata()
   // each use of useDisclosure() maintains its own state and callbacks so they can be used for independent dialogs
   const propertiesModal = useDisclosure()
-  const formulaModal = useDisclosure()
 
   if (!attributeId) return null
 
@@ -47,13 +46,7 @@ const AttributeMenuListComp = forwardRef<HTMLDivElement, IProps>(
   }
 
   const handleEditFormulaOpen = () => {
-    formulaModal.onOpen()
-    onModalOpen(true)
-  }
-
-  const handleEditFormulaClose = () => {
-    formulaModal.onClose()
-    onModalOpen(false)
+    uiState.setEditFormulaAttributeId(attributeId)
   }
 
   const handleSortCases = (item: IMenuItem) => {
@@ -206,7 +199,6 @@ const AttributeMenuListComp = forwardRef<HTMLDivElement, IProps>(
       </MenuList>
       <EditAttributePropertiesModal attributeId={attributeId} isOpen={propertiesModal.isOpen}
         onClose={handleEditPropertiesClose} />
-      <EditFormulaModal attributeId={attributeId} isOpen={formulaModal.isOpen} onClose={handleEditFormulaClose} />
     </>
   )
 })

v3/src/components/case-tile-common/attribute-menu/attribute-menu.scss

@@ -20,34 +20,3 @@
     margin-left: 10px;
   }
 }
-
-// Formula Editor Styles
-.codap-modal-content {
-  .formula-modal-body {
-    cursor: default;
-
-    .formula-form-control {
-      input {
-        max-width: 270px;
-      }
-    }
-
-    .formula-editor-button {
-      padding: 0 10px;
-      &:hover {
-        background: $codap-teal-lighter;
-      }
-      &:active, &.menu-open {
-        background: $codap-teal-light;
-        color: white;
-      }
-      &.insert-value {
-        margin-left: 0;
-      }
-    }
-  }
-
-  .formula-modal-footer {
-    cursor: default;
-  }
-}

v3/src/components/common/edit-formula-modal.scss

@@ -0,0 +1,31 @@
+@import "../vars.scss";
+
+.codap-modal-content {
+  .formula-modal-body {
+    cursor: default;
+
+    .formula-form-control {
+      input {
+        max-width: 270px;
+      }
+    }
+
+    .formula-editor-button {
+      padding: 0 10px;
+      &:hover {
+        background: $codap-teal-lighter;
+      }
+      &:active, &.menu-open {
+        background: $codap-teal-light;
+        color: white;
+      }
+      &.insert-value {
+        margin-left: 0;
+      }
+    }
+  }
+
+  .formula-modal-footer {
+    cursor: default;
+  }
+}