Remove Util.DeprecationMixin (#1588)

## Summary:
`Util.DeprecationMixin` was only being used to remove a deprecated `showGraph`
prop from the InteractiveGraph widget and its editor component. `showGraph` no
longer appears anywhere in our content, so the "mixin" (which, given the
naming, is likely a relic from the `React.createClass` era) is not needed
anymore.

Issue: none

## Test plan:
Edit and save an interactive graph in the editor.

Author: benchristel

Reviewers: handeyeco, jeremywiebe, nishasy

Required Reviewers:

Approved By: handeyeco

Checks: ❌ codecov/project, ✅ codecov/patch, ✅ Upload Coverage (ubuntu-latest, 20.x), ✅ Publish npm snapshot (ubuntu-latest, 20.x), ✅ Lint, Typecheck, Format, and Test (ubuntu-latest, 20.x), ✅ Check for .changeset entries for all changed files (ubuntu-latest, 20.x), ✅ Jest Coverage (ubuntu-latest, 20.x), ✅ Cypress (ubuntu-latest, 20.x), ✅ Publish Storybook to Chromatic (ubuntu-latest, 20.x), ✅ Check builds for changes in size (ubuntu-latest, 20.x), ✅ gerald

Pull Request URL: #1588

.changeset/nervous-singers-reply.md

@@ -0,0 +1,6 @@
+---
+"@khanacademy/perseus": patch
+"@khanacademy/perseus-editor": patch
+---
+
+Remove unused handling of deprecated Interactive Graph prop

packages/perseus-editor/src/widgets/interactive-graph-editor.tsx

@@ -1,4 +1,3 @@
-/* eslint-disable react/no-unsafe */
 import {vector as kvector} from "@khanacademy/kmath";
 import {
     components,
@@ -37,7 +36,6 @@ import type {PropsFor} from "@khanacademy/wonder-blocks-core";
 
 const {InfoTip} = components;
 const {containerSizeClass, getInteractiveBoxFromSizeClass} = SizingUtils;
-const DeprecationMixin = Util.DeprecationMixin;
 const InteractiveGraph = InteractiveGraphWidget.widget;
 
 type InteractiveGraphProps = PropsFor<typeof InteractiveGraph>;
@@ -46,12 +44,6 @@ const defaultBackgroundImage = {
     url: null,
 } as const;
 
-const deprecatedProps = {
-    showGraph: function (props) {
-        return {markings: props.showGraph ? "graph" : "none"};
-    },
-} as const;
-
 const POLYGON_SIDES = _.map(_.range(3, 13), function (value) {
     return (
         <OptionItem
@@ -176,14 +168,6 @@ class InteractiveGraphEditor extends React.Component<Props> {
         },
     };
 
-    // TODO(jack): Use versioning instead of DeprecationMixin
-    deprecatedProps = deprecatedProps;
-
-    // TODO(jangmi, CP-3288): Remove usage of `UNSAFE_componentWillMount`
-    UNSAFE_componentWillMount() {
-        DeprecationMixin.UNSAFE_componentWillMount.call(this);
-    }
-
     changeMatchType = (newValue) => {
         const correct = {
             ...this.props.correct,

packages/perseus/src/util.ts

@@ -529,51 +529,6 @@ function constrainedTickStepsFromTickSteps(
     ];
 }
 
-/**
- * Transparently update deprecated props so that the code to deal
- * with them only lives in one place: (Widget).deprecatedProps
- *
- * For example, if a boolean `foo` was deprecated in favor of a
- * number 'bar':
- *      deprecatedProps: {
- *          foo: function(props) {
- *              return {bar: props.foo ? 1 : 0};
- *          }
- *      }
- */
-const DeprecationMixin: any = {
-    // This lifecycle stage is only called before first render
-    // TODO(jangmi, CP-3288): Remove usage of `UNSAFE_componentWillMount`
-    UNSAFE_componentWillMount: function () {
-        const newProps: Record<string, any> = {};
-
-        _.each(
-            this.deprecatedProps,
-            function (func, prop) {
-                // @ts-expect-error - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
-                if (_.has(this.props, prop)) {
-                    // @ts-expect-error - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
-                    _.extend(newProps, func(this.props));
-                }
-            },
-            this,
-        );
-
-        if (!_.isEmpty(newProps)) {
-            // Set new props directly so that widget renders correctly
-            // when it first mounts, even though these will be overwritten
-            // almost immediately afterwards...
-            _.extend(this.props, newProps);
-
-            // ...when we propagate the new props upwards and they come
-            // back down again.
-            // TODO(jeff, CP-3128): Use Wonder Blocks Timing API
-            // eslint-disable-next-line no-restricted-syntax
-            setTimeout(this.props.onChange, 0, newProps);
-        }
-    },
-};
-
 /**
  * Approximate equality on numbers and primitives.
  */
@@ -963,7 +918,6 @@ const Util = {
     gridStepFromTickStep,
     tickStepFromNumTicks,
     constrainedTickStepsFromTickSteps,
-    DeprecationMixin,
     eq,
     deepEq,
     parseQueryString,

packages/perseus/src/widgets/interactive-graph.tsx

@@ -56,8 +56,6 @@ import type {
     SineCoefficient,
 } from "../util/geometry";
 
-const {DeprecationMixin} = Util;
-
 const TRASH_ICON_URI =
     "https://ka-perseus-graphie.s3.amazonaws.com/b1452c0d79fd0f7ff4c3af9488474a0a0decb361.png";
 
@@ -93,12 +91,6 @@ function numSteps(range: Range, step: number) {
     return Math.floor((range[1] - range[0]) / step);
 }
 
-const deprecatedProps = {
-    showGraph: function (props) {
-        return {markings: props.showGraph ? "graph" : "none"};
-    },
-} as const;
-
 const _getShouldShowInstructions: (arg1: Props) => boolean = (props) => {
     return (
         _isClickToAddPoints(props) &&
@@ -190,11 +182,6 @@ class LegacyInteractiveGraph extends React.Component<Props, State> {
         shouldShowInstructions: _getShouldShowInstructions(this.props),
     };
 
-    // TODO(jangmi, CP-3288): Remove usage of `UNSAFE_componentWillMount`
-    UNSAFE_componentWillMount() {
-        DeprecationMixin.UNSAFE_componentWillMount.call(this);
-    }
-
     componentDidMount() {
         if (this.refs.graph) {
             // eslint-disable-next-line react/no-string-refs
@@ -264,8 +251,6 @@ class LegacyInteractiveGraph extends React.Component<Props, State> {
         );
     };
 
-    deprecatedProps: any = deprecatedProps;
-
     setGraphie: (arg1: any) => void = (newGraphie) => {
         this.graphie = newGraphie;
         this.setupGraphie();