wip: reducer tests

Khan · Aug 27, 2024 · 7793c9b · 7793c9b
1 parent 1a4b68a
commit 7793c9b
Show file tree

Hide file tree

Showing 3 changed files with 65 additions and 5 deletions.
diff --git a/packages/perseus/src/widgets/interactive-graphs/graphs/components/movable-point-view.tsx b/packages/perseus/src/widgets/interactive-graphs/graphs/components/movable-point-view.tsx
@@ -3,8 +3,6 @@ import {color as WBColor} from "@khanacademy/wonder-blocks-tokens";
 import * as React from "react";
 import {forwardRef} from "react";
 
-import {InlineIcon} from "../../../../components";
-import {iconTrash} from "../../../../icon-paths";
 import useGraphConfig from "../../reducer/use-graph-config";
 import {useTransformVectorsToPixels} from "../use-transform";
 
@@ -68,7 +66,7 @@ export const MovablePointView = forwardRef(
         const [[_, horizontalStartY]] = useTransformVectorsToPixels([0, yMin]);
         const [[__, horizontalEndY]] = useTransformVectorsToPixels([0, yMax]);
 
-        const showHairlines = dragging && markings !== "none";
+        const showHairlines = true; //dragging && markings !== "none";
         const hairlines = (
             <g>
                 <line

diff --git a/packages/perseus/src/widgets/interactive-graphs/reducer/interactive-graph-reducer.test.ts b/packages/perseus/src/widgets/interactive-graphs/reducer/interactive-graph-reducer.test.ts
@@ -6,7 +6,11 @@ import {changeSnapStep, changeRange, actions} from "./interactive-graph-action";
 import {interactiveGraphReducer} from "./interactive-graph-reducer";
 
 import type {GraphRange} from "../../../perseus-types";
-import type {CircleGraphState, InteractiveGraphState} from "../types";
+import type {
+    CircleGraphState,
+    PointGraphState,
+    InteractiveGraphState,
+} from "../types";
 
 const baseSegmentGraphState: InteractiveGraphState = {
     hasBeenInteractedWith: false,
@@ -30,6 +34,18 @@ const basePointGraphState: InteractiveGraphState = {
     coords: [],
 };
 
+const baseUnlimitedPointGraphState: PointGraphState = {
+    hasBeenInteractedWith: false,
+    type: "point",
+    numPoints: "unlimited",
+    range: [
+        [-10, 10],
+        [-10, 10],
+    ],
+    snapStep: [1, 1],
+    coords: [],
+};
+
 const baseAngleGraphState: InteractiveGraphState = {
     hasBeenInteractedWith: false,
     type: "angle",
@@ -953,3 +969,49 @@ describe("doMoveRadiusPoint", () => {
         ).toThrow();
     });
 });
+
+describe("unlimited points", () => {
+    it("adds points", () => {
+        const state: PointGraphState = {
+            ...baseUnlimitedPointGraphState,
+        };
+
+        const stateAfterAddingPoint = interactiveGraphReducer(
+            state,
+            actions.pointGraph.addPoint([8, 10]),
+        ) as PointGraphState;
+
+        expect(stateAfterAddingPoint.coords).toMatchObject([[8, 10]]);
+    });
+
+    it("removes points", () => {
+        let state: PointGraphState = {
+            ...baseUnlimitedPointGraphState,
+        };
+
+        state = interactiveGraphReducer(
+            state,
+            actions.pointGraph.addPoint([1, 1]),
+        ) as PointGraphState;
+
+        state = interactiveGraphReducer(
+            state,
+            actions.pointGraph.addPoint([2, 2]),
+        ) as PointGraphState;
+
+        state = interactiveGraphReducer(
+            state,
+            actions.pointGraph.addPoint([3, 3]),
+        ) as PointGraphState;
+
+        state = interactiveGraphReducer(
+            state,
+            actions.pointGraph.removePoint(1),
+        ) as PointGraphState;
+
+        expect(state.coords).toMatchObject([
+            [1, 1],
+            [3, 3],
+        ]);
+    });
+});
diff --git a/packages/perseus/src/widgets/interactive-graphs/reducer/interactive-graph-reducer.ts b/packages/perseus/src/widgets/interactive-graphs/reducer/interactive-graph-reducer.ts
@@ -41,7 +41,7 @@ import {
     ADD_POINT,
     type AddPoint,
     REMOVE_POINT,
-    RemovePoint,
+    type RemovePoint,
 } from "./interactive-graph-action";
 
 import type {Coord} from "../../../interactive2/types";