Fix orderer bug that was adding null/undefined values to user input (#2760)

## Summary:
When we briefly turned on serverside scoring for Khan Academy, we saw errors like
this coming from the Perseus service:

```
Failed to parse user input map: At (root)["orderer 1"].current[0] -- expected string, but got null
```

These nulls were erroneously getting into the user input because of a bug in
the UI. This PR fixes the bug. The Orderer is not accessible and not
recommended for use, so I am applying the minimal fix.

Issue: https://khanacademy.atlassian.net/browse/LEMS-3343

## Test plan:

In Storybook, drag a few cards into an Orderer. Try to reorder the cards.  A
broken-looking "ghost card" will appear. Try dragging and dropping the ghost
into the orderer. It should disappear.

Author: benchristel

Reviewers: benchristel, handeyeco, Myranae

Required Reviewers:

Approved By: handeyeco

Checks: ✅ 10 checks were successful

Pull Request URL: #2760

Author: benchristel

.changeset/purple-bulldogs-thank.md

@@ -0,0 +1,5 @@
+---
+"@khanacademy/perseus": patch
+---
+
+Fix a bug in Orderer that allowed learners to add cards with null content.

packages/perseus/src/widgets/orderer/orderer.tsx

@@ -411,14 +411,18 @@ class Orderer
             const list = this.props.userInput.current.slice();
 
             if (!inCardBank) {
-                // Insert the new card into the position
-                const newCard = {
-                    content: this.state.dragContent,
-                    key: _.uniqueId("perseus_draggable_card_"),
-                    width: this.state.dragWidth,
-                } as const;
-
-                list.splice(index, 0, newCard.content);
+                const cardContent: string | null | undefined =
+                    this.state.dragContent;
+                if (typeof cardContent === "string") {
+                    // Insert the new card into the position
+                    const newCard = {
+                        content: cardContent,
+                        key: _.uniqueId("perseus_draggable_card_"),
+                        width: this.state.dragWidth,
+                    } as const;
+
+                    list.splice(index, 0, newCard.content);
+                }
             }
 
             this.props.handleUserInput({