fix: Memoize achievement inferencer (#3061)

Uses a per-component instance singleton and memoizes it, as we only need
to keep track of the initial states of the control panel.

Also added a TODO comment for future refactoring to more modern React
principles using component state and hooks.

src/pages/achievement/control/AchievementControl.tsx

@@ -35,8 +35,18 @@ const AchievementControl: React.FC = () => {
     [dispatch]
   );
 
-  const inferencer = useTypedSelector(
-    state => new AchievementInferencer(state.achievement.achievements, state.achievement.goals)
+  // TODO: This is a hacky fix. By right, we shouldn't need to use an
+  // inferencer instance since we can encapsulate the logic using hooks
+  // and component state.
+  const [initialAchievements, initialGoals] = useTypedSelector(state => [
+    state.achievement.achievements,
+    state.achievement.goals
+  ]);
+  const inferencer = useMemo(
+    () => new AchievementInferencer(initialAchievements, initialGoals),
+    // We only want to create the inferencer once
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    []
   );
 
   /**