Skip to content

Commit

Permalink
Create helper to build public widget options for Sorter (#2154)
Browse files Browse the repository at this point in the history
## Summary:
Adds a function that takes Sorter's full widget options and filters out answer data. It also adds this function to Sorter's widget export and adds a test confirming the function does what is expected.

Issue: LEMS-2765

## Test plan:
- Confirm all checks pass
- Confirm Sorter still works as expected

Author: Myranae

Reviewers: Myranae, benchristel, handeyeco, jeremywiebe

Required Reviewers:

Approved By: jeremywiebe

Checks: ✅ Publish npm snapshot (ubuntu-latest, 20.x), ✅ Lint, Typecheck, Format, and Test (ubuntu-latest, 20.x), ✅ Check builds for changes in size (ubuntu-latest, 20.x), ✅ Cypress (ubuntu-latest, 20.x), ✅ Publish Storybook to Chromatic (ubuntu-latest, 20.x), ✅ Check for .changeset entries for all changed files (ubuntu-latest, 20.x)

Pull Request URL: #2154
  • Loading branch information
Myranae authored Jan 30, 2025
1 parent c72166c commit a21fd90
Show file tree
Hide file tree
Showing 6 changed files with 69 additions and 2 deletions.
6 changes: 6 additions & 0 deletions .changeset/beige-glasses-reflect.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
---
"@khanacademy/perseus": minor
"@khanacademy/perseus-core": minor
---

Implement a widget export function to filter out rubric data from widget options for the Sorter widget
1 change: 1 addition & 0 deletions packages/perseus-core/src/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -116,3 +116,4 @@ export {default as getOrdererPublicWidgetOptions} from "./widgets/orderer/ordere
export {default as getCategorizerPublicWidgetOptions} from "./widgets/categorizer/categorizer-util";
export {default as getExpressionPublicWidgetOptions} from "./widgets/expression/expression-util";
export {default as getLabelImagePublicWidgetOptions} from "./widgets/label-image/label-image-util";
export {default as getSorterPublicWidgetOptions} from "./widgets/sorter/sorter-util";
24 changes: 24 additions & 0 deletions packages/perseus-core/src/widgets/sorter/sorter-util.test.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
import getSorterPublicWidgetOptions from "./sorter-util";

import type {PerseusSorterWidgetOptions} from "../../data-schema";

describe("getSorterPublicWidgetOptions", () => {
it("should return the correct public options without any answer data", () => {
// Arrange
const options: PerseusSorterWidgetOptions = {
correct: ["$15$ grams", "$55$ grams", "$0.005$ kilograms"],
layout: "horizontal",
padding: true,
};

// Act
const publicWidgetOptions = getSorterPublicWidgetOptions(options);

// Assert
expect(publicWidgetOptions).toEqual({
correct: ["$0.005$ kilograms", "$15$ grams", "$55$ grams"],
layout: "horizontal",
padding: true,
});
});
});
30 changes: 30 additions & 0 deletions packages/perseus-core/src/widgets/sorter/sorter-util.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
import type {PerseusSorterWidgetOptions} from "@khanacademy/perseus-core";

/**
* For details on the individual options, see the
* PerseusSorterWidgetOptions type
*/
type SorterPublicWidgetOptions = {
correct: PerseusSorterWidgetOptions["correct"];
padding: PerseusSorterWidgetOptions["padding"];
layout: PerseusSorterWidgetOptions["layout"];
};

/**
* Given a PerseusSorterWidgetOptions object, return a new object with only
* the public options that should be exposed to the client.
*/
function getSorterPublicWidgetOptions(
options: PerseusSorterWidgetOptions,
): SorterPublicWidgetOptions {
return {
// Note(Tamara): This does not provide correct answer information any longer.
// To maintain compatibility with the original widget options, we are
// keeping the key the same. Represents initial state of the cards here.
correct: options.correct.slice().sort(),
padding: options.padding,
layout: options.layout,
};
}

export default getSorterPublicWidgetOptions;
4 changes: 3 additions & 1 deletion packages/perseus/src/types.ts
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,7 @@ import type {
getOrdererPublicWidgetOptions,
getCategorizerPublicWidgetOptions,
getExpressionPublicWidgetOptions,
getSorterPublicWidgetOptions,
} from "@khanacademy/perseus-core";
import type {LinterContextProps} from "@khanacademy/perseus-linter";
import type {
Expand Down Expand Up @@ -545,7 +546,8 @@ export type PublicWidgetOptionsFunction =
| typeof getCategorizerPublicWidgetOptions
| typeof getOrdererPublicWidgetOptions
| typeof getExpressionPublicWidgetOptions
| typeof getLabelImagePublicWidgetOptions;
| typeof getLabelImagePublicWidgetOptions
| typeof getSorterPublicWidgetOptions;

export type WidgetExports<
T extends React.ComponentType<any> & Widget = React.ComponentType<any>,
Expand Down
6 changes: 5 additions & 1 deletion packages/perseus/src/widgets/sorter/sorter.tsx
Original file line number Diff line number Diff line change
@@ -1,3 +1,7 @@
import {
type PerseusSorterWidgetOptions,
getSorterPublicWidgetOptions,
} from "@khanacademy/perseus-core";
import {linterContextDefault} from "@khanacademy/perseus-linter";
import {scoreSorter, validateSorter} from "@khanacademy/perseus-score";
import * as React from "react";
Expand All @@ -9,7 +13,6 @@ import {getPromptJSON as _getPromptJSON} from "../../widget-ai-utils/sorter/sort
import type {SortableOption} from "../../components/sortable";
import type {Widget, WidgetExports, WidgetProps} from "../../types";
import type {SorterPromptJSON} from "../../widget-ai-utils/sorter/sorter-ai-utils";
import type {PerseusSorterWidgetOptions} from "@khanacademy/perseus-core";
import type {
PerseusSorterRubric,
PerseusSorterUserInput,
Expand Down Expand Up @@ -138,4 +141,5 @@ export default {
// TODO(LEMS-2656): remove TS suppression
// @ts-expect-error: Type UserInput is not assignable to type PerseusSorterUserInput
validator: validateSorter,
getPublicWidgetOptions: getSorterPublicWidgetOptions,
} satisfies WidgetExports<typeof Sorter>;

0 comments on commit a21fd90

Please sign in to comment.