Undo Label Location work (#2314)

## Summary:
Undoing the Label Location work as something seems to have gone strange after deploying to webapp. We will revisit this work separately afterwards. 

This will also require some changes to webapp to remove the new property from the go structs. 

## Test plan:
tests pass

Author: SonicScrewdriver

Reviewers: nishasy

Required Reviewers:

Approved By: nishasy

Checks: ✅ 8 checks were successful, ⏹️  9 checks were cancelled, ⌛ 1 check is pending

Pull Request URL: #2314

Author: SonicScrewdriver

.changeset/khaki-mayflies-lick.md

@@ -0,0 +1,7 @@
+---
+"@khanacademy/perseus": minor
+"@khanacademy/perseus-core": minor
+"@khanacademy/perseus-editor": minor
+---
+
+Revert labelLocation

packages/perseus-core/src/data-schema.ts

@@ -431,7 +431,6 @@ export type PerseusImageBackground = {
  * - none: shows no markings
  */
 export type MarkingsType = "axes" | "graph" | "grid" | "none";
-export type AxisLabelLocation = "onAxis" | "alongEdge";
 
 export type PerseusCategorizerWidgetOptions = {
     // Translatable text; a list of items to categorize. e.g. ["banana", "yellow", "apple", "purple", "shirt"]
@@ -735,13 +734,6 @@ export type PerseusInteractiveGraphWidgetOptions = {
     markings: MarkingsType;
     // How to label the X and Y axis.  default: ["x", "y"]
     labels?: ReadonlyArray<string>;
-    /**
-     * Specifies the location of the labels on the graph.  default: "onAxis".
-     * - "onAxis": Labels are positioned on the axis at the right (x) and top (y) of the graph.
-     * - "alongEdge": Labels are centered along the bottom (x) and left (y) edges of the graph.
-     *    The y label is rotated. Typically used when the range min is near 0 with longer labels.
-     */
-    labelLocation?: AxisLabelLocation;
     // Whether to show the Protractor tool overlayed on top of the graph
     showProtractor: boolean;
     /**

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

@@ -20,7 +20,6 @@ import Heading from "../../../components/heading";
 import LabeledRow from "../locked-figures/labeled-row";
 
 import type {
-    AxisLabelLocation,
     MarkingsType,
     PerseusImageBackground,
 } from "@khanacademy/perseus-core";
@@ -50,13 +49,6 @@ type Props = {
      * The labels for the x and y axes.
      */
     labels: ReadonlyArray<string>;
-    /**
-     * Specifies the location of the labels on the graph.  default: "onAxis".
-     * - "onAxis": Labels are positioned on the axis at the right (x) and top (y) of the graph.
-     * - "alongEdge": Labels are centered along the bottom (x) and left (y) edges of the graph.
-     *    The y label is rotated. Typically used when the range min is near 0 with longer labels.
-     */
-    labelLocation: AxisLabelLocation;
     /**
      * The range of the graph.
      */
@@ -107,7 +99,6 @@ type Props = {
 type State = {
     isExpanded: boolean;
     labelsTextbox: ReadonlyArray<string>;
-    labelLocation: AxisLabelLocation;
     gridStepTextbox: [x: number, y: number];
     snapStepTextbox: [x: number, y: number];
     stepTextbox: [x: number, y: number];
@@ -125,7 +116,6 @@ class InteractiveGraphSettings extends React.Component<Props, State> {
     static stateFromProps(props: Props) {
         return {
             labelsTextbox: props.labels,
-            labelLocation: props.labelLocation,
             gridStepTextbox: props.gridStep,
             snapStepTextbox: props.snapStep,
             stepTextbox: props.step,
@@ -150,7 +140,6 @@ class InteractiveGraphSettings extends React.Component<Props, State> {
             interactiveSizes.defaultBoxSizeSmall,
         ],
         labels: ["$x$", "$y$"],
-        labelLocation: "onAxis",
         range: [
             [-10, 10],
             [-10, 10],
@@ -176,7 +165,6 @@ class InteractiveGraphSettings extends React.Component<Props, State> {
     UNSAFE_componentWillReceiveProps(nextProps) {
         if (
             !_.isEqual(this.props.labels, nextProps.labels) ||
-            !_.isEqual(this.props.labelLocation, nextProps.labelLocation) ||
             !_.isEqual(this.props.gridStep, nextProps.gridStep) ||
             !_.isEqual(this.props.snapStep, nextProps.snapStep) ||
             !_.isEqual(this.props.step, nextProps.step) ||
@@ -411,7 +399,6 @@ class InteractiveGraphSettings extends React.Component<Props, State> {
 
     changeGraph = () => {
         const labels = this.state.labelsTextbox;
-        const labelLocation = this.state.labelLocation;
         const range = _.map(this.state.rangeTextbox, function (range) {
             return _.map(range, Number);
         });
@@ -438,7 +425,6 @@ class InteractiveGraphSettings extends React.Component<Props, State> {
             this.change({
                 valid: true,
                 labels: labels,
-                labelLocation: labelLocation,
                 range: range,
                 step: step,
                 gridStep: gridStep,
@@ -466,26 +452,6 @@ class InteractiveGraphSettings extends React.Component<Props, State> {
                 {this.state.isExpanded && (
                     <View>
                         <div className="graph-settings">
-                            <div className="perseus-widget-row">
-                                <LabeledRow label="Label Location">
-                                    <ButtonGroup
-                                        value={this.props.labelLocation}
-                                        allowEmpty={false}
-                                        buttons={[
-                                            {
-                                                value: "onAxis",
-                                                content: "On Axis",
-                                            },
-                                            {
-                                                value: "alongEdge",
-                                                content: "Along Graph Edge",
-                                            },
-                                        ]}
-                                        onChange={this.change("labelLocation")}
-                                    />
-                                </LabeledRow>
-                            </div>
-
                             <div className="perseus-widget-row">
                                 <div className="perseus-widget-left-col">
                                     <LabeledRow label="x Label">

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

@@ -14,7 +14,6 @@ import {
     type PerseusGraphType,
     type MarkingsType,
     type InteractiveGraphDefaultWidgetOptions,
-    type AxisLabelLocation,
     interactiveGraphLogic,
 } from "@khanacademy/perseus-core";
 import {Id, View} from "@khanacademy/wonder-blocks-core";
@@ -71,13 +70,6 @@ export type Props = {
      * The labels for the x and y axes.
      */
     labels: ReadonlyArray<string>;
-    /**
-     * Specifies the location of the labels on the graph.  default: "onAxis".
-     * - "onAxis": Labels are positioned on the axis at the right (x) and top (y) of the graph.
-     * - "alongEdge": Labels are centered along the bottom (x) and left (y) edges of the graph.
-     *    The y label is rotated. Typically used when the range min is near 0 with longer labels.
-     */
-    labelLocation?: AxisLabelLocation;
     /**
      * The range of the graph in the x and y directions.
      */
@@ -202,7 +194,6 @@ class InteractiveGraphEditor extends React.Component<Props> {
             "backgroundImage",
             "markings",
             "labels",
-            "labelLocation",
             "showProtractor",
             "showTooltips",
             "range",
@@ -300,7 +291,6 @@ class InteractiveGraphEditor extends React.Component<Props> {
                 box: this.props.box,
                 range: this.props.range,
                 labels: this.props.labels,
-                labelLocation: this.props.labelLocation,
                 step: this.props.step,
                 gridStep: gridStep,
                 snapStep: snapStep,
@@ -751,7 +741,6 @@ class InteractiveGraphEditor extends React.Component<Props> {
                             box={getInteractiveBoxFromSizeClass(sizeClass)}
                             range={this.props.range}
                             labels={this.props.labels}
-                            labelLocation={this.props.labelLocation}
                             step={this.props.step}
                             gridStep={gridStep}
                             snapStep={snapStep}

packages/perseus/src/widgets/interactive-graphs/__snapshots__/interactive-graph.test.tsx.snap

@@ -37,7 +37,7 @@ exports[`Interactive Graph A none-type graph renders predictably: first render 1
                 </span>
                 <span
                   aria-label="Y-axis"
-                  style="position: absolute; left: 200px; top: -28px; font-size: 14px; transform: translate(-50%, 0px);"
+                  style="position: absolute; left: 200px; top: -24px; font-size: 14px; transform: translate(-50%, 0px);"
                 >
                   <span
                     class="mock-TeX"