Move main Scorer and Validator to PerseusScore

dev/flipbook.tsx

@@ -1,4 +1,5 @@
 /* eslint monorepo/no-internal-import: "off", monorepo/no-relative-import: "off", import/no-relative-packages: "off" */
+import {scorePerseusItem} from "@khanacademy/perseus-score";
 import Banner from "@khanacademy/wonder-blocks-banner";
 import Button from "@khanacademy/wonder-blocks-button";
 import {View} from "@khanacademy/wonder-blocks-core";
@@ -18,7 +19,6 @@ import {useEffect, useMemo, useReducer, useRef, useState} from "react";
 
 import {Renderer} from "../packages/perseus/src";
 import {SvgImage} from "../packages/perseus/src/components";
-import {scorePerseusItem} from "../packages/perseus/src/renderer-util";
 import {mockStrings} from "../packages/perseus/src/strings";
 import {isCorrect} from "../packages/perseus/src/util/scoring";
 import {trueForAllMafsSupportedGraphTypes} from "../packages/perseus/src/widgets/interactive-graphs/mafs-supported-graph-types";
@@ -324,7 +324,6 @@ function GradableRenderer(props: QuestionRendererProps) {
                                 const score = scorePerseusItem(
                                     question,
                                     rendererRef.current.getUserInputMap(),
-                                    mockStrings,
                                     "en",
                                 );
                                 setScore(score);

dev/package.json

@@ -19,6 +19,7 @@
         "@khanacademy/math-input": "^22.2.2",
         "@khanacademy/perseus-core": "3.3.0",
         "@khanacademy/perseus-linter": "^1.2.14",
+        "@khanacademy/perseus-score": "^2.0.0",
         "@khanacademy/pure-markdown": "^0.3.23",
         "@khanacademy/simple-markdown": "^0.13.16",
         "@khanacademy/wonder-blocks-banner": "4.0.5",

packages/perseus-core/src/index.ts

@@ -6,6 +6,7 @@ export type {
     MarkerType,
     InteractiveMarkerType,
     Relationship,
+    Alignment,
 } from "./types";
 export type {ErrorKind} from "./error/errors";
 export type {FunctionTypeMappingKeys} from "./utils/grapher-util";
@@ -110,8 +111,15 @@ export type {TableDefaultWidgetOptions} from "./widgets/table";
 export {default as videoLogic} from "./widgets/video";
 export type {VideoDefaultWidgetOptions} from "./widgets/video";
 
+export {
+    getUpgradedWidgetOptions,
+    upgradeWidgetInfoToLatestVersion,
+} from "./widgets/upgrade";
+
 export type * from "./widgets/logic-export.types";
 
+export * as WidgetLogic from "./widgets/widget-registry";
+
 export {default as getOrdererPublicWidgetOptions} from "./widgets/orderer/orderer-util";
 export {default as getCategorizerPublicWidgetOptions} from "./widgets/categorizer/categorizer-util";
 export {default as getExpressionPublicWidgetOptions} from "./widgets/expression/expression-util";

packages/perseus-core/src/types.ts

@@ -51,3 +51,12 @@ export type InteractiveMarkerType = MarkerType & {
 // Used for NumberLine
 // TODO: can this be merged with PerseusNumberLineWidgetOptions.correctRel?
 export type Relationship = "lt" | "gt" | "le" | "ge";
+
+export type Alignment =
+    | "default"
+    | "block"
+    | "inline-block"
+    | "inline"
+    | "float-left"
+    | "float-right"
+    | "full-width";

packages/perseus-core/src/widgets/cs-program/index.ts

@@ -25,6 +25,7 @@ const defaultWidgetOptions: CSProgramDefaultWidgetOptions = {
 const csProgramWidgetLogic: WidgetLogic = {
     name: "cs-program",
     defaultWidgetOptions,
+    supportedAlignments: ["block", "full-width"],
 };
 
 export default csProgramWidgetLogic;

packages/perseus-core/src/widgets/definition/index.ts

@@ -14,6 +14,7 @@ const defaultWidgetOptions: DefinitionDefaultWidgetOptions = {
 const definitionWidgetLogic: WidgetLogic = {
     name: "definition",
     defaultWidgetOptions,
+    defaultAlignment: "inline",
 };
 
 export default definitionWidgetLogic;

packages/perseus-core/src/widgets/dropdown/index.ts

@@ -19,6 +19,7 @@ const defaultWidgetOptions: DropdownDefaultWidgetOptions = {
 const dropdownWidgetLogic: WidgetLogic = {
     name: "definition",
     defaultWidgetOptions,
+    defaultAlignment: "inline-block",
 };
 
 export default dropdownWidgetLogic;

packages/perseus-core/src/widgets/explanation/index.ts

@@ -16,6 +16,7 @@ const defaultWidgetOptions: ExplanationDefaultWidgetOptions = {
 const explanationWidgetLogic: WidgetLogic = {
     name: "explanation",
     defaultWidgetOptions,
+    defaultAlignment: "inline",
 };
 
 export default explanationWidgetLogic;

packages/perseus-core/src/widgets/expression/index.ts

@@ -13,6 +13,7 @@ const expressionWidgetLogic: WidgetLogic = {
     version: currentVersion,
     widgetOptionsUpgrades: widgetOptionsUpgrades,
     defaultWidgetOptions: defaultWidgetOptions,
+    defaultAlignment: "inline-block",
 };
 
 export default expressionWidgetLogic;

packages/perseus-core/src/widgets/graded-group-set/index.ts

@@ -10,9 +10,9 @@ const defaultWidgetOptions: GradedGroupSetDefaultWidgetOptions = {
     gradedGroups: [],
 };
 
-const GradedGroupSetWidgetLogic: WidgetLogic = {
+const gradedGroupSetWidgetLogic: WidgetLogic = {
     name: "graded-group-set",
     defaultWidgetOptions,
 };
 
-export default GradedGroupSetWidgetLogic;
+export default gradedGroupSetWidgetLogic;

packages/perseus-core/src/widgets/graded-group/index.ts

@@ -14,9 +14,9 @@ const defaultWidgetOptions: GradedGroupDefaultWidgetOptions = {
     hint: null,
 };
 
-const GradedGroupWidgetLogic: WidgetLogic = {
+const gradedGroupWidgetLogic: WidgetLogic = {
     name: "graded-group",
     defaultWidgetOptions,
 };
 
-export default GradedGroupWidgetLogic;
+export default gradedGroupWidgetLogic;

packages/perseus-core/src/widgets/group/index.ts

@@ -15,9 +15,9 @@ const defaultWidgetOptions: GroupDefaultWidgetOptions = {
     metadata: undefined,
 };
 
-const GroupWidgetLogic: WidgetLogic = {
+const groupWidgetLogic: WidgetLogic = {
     name: "group",
     defaultWidgetOptions,
 };
 
-export default GroupWidgetLogic;
+export default groupWidgetLogic;

packages/perseus-core/src/widgets/image/index.ts

@@ -26,6 +26,8 @@ const defaultWidgetOptions: ImageDefaultWidgetOptions = {
 const imageWidgetLogic: WidgetLogic = {
     name: "image",
     defaultWidgetOptions,
+    supportedAlignments: ["block", "full-width"],
+    defaultAlignment: "block",
 };
 
 export default imageWidgetLogic;

packages/perseus-core/src/widgets/input-number/index.ts

@@ -25,6 +25,7 @@ const defaultWidgetOptions: InputNumberDefaultWidgetOptions = {
 const inputNumberWidgetLogic: WidgetLogic = {
     name: "input-number",
     defaultWidgetOptions,
+    defaultAlignment: "inline-block",
 };
 
 export default inputNumberWidgetLogic;

packages/perseus-core/src/widgets/logic-export.types.ts

@@ -1,4 +1,5 @@
 import type {Version} from "../data-schema";
+import type {Alignment} from "../types";
 
 export type WidgetOptionsUpgradeMap = {
     // OldProps => NewProps,
@@ -10,4 +11,6 @@ export type WidgetLogic = {
     version?: Version;
     widgetOptionsUpgrades?: WidgetOptionsUpgradeMap;
     defaultWidgetOptions?: any;
+    supportedAlignments?: ReadonlyArray<Alignment>;
+    defaultAlignment?: Alignment;
 };

packages/perseus-core/src/widgets/numeric-input/index.ts

@@ -27,6 +27,7 @@ const defaultWidgetOptions: NumericInputDefaultWidgetOptions = {
 const numericInputWidgetLogic: WidgetLogic = {
     name: "numeric-input",
     defaultWidgetOptions,
+    defaultAlignment: "inline-block",
 };
 
 export default numericInputWidgetLogic;

packages/perseus-core/src/widgets/passage-ref-target/index.ts

@@ -13,6 +13,7 @@ const defaultWidgetOptions: PassageRefTargetDefaultWidgetOptions = {
 const passageRefTargetWidgetLogic: WidgetLogic = {
     name: "passageRefTarget",
     defaultWidgetOptions,
+    defaultAlignment: "inline",
 };
 
 export default passageRefTargetWidgetLogic;

packages/perseus-core/src/widgets/passage-ref/index.ts

@@ -8,6 +8,7 @@ const passageRefWidgetLogic: WidgetLogic = {
     name: "passageRef",
     version: currentVersion,
     defaultWidgetOptions: defaultWidgetOptions,
+    defaultAlignment: "inline",
 };
 
 export default passageRefWidgetLogic;

packages/perseus-core/src/widgets/phet-simulation/index.ts

@@ -11,9 +11,9 @@ const defaultWidgetOptions: PhetSimulationDefaultWidgetOptions = {
     description: "",
 };
 
-const PhetSimulationWidgetLogic: WidgetLogic = {
+const phetSimulationWidgetLogic: WidgetLogic = {
     name: "phet-simulation",
     defaultWidgetOptions,
 };
 
-export default PhetSimulationWidgetLogic;
+export default phetSimulationWidgetLogic;

packages/perseus-core/src/widgets/upgrade.ts

@@ -0,0 +1,158 @@
+import _ from "underscore";
+
+import {Errors} from "../error/errors";
+import {PerseusError} from "../error/perseus-error";
+import {mapObject} from "../utils/objective_";
+
+import {
+    getCurrentVersion,
+    getDefaultWidgetOptions,
+    getSupportedAlignments,
+    getWidgetOptionsUpgrades,
+    isWidgetRegistered,
+} from "./widget-registry";
+
+import type {PerseusWidget, PerseusWidgetsMap} from "../data-schema";
+
+const DEFAULT_STATIC = false;
+
+export const upgradeWidgetInfoToLatestVersion = (
+    oldWidgetInfo: PerseusWidget,
+): PerseusWidget => {
+    const type = oldWidgetInfo.type;
+    // NOTE(jeremy): This looks like it could be replaced by fixing types so
+    // that `type` is non-optional. But we're seeing this in Sentry today so I
+    // suspect we have legacy data (potentially unpublished) and we should
+    // figure that out before depending solely on types.
+    if (!_.isString(type)) {
+        throw new PerseusError(
+            "widget type must be a string, but was: " + type,
+            Errors.Internal,
+        );
+    }
+
+    if (!isWidgetRegistered(type)) {
+        // If we have a widget that isn't registered, we can't upgrade it
+        // TODO(aria): Figure out what the best thing to do here would be
+        return oldWidgetInfo;
+    }
+
+    // Unversioned widgets (pre-July 2014) are all implicitly 0.0
+    const initialVersion = oldWidgetInfo.version || {major: 0, minor: 0};
+    const latestVersion = getCurrentVersion(type);
+
+    // If the widget version is later than what we understand (major
+    // version is higher than latest, or major versions are equal and minor
+    // version is higher than latest), don't perform any upgrades.
+    if (
+        initialVersion.major > latestVersion.major ||
+        (initialVersion.major === latestVersion.major &&
+            initialVersion.minor > latestVersion.minor)
+    ) {
+        return oldWidgetInfo;
+    }
+
+    // We do a clone here so that it's safe to mutate the input parameter
+    // in propUpgrades functions (which I will probably accidentally do at
+    // some point, and we would like to not break when that happens).
+    let newEditorOptions = _.clone(oldWidgetInfo.options) || {};
+
+    const upgradePropsMap = getWidgetOptionsUpgrades(type);
+
+    // Empty props usually mean a newly created widget by the editor,
+    // and are always considerered up-to-date.
+    // Mostly, we'd rather not run upgrade functions on props that are
+    // not complete.
+    if (_.keys(newEditorOptions).length !== 0) {
+        // We loop through all the versions after the current version of
+        // the loaded widget, up to and including the latest version of the
+        // loaded widget, and run the upgrade function to bring our loaded
+        // widget's props up to that version.
+        // There is a little subtlety here in that we call
+        // upgradePropsMap[1] to upgrade *to* version 1,
+        // (not from version 1).
+        for (
+            let nextVersion = initialVersion.major + 1;
+            nextVersion <= latestVersion.major;
+            nextVersion++
+        ) {
+            if (upgradePropsMap[String(nextVersion)]) {
+                newEditorOptions =
+                    upgradePropsMap[String(nextVersion)](newEditorOptions);
+            } else {
+                throw new PerseusError(
+                    "No upgrade found for widget. Cannot render.",
+                    Errors.Internal,
+                    {
+                        metadata: {
+                            type,
+                            fromMajorVersion: nextVersion - 1,
+                            toMajorVersion: nextVersion,
+                        },
+                    },
+                );
+            }
+        }
+    }
+
+    // Minor version upgrades (eg. new optional props) don't have
+    // transform functions. Instead, we fill in the new props with their
+    // defaults.
+    const defaultOptions = getDefaultWidgetOptions(type);
+    newEditorOptions = {
+        ...defaultOptions,
+        ...newEditorOptions,
+    };
+
+    let alignment = oldWidgetInfo.alignment;
+
+    // Widgets that support multiple alignments will "lock in" the
+    // alignment to the alignment that would be listed first in the
+    // select box. If the widget only supports one alignment, the
+    // alignment value will likely just end up as "default".
+    if (alignment == null || alignment === "default") {
+        alignment = getSupportedAlignments(type)[0];
+    }
+
+    let widgetStatic = oldWidgetInfo.static;
+
+    if (widgetStatic == null) {
+        widgetStatic = DEFAULT_STATIC;
+    }
+
+    return _.extend({}, oldWidgetInfo, {
+        // maintain other info, like type
+        // After upgrading we guarantee that the version is up-to-date
+        version: latestVersion,
+        // Default graded to true (so null/undefined becomes true):
+        graded: oldWidgetInfo.graded != null ? oldWidgetInfo.graded : true,
+        alignment: alignment,
+        static: widgetStatic,
+        options: newEditorOptions,
+    });
+};
+
+export function getUpgradedWidgetOptions(
+    oldWidgetOptions: PerseusWidgetsMap,
+): PerseusWidgetsMap {
+    return mapObject(oldWidgetOptions, (widgetInfo, widgetId) => {
+        if (!widgetInfo.type || !widgetInfo.alignment) {
+            const newValues: Record<string, any> = {};
+
+            if (!widgetInfo.type) {
+                // TODO: why does widget have no type?
+                // We don't want to derive type from widget ID
+                // see: LEMS-1845
+                newValues.type = widgetId.split(" ")[0];
+            }
+
+            if (!widgetInfo.alignment) {
+                newValues.alignment = "default";
+            }
+
+            widgetInfo = {...widgetInfo, ...newValues};
+        }
+
+        return upgradeWidgetInfoToLatestVersion(widgetInfo) as any;
+    });
+}

packages/perseus-core/src/widgets/video/index.ts

@@ -13,6 +13,8 @@ const defaultWidgetOptions: VideoDefaultWidgetOptions = {
 const videoWidgetLogic: WidgetLogic = {
     name: "video",
     defaultWidgetOptions,
+    supportedAlignments: ["block", "float-left", "float-right", "full-width"],
+    defaultAlignment: "block",
 };
 
 export default videoWidgetLogic;