Client crash on new account when first earning a badge

[MoyTW]

Entered Experimental Biology room with a new account & got a undefined error instead of earning a new badge, unsure on cause.

From main page

× TypeError: Cannot read properties of undefined (reading 'push') (anonymous function) src/reducer.ts:788:37 785 | } 786 | 787 | if (action.type === ActionType.UnlockBadge) {

788 | draft.profileData.unlockedBadges.push(action.value) | ^ 789 | draft.justUnlockedBadge = action.value 790 | draft.activeModal = Modal.BadgeUnlock 791 | } View compiled ▶ 6 stack frames were collapsed. useReducerWithThunk src/useReducerWithThunk.ts:24:39 21 | reducer: Reducer<S, A>, 22 | initialState: S 23 | ): [S, ThunkDispatch<A, S>] { 24 | const [state, dispatch] = useReducer(reducer, initialState) | ^ 25 | 26 | const thunkDispatch = (action: A | Thunk<A, S>) => { 27 | if (isFunction(action)) { View compiled App src/App.tsx:73:4 70 | 71 | const App = () => { 72 | const [state, dispatch] = useReducerWithThunk<Action, State>( 73 | reducer, | ^ 74 | defaultState 75 | ) 76 | View compiled ▶ 18 stack frames were collapsed. thunkDispatch src/useReducerWithThunk.ts:30:6 27 | if (isFunction(action)) { 28 | action(thunkDispatch, () => state) 29 | } else { 30 | dispatch(action) | ^ 31 | } 32 | } 33 | return [state, thunkDispatch] View compiled unlockBadge src/networking.ts:521:6 518 | badge 519 | ) 520 | } 521 | dispatch(UnlockBadgeAction(badge[0])) | ^ 522 | } 523 | } 524 | } View compiled WebSocket. src/networking.ts:557:22 554 | }) 555 | ws.addEventListener('message', (event) => { 556 | const { type, value } = JSON.parse(event.data) 557 | eventMappingtype | ^ 558 | }) 559 | // ws.send(message); 560 | View compiled

From console

Uncaught TypeError: Cannot read properties of undefined (reading 'push') at reducer.ts:788:38 at immerClass.ts:78:58 at e.produce (immerClass.ts:94:14) at immerClass.ts:78:17 at updateReducer (react-dom.development.js:15318:22) at Object.useReducer (react-dom.development.js:16425:16) at useReducer (react.development.js:1512:21) at useReducerWithThunk (useReducerWithThunk.ts:24:39) at App (App.tsx:72:48) at renderWithHooks (react-dom.development.js:14985:18) at updateFunctionComponent (react-dom.development.js:17356:20) at beginWork (react-dom.development.js:19063:16) at HTMLUnknownElement.callCallback (react-dom.development.js:3945:14) at Object.invokeGuardedCallbackDev (react-dom.development.js:3994:16) at invokeGuardedCallback (react-dom.development.js:4056:31) at beginWork$1 (react-dom.development.js:23964:7) at performUnitOfWork (react-dom.development.js:22776:12) at workLoopSync (react-dom.development.js:22707:5) at renderRootSync (react-dom.development.js:22670:7) at performSyncWorkOnRoot (react-dom.development.js:22293:18) at react-dom.development.js:11327:26 at unstable_runWithPriority (scheduler.development.js:468:12) at runWithPriority$1 (react-dom.development.js:11276:10) at flushSyncCallbackQueueImpl (react-dom.development.js:11322:9) at flushSyncCallbackQueue (react-dom.development.js:11309:3) at scheduleUpdateOnFiber (react-dom.development.js:21893:9) at dispatchAction (react-dom.development.js:16139:5) at thunkDispatch (useReducerWithThunk.ts:30:7) at Object.unlockBadge (networking.ts:521:7) at WebSocket. (networking.ts:557:23) index.js:1 The above error occurred in the component:

at App (http://localhost:1234/index.2d3ace14.js:24643:76)

Consider adding an error boundary to your tree to customize error handling behavior. Visit https://reactjs.org/link/error-boundaries to learn more about error boundaries. console. @ index.js:1 react-dom.development.js:11340 Uncaught TypeError: Cannot read properties of undefined (reading 'push') at reducer.ts:788:38 at immerClass.ts:78:58 at e.produce (immerClass.ts:94:14) at immerClass.ts:78:17 at updateReducer (react-dom.development.js:15318:22) at Object.useReducer (react-dom.development.js:16425:16) at useReducer (react.development.js:1512:21) at useReducerWithThunk (useReducerWithThunk.ts:24:39) at App (App.tsx:72:48) at renderWithHooks (react-dom.development.js:14985:18) at updateFunctionComponent (react-dom.development.js:17356:20) at beginWork (react-dom.development.js:19063:16) at HTMLUnknownElement.callCallback (react-dom.development.js:3945:14) at Object.invokeGuardedCallbackDev (react-dom.development.js:3994:16) at invokeGuardedCallback (react-dom.development.js:4056:31) at beginWork$1 (react-dom.development.js:23964:7) at performUnitOfWork (react-dom.development.js:22776:12) at workLoopSync (react-dom.development.js:22707:5) at renderRootSync (react-dom.development.js:22670:7) at performSyncWorkOnRoot (react-dom.development.js:22293:18) at react-dom.development.js:11327:26 at unstable_runWithPriority (scheduler.development.js:468:12) at runWithPriority$1 (react-dom.development.js:11276:10) at flushSyncCallbackQueueImpl (react-dom.development.js:11322:9) at flushSyncCallbackQueue (react-dom.development.js:11309:3) at scheduleUpdateOnFiber (react-dom.development.js:21893:9) at dispatchAction (react-dom.development.js:16139:5) at thunkDispatch (useReducerWithThunk.ts:30:7) at Object.unlockBadge (networking.ts:521:7) at WebSocket. (networking.ts:557:23) networking.ts:597 Object networking.ts:222 Object index.js:1 Warning: Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in a useEffect cleanup function. at App (http://localhost:1234/index.2d3ace14.js:24643:76)

[MoyTW]

After refresh, badge showed up in the badges as expected.

[MoyTW]

Wait, wrong repo, I should file this in my own. Related to #785, probably