Skip to content

Commit

Permalink
Now that the remount issue was fixed in an earlier PR, we don't need …
Browse files Browse the repository at this point in the history 
…startCoords as a separate prop
  • Loading branch information
@nishasy
nishasy committed Jul 1, 2024
1 parent 5aa91e5 commit 16095ae
Show file tree
Hide file tree
Showing 8 changed files with 32 additions and 90 deletions.
4 changes: 2 additions & 2 deletions packages/perseus-editor/src/components/__tests__/start-coord-settings.test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -60,7 +60,7 @@ describe("StartCoordSettings", () => {
type
${"linear"}
${"ray"}
`(`graphs with CollinearTuple startCoords`, ({type}) => {
`(`graphs with CollinearTuple coords`, ({type}) => {
test(`shows the start coordinates UI for ${type}`, () => {
// Arrange

Expand Down Expand Up @@ -131,7 +131,7 @@ describe("StartCoordSettings", () => {
render(
<StartCoordSettings
{...defaultProps}
startCoords={[
coords={[
[-15, 15],
[15, 15],
]}
Expand Down
22 changes: 9 additions & 13 deletions packages/perseus-editor/src/components/start-coord-settings.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,17 +20,17 @@ import type {
type Props = PerseusGraphType & {
range: [x: Range, y: Range];
step: [x: number, y: number];
onChange: (startCoords: CollinearTuple) => void;
onChange: (coords: CollinearTuple) => void;
};

type PropsInner = {
type: PerseusGraphType["type"];
startCoords: CollinearTuple;
onChange: (startCoords: CollinearTuple) => void;
coords: CollinearTuple;
onChange: (coords: CollinearTuple) => void;
};

const StartCoordSettingsInner = (props: PropsInner) => {
const {type, startCoords, onChange} = props;
const {type, coords, onChange} = props;

// Check if coords is of type CollinearTuple
switch (type) {
Expand All @@ -41,19 +41,15 @@ const StartCoordSettingsInner = (props: PropsInner) => {
<View style={styles.tile}>
<LabelLarge>Point 1</LabelLarge>
<CoordinatePairInput
coord={startCoords[0]}
onChange={(value) =>
onChange([value, startCoords[1]])
}
coord={coords[0]}
onChange={(value) => onChange([value, coords[1]])}
/>
</View>
<View style={styles.tile}>
<LabelLarge>Point 2</LabelLarge>
<CoordinatePairInput
coord={startCoords[1]}
onChange={(value) =>
onChange([startCoords[0], value])
}
coord={coords[1]}
onChange={(value) => onChange([coords[0], value])}
/>
</View>
</>
Expand Down Expand Up @@ -87,7 +83,7 @@ const StartCoordSettings = (props: Props) => {
<>
<StartCoordSettingsInner
type={type}
startCoords={props.startCoords ?? defaultStartCoords}
coords={props.coords ?? defaultStartCoords}
onChange={onChange}
/>

Expand Down
7 changes: 5 additions & 2 deletions packages/perseus-editor/src/widgets/interactive-graph-editor.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -669,7 +669,7 @@ class InteractiveGraphEditor extends React.Component<Props> {

const graph = {
...this.props.graph,
startCoords: coords,
coords: coords,
};
this.props.onChange({graph: graph});
};
Expand Down Expand Up @@ -700,7 +700,10 @@ class InteractiveGraphEditor extends React.Component<Props> {
_.extend(json, {
graph: {
type: correct.type,
startCoords: this.props.graph?.startCoords,
coords:
this.props.graph?.type === "circle"
? this.props.graph.center
: this.props.graph?.coords,
},
correct: correct,
});
Expand Down
20 changes: 0 additions & 20 deletions packages/perseus/src/perseus-types.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -763,41 +763,31 @@ export type PerseusGraphTypeAngle = {
match?: "congruent";
// must have 3 coords - ie [Coord, Coord, Coord]
coords?: ReadonlyArray<Coord>;
// The initial coordinates the graph renders with.
startCoords?: ReadonlyArray<Coord>;
};

export type PerseusGraphTypeCircle = {
type: "circle";
center?: Coord;
radius?: number;
// The initial coordinates the graph renders with.
startCoords?: Coord;
} & PerseusGraphTypeCommon;

export type PerseusGraphTypeLinear = {
type: "linear";
// expects 2 coords
coords?: CollinearTuple;
// The initial coordinates the graph renders with.
startCoords?: CollinearTuple;
} & PerseusGraphTypeCommon;

export type PerseusGraphTypeLinearSystem = {
type: "linear-system";
// expects 2 sets of 2 coords
coords?: CollinearTuple[];
// The initial coordinates the graph renders with.
startCoords?: CollinearTuple[];
} & PerseusGraphTypeCommon;

export type PerseusGraphTypePoint = {
type: "point";
// The number of points if a "point" type. default: 1. "unlimited" if no limit
numPoints?: number | "unlimited";
coords?: ReadonlyArray<Coord>;
// The initial coordinates the graph renders with.
startCoords?: ReadonlyArray<Coord>;
} & PerseusGraphTypeCommon;

export type PerseusGraphTypePolygon = {
Expand All @@ -813,16 +803,12 @@ export type PerseusGraphTypePolygon = {
// How to match the answer. If missing, defaults to exact matching.
match?: "similar" | "congruent" | "approx";
coords?: ReadonlyArray<Coord>;
// The initial coordinates the graph renders with.
startCoords?: ReadonlyArray<Coord>;
} & PerseusGraphTypeCommon;

export type PerseusGraphTypeQuadratic = {
type: "quadratic";
// expects a list of 3 coords
coords?: [Coord, Coord, Coord];
// The initial coordinates the graph renders with.
startCoords?: [Coord, Coord, Coord];
} & PerseusGraphTypeCommon;

export type PerseusGraphTypeSegment = {
Expand All @@ -831,24 +817,18 @@ export type PerseusGraphTypeSegment = {
numSegments?: number;
// Expects a list of Coord tuples. Length should match the `numSegments` value.
coords?: CollinearTuple[];
// The initial coordinates the graph renders with.
startCoords?: CollinearTuple[];
} & PerseusGraphTypeCommon;

export type PerseusGraphTypeSinusoid = {
type: "sinusoid";
// Expects a list of 2 Coords
coords?: ReadonlyArray<Coord>;
// The initial coordinates the graph renders with.
startCoords?: ReadonlyArray<Coord>;
} & PerseusGraphTypeCommon;

export type PerseusGraphTypeRay = {
type: "ray";
// Expects a list of 2 Coords
coords?: CollinearTuple;
// The initial coordinates the graph renders with.
startCoords?: CollinearTuple;
} & PerseusGraphTypeCommon;

export type PerseusLabelImageWidgetOptions = {
Expand Down
16 changes: 8 additions & 8 deletions packages/perseus/src/widgets/interactive-graphs/interactive-graph-question-builder.test.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -109,7 +109,7 @@ describe("InteractiveGraphQuestionBuilder", () => {
graph: {
type: "segment",
numSegments: 1,
startCoords: [
coords: [
[
[0, 0],
[2, 2],
Expand Down Expand Up @@ -150,7 +150,7 @@ describe("InteractiveGraphQuestionBuilder", () => {
graph: {
type: "segment",
numSegments: 2,
startCoords: [
coords: [
[
[0, 0],
[2, 2],
Expand Down Expand Up @@ -211,7 +211,7 @@ describe("InteractiveGraphQuestionBuilder", () => {
expect.objectContaining({
graph: {
type: "linear",
startCoords: [
coords: [
[3, 0],
[3, 3],
],
Expand Down Expand Up @@ -270,7 +270,7 @@ describe("InteractiveGraphQuestionBuilder", () => {
expect.objectContaining({
graph: {
type: "linear-system",
startCoords: [
coords: [
[
[-3, 0],
[-3, 3],
Expand Down Expand Up @@ -329,7 +329,7 @@ describe("InteractiveGraphQuestionBuilder", () => {
expect.objectContaining({
graph: {
type: "ray",
startCoords: [
coords: [
[3, 0],
[3, 3],
],
Expand Down Expand Up @@ -365,7 +365,7 @@ describe("InteractiveGraphQuestionBuilder", () => {
const graph = question.widgets["interactive-graph 1"];
expect(graph.options).toEqual(
expect.objectContaining({
graph: {type: "circle", startCoords: [9, 9], radius: 5},
graph: {type: "circle", center: [9, 9], radius: 5},
correct: {type: "circle", radius: 5, center: [0, 0]},
}),
);
Expand Down Expand Up @@ -404,7 +404,7 @@ describe("InteractiveGraphQuestionBuilder", () => {
expect.objectContaining({
graph: {
type: "quadratic",
startCoords: [
coords: [
[-1, -1],
[0, 0],
[1, -1],
Expand Down Expand Up @@ -453,7 +453,7 @@ describe("InteractiveGraphQuestionBuilder", () => {
expect.objectContaining({
graph: {
type: "sinusoid",
startCoords: [
coords: [
[0, 0],
[1, -1],
],
Expand Down
14 changes: 7 additions & 7 deletions packages/perseus/src/widgets/interactive-graphs/interactive-graph-question-builder.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -290,7 +290,7 @@ class SegmentGraphConfig implements InteractiveFigureConfig {
return {
type: "segment",
numSegments: this.numSegments,
startCoords: this.startCoords,
coords: this.startCoords,
};
}
}
Expand All @@ -313,7 +313,7 @@ class LinearConfig implements InteractiveFigureConfig {
}

graph(): PerseusGraphType {
return {type: "linear", startCoords: this.startCoords};
return {type: "linear", coords: this.startCoords};
}
}

Expand Down Expand Up @@ -341,7 +341,7 @@ class LinearSystemConfig implements InteractiveFigureConfig {
}

graph(): PerseusGraphType {
return {type: "linear-system", startCoords: this.startCoords};
return {type: "linear-system", coords: this.startCoords};
}
}

Expand All @@ -363,7 +363,7 @@ class RayConfig implements InteractiveFigureConfig {
}

graph(): PerseusGraphType {
return {type: "ray", startCoords: this.startCoords};
return {type: "ray", coords: this.startCoords};
}
}

Expand All @@ -380,7 +380,7 @@ class CircleGraphConfig implements InteractiveFigureConfig {

graph(): PerseusGraphType {
if (this.startCoords) {
return {type: "circle", startCoords: this.startCoords, radius: 5};
return {type: "circle", center: this.startCoords, radius: 5};
}

return {type: "circle"};
Expand All @@ -406,7 +406,7 @@ class QuadraticConfig implements InteractiveFigureConfig {
}

graph(): PerseusGraphType {
return {type: "quadratic", startCoords: this.startCoords};
return {type: "quadratic", coords: this.startCoords};
}
}

Expand All @@ -428,7 +428,7 @@ class SinusoidGraphConfig implements InteractiveFigureConfig {
}

graph(): PerseusGraphType {
return {type: "sinusoid", startCoords: this.startCoords};
return {type: "sinusoid", coords: this.startCoords};
}
}

Expand Down
2 changes: 1 addition & 1 deletion packages/perseus/src/widgets/interactive-graphs/mafs-graph.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -158,7 +158,7 @@ export const StatefulMafsGraph = React.forwardRef<
const snapTo = graph.type === "polygon" ? graph.snapTo : null;
const showAngles = graph.type === "polygon" ? graph.showAngles : null;
const showSides = graph.type === "polygon" ? graph.showSides : null;
const startCoords = graph.startCoords ?? null;
const startCoords = graph.type === "circle" ? graph.center : graph.coords;

const originalPropsRef = useRef(props);
const latestPropsRef = useLatestRef(props);
Expand Down
Loading

0 comments on commit 16095ae

Please sign in to comment.