Merge pull request #923 from concord-consortium/186184994-group-plott…

…ed-value-with-univariate-measure-adornments

chore: Group Plotted Value with Univariate Measures (PT-186184994)

v3/cypress/e2e/adornments.spec.ts

@@ -213,14 +213,13 @@ context("Graph adornments", () => {
       .find("[data-testid=graph-adornments-grid__cell]").should("have.length", 1)
     cy.get("[data-testid=adornment-wrapper]").should("have.length", 1)
     cy.get("[data-testid=adornment-wrapper]").should("have.class", "visible")
-    cy.get("[data-testid=graph-adornments-grid]").find("*[data-testid^=plotted-value]").should("not.exist")
     cy.get("[data-testid=plotted-value-control-value]").click()
     cy.get("[data-testid=edit-formula-value-form]").find("[data-testid=formula-value-input]").type("10")
     cy.get("[data-testid=Apply-button]").click()
     cy.get("[data-testid=graph-adornments-grid]").find("*[data-testid^=plotted-value]").should("exist")
-    cy.get("[data-testid=plotted-value-line]").should("exist")
-    cy.get("[data-testid=plotted-value-cover]").should("exist")
-    cy.get("[data-testid=plotted-value-tip]").should("exist").should("have.text", "10")
+    cy.get("*[data-testid^=plotted-value-line]").should("exist")
+    cy.get("*[data-testid^=plotted-value-cover]").should("exist")
+    cy.get("*[data-testid^=plotted-value-tip]").should("exist").should("have.text", "value=10")
     // TODO: Also test the above after attributes are added to top and right axes
     // (i.e. when there are multiple plotted values)
   })
@@ -236,13 +235,15 @@ context("Graph adornments", () => {
     cy.get("[data-testid=edit-formula-value-form]").find("[data-testid=formula-value-input]").type("10")
     cy.get("[data-testid=Apply-button]").click()
     cy.get("[data-testid=graph-adornments-grid]").find("*[data-testid^=plotted-value]").should("exist")
-    cy.get("[data-testid=plotted-value-line]").should("exist")
-    cy.get("[data-testid=plotted-value-cover]").should("exist")
-    cy.get("[data-testid=plotted-value-tip]").should("exist").should("have.text", "10")
-    cy.dragAttributeToTarget("table", "Height", "y")
-    cy.get("[data-testid=plotted-value-line]").should("not.exist")
-    cy.get("[data-testid=plotted-value-cover]").should("not.exist")
-    cy.get("[data-testid=plotted-value-tip]").should("not.exist")
+    cy.get("*[data-testid^=plotted-value-line]").should("exist")
+    cy.get("*[data-testid^=plotted-value-cover]").should("exist")
+    cy.get("*[data-testid^=plotted-value-tip]").should("exist").should("have.text", "value=10")
+    cy.get("[data-testid=plotted-value-control-value]").click()
+    cy.get("[data-testid=edit-formula-value-form]").find("[data-testid=formula-value-input]").clear()
+    cy.get("[data-testid=Apply-button]").click()
+    cy.get("*[data-testid^=plotted-value-line]").should("not.exist")
+    cy.get("*[data-testid^=plotted-value-cover]").should("not.exist")
+    cy.get("*[data-testid^=plotted-value-tip]").should("not.exist")
   })
   it("adds a movable value to the graph when the Movable Value button is clicked", () => {
     c.selectTile("graph", 0)

v3/src/components/graph/adornments/adornment-types.ts

@@ -4,7 +4,8 @@ import { IMovableLineAdornmentModel, MovableLineAdornmentModel } from "./movable
 import { IMovablePointAdornmentModel, MovablePointAdornmentModel } from "./movable-point/movable-point-adornment-model"
 import { IMovableValueAdornmentModel, MovableValueAdornmentModel } from "./movable-value/movable-value-adornment-model"
 import { CountAdornmentModel, ICountAdornmentModel } from "./count/count-adornment-model"
-import { IPlottedValueAdornmentModel, PlottedValueAdornmentModel } from "./plotted-value/plotted-value-adornment-model"
+import { IPlottedValueAdornmentModel, PlottedValueAdornmentModel
+       } from "./univariate-measures/plotted-value/plotted-value-adornment-model"
 import { IMeanAdornmentModel, MeanAdornmentModel } from "./univariate-measures/mean/mean-adornment-model"
 import { IMedianAdornmentModel, MedianAdornmentModel } from "./univariate-measures/median/median-adornment-model"
 

v3/src/components/graph/adornments/univariate-measures/mean/mean-adornment-model.ts

@@ -1,14 +1,15 @@
 import { Instance, types } from "mobx-state-tree"
 import { mean } from "mathjs"
 import { UnivariateMeasureAdornmentModel } from "../univariate-measure-adornment-model"
-import { kMeanType } from "./mean-adornment-types"
+import { kMeanType, kMeanValueTitleKey } from "./mean-adornment-types"
 import { IDataConfigurationModel } from "../../../../data-display/models/data-configuration-model"
 import { IAdornmentModel } from "../../adornment-models"
 
 export const MeanAdornmentModel = UnivariateMeasureAdornmentModel
   .named("MeanAdornmentModel")
   .props({
-    type: types.optional(types.literal(kMeanType), kMeanType)
+    type: types.optional(types.literal(kMeanType), kMeanType),
+    labelTitle: types.optional(types.literal(kMeanValueTitleKey), kMeanValueTitleKey)
   })
   .views(self => ({
     computeMeasureValue(attrId: string, cellKey: Record<string, string>, dataConfig: IDataConfigurationModel) {

v3/src/components/graph/adornments/univariate-measures/mean/mean-adornment-types.ts

@@ -6,4 +6,4 @@ export const kMeanUndoAddKey = "DG.Undo.graph.showPlottedMean"
 export const kMeanRedoAddKey = "DG.Redo.graph.showPlottedMean"
 export const kMeanUndoRemoveKey = "DG.Undo.graph.hidePlottedMean"
 export const kMeanRedoRemoveKey = "DG.Redo.graph.hidePlottedMean"
-
+export const kMeanValueTitleKey = "DG.PlottedAverageAdornment.meanValueTitle"

v3/src/components/graph/adornments/univariate-measures/median/median-adornment-model.ts

@@ -1,14 +1,15 @@
 import { Instance, types } from "mobx-state-tree"
 import { median } from "mathjs"
 import { UnivariateMeasureAdornmentModel } from "../univariate-measure-adornment-model"
-import { kMedianType } from "./median-adornment-types"
+import { kMedianType, kMedianValueTitleKey } from "./median-adornment-types"
 import { IDataConfigurationModel } from "../../../../data-display/models/data-configuration-model"
 import { IAdornmentModel } from "../../adornment-models"
 
 export const MedianAdornmentModel = UnivariateMeasureAdornmentModel
   .named("MedianAdornmentModel")
   .props({
-    type: types.optional(types.literal(kMedianType), kMedianType)
+    type: types.optional(types.literal(kMedianType), kMedianType),
+    labelTitle: types.optional(types.literal(kMedianValueTitleKey), kMedianValueTitleKey)
   })
   .views(self => ({
     computeMeasureValue(attrId: string, cellKey: Record<string, string>, dataConfig: IDataConfigurationModel) {

v3/src/components/graph/adornments/univariate-measures/median/median-adornment-types.ts

@@ -6,3 +6,4 @@ export const kMedianUndoAddKey = "DG.Undo.graph.showPlottedMedian"
 export const kMedianRedoAddKey = "DG.Redo.graph.showPlottedMedian"
 export const kMedianUndoRemoveKey = "DG.Undo.graph.hidePlottedMedian"
 export const kMedianRedoRemoveKey = "DG.Redo.graph.hidePlottedMedian"
+export const kMedianValueTitleKey = "DG.PlottedAverageAdornment.medianValueTitle"

v3/src/components/graph/adornments/plotted-value/edit-formula-modal.tsx → v3/src/components/graph/adornments/univariate-measures/plotted-value/edit-formula-modal.tsx

@@ -3,13 +3,13 @@ import {
   Textarea, Tooltip
 } from "@chakra-ui/react"
 import React, { useState } from "react"
-import { CodapModal } from "../../../codap-modal"
-import t from "../../../../utilities/translation/translate"
+import { CodapModal } from "../../../../codap-modal"
+import t from "../../../../../utilities/translation/translate"
 
 interface IProps {
-  currentValue?: string | number
+  currentValue?: string
   isOpen: boolean
-  onClose: (value: number | string) => void
+  onClose: (value: string) => void
 }
 
 export const EditFormulaModal = ({ currentValue="", isOpen, onClose }: IProps) => {