From de1520e4979e394213e126da20a51c06ca1c09e7 Mon Sep 17 00:00:00 2001
From: EmmaRamirez <ramirez.emma.g@gmail.com>
Date: Sat, 4 Mar 2023 22:34:11 -0600
Subject: [PATCH] chore: add no-redeclare lint flag

---
 src/actions/index.ts                            |  1 +
 src/actions/updateExcludedAreas.ts              | 13 +++++++++++++
 .../PokemonEditor/PokemonLocationChecklist.tsx  | 17 ++++++++++-------
 src/reducers/excludedAreas.ts                   | 15 +++++++++++++++
 src/reducers/index.ts                           |  2 ++
 src/state/index.ts                              |  1 +
 6 files changed, 42 insertions(+), 7 deletions(-)
 create mode 100644 src/actions/updateExcludedAreas.ts
 create mode 100644 src/reducers/excludedAreas.ts

diff --git a/src/actions/index.ts b/src/actions/index.ts
index ec2377b63..33dd91aa2 100644
--- a/src/actions/index.ts
+++ b/src/actions/index.ts
@@ -34,3 +34,4 @@ export * from './updateEditorHistory';
 export * from './triggerDownload';
 export * from './toggleDialog';
 export * from './setEditorHistoryEnabled';
+export * from './updateExcludedAreas';
\ No newline at end of file
diff --git a/src/actions/updateExcludedAreas.ts b/src/actions/updateExcludedAreas.ts
new file mode 100644
index 000000000..ea8749e2e
--- /dev/null
+++ b/src/actions/updateExcludedAreas.ts
@@ -0,0 +1,13 @@
+/* eslint-disable @typescript-eslint/no-redeclare */
+import { Action } from 'actions';
+
+export type UPDATE_EXCLUDED_AREAS = 'UPDATE_EXCLUDED_AREAS';
+export const UPDATE_EXCLUDED_AREAS: UPDATE_EXCLUDED_AREAS = 'UPDATE_EXCLUDED_AREAS';
+
+export type updateExcludedAreas = (excludedAreas: string[]) => Action<UPDATE_EXCLUDED_AREAS>;
+export const updateExcludedAreas = (excludedAreas: string[]): Action<UPDATE_EXCLUDED_AREAS> => {
+    return {
+        type: UPDATE_EXCLUDED_AREAS,
+        excludedAreas,
+    };
+};
diff --git a/src/components/PokemonEditor/PokemonLocationChecklist.tsx b/src/components/PokemonEditor/PokemonLocationChecklist.tsx
index e17b3dffc..a515ce007 100644
--- a/src/components/PokemonEditor/PokemonLocationChecklist.tsx
+++ b/src/components/PokemonEditor/PokemonLocationChecklist.tsx
@@ -5,6 +5,8 @@ import { State } from 'state';
 import { PokemonIcon } from 'components/PokemonIcon';
 import {  Callout, Classes, Icon, Intent, TextArea, Tooltip } from '@blueprintjs/core';
 import { cx } from 'emotion';
+import { useDispatch, useSelector } from 'react-redux';
+import { updateExcludedAreas } from 'actions';
 
 
 const LocationIcon = ({ area, currentGame, excludeGifts, pokemon }) => {
@@ -65,16 +67,17 @@ export const PokemonLocationChecklist = ({
 
     const [excludeGifts, setExcludeGifts] = React.useState(false);
     const [currentGame, setCurrentGame] = React.useState<GameName>('None');
-    const [excludedAreas, setExcludedAreas] = React.useState<string[]>([]);
+    const excludedAreas = useSelector<State, State['excludedAreas']>(state => state.excludedAreas);
+    const dispatch = useDispatch();
     const encounterMap = React.useMemo(() => getEncounterMap(game.name).filter(area => !excludedAreas.includes(area)), [game.name, excludedAreas]);
     const totals = React.useMemo(() => calcTotals(boxes, pokemon, encounterMap, currentGame), [boxes, JSON.stringify(pokemon), encounterMap, currentGame]);
 
-    const hideArea = (area: string) => () => setExcludedAreas(areas => [...areas, area]);
+    const hideArea = (area: string) => () => dispatch(updateExcludedAreas([...excludedAreas, area]));
 
-    const updateExcludedAreas = (event) => {
+    const updateExcludedAreasFromText = (event) => {
         const value = event.currentTarget.value;
         const areas = value.split('\n');
-        setExcludedAreas(areas);
+        updateExcludedAreas(areas);
     };
 
     const colors = ['#0e1d6b', '#468189', '#77ACA2', '#9DBEBB', '#F4E9CD', '#0DAB76', '#139A43', '#D4AFB9', '#9CADCE'];
@@ -83,7 +86,7 @@ export const PokemonLocationChecklist = ({
         return <Tooltip content={
             <>
                 {percentages.map((percentage, idx) => <div>
-                    <div style={{ display: 'inline-block', width: '0.5rem', height: '0.5rem', borderRadius: '50%', background: colors[idx], marginRight: '0.25rem' }}></div>
+                    <div key={percentage.key} style={{ display: 'inline-block', width: '0.5rem', height: '0.5rem', borderRadius: '50%', background: colors[idx], marginRight: '0.25rem' }}></div>
                     {percentage.key}: {percentage.percentage}
                 </div>)}
             </>
@@ -153,8 +156,8 @@ export const PokemonLocationChecklist = ({
                 </label>
                 <TextArea
                     name='excludedAreas'
-                    onChange={updateExcludedAreas}
-                    value={excludedAreas.join('\n')}
+                    onChange={updateExcludedAreasFromText}
+                    defaultValue={excludedAreas.join('\n')}
                 />
             </div>
             <Callout intent={Intent.WARNING} style={{ fontSize: '80%', marginTop: '0.5rem' }}>
diff --git a/src/reducers/excludedAreas.ts b/src/reducers/excludedAreas.ts
new file mode 100644
index 000000000..9a2ea8645
--- /dev/null
+++ b/src/reducers/excludedAreas.ts
@@ -0,0 +1,15 @@
+import { Action, UPDATE_EXCLUDED_AREAS, REPLACE_STATE } from '../actions';
+
+export function excludedAreas(
+    state: string[] = [],
+    action: Action<UPDATE_EXCLUDED_AREAS | REPLACE_STATE>,
+) {
+    switch (action.type) {
+        case UPDATE_EXCLUDED_AREAS:
+            return action.excludedAreas;
+        case REPLACE_STATE:
+            return action.replaceWith.excludedAreas;
+        default:
+            return state;
+    }
+}
diff --git a/src/reducers/index.ts b/src/reducers/index.ts
index 0368f2e9f..00f03bfcd 100644
--- a/src/reducers/index.ts
+++ b/src/reducers/index.ts
@@ -17,6 +17,7 @@ import { customMoveMap } from './customMoveMap';
 import { stats } from './stats';
 import { customTypes } from './customTypes';
 import { editorHistory } from './editorHistory';
+import { excludedAreas } from './excludedAreas';
 import { view } from './view';
 
 export const reducers = {
@@ -26,6 +27,7 @@ export const reducers = {
     customMoveMap,
     customTypes,
     editorHistory,
+    excludedAreas,
     game,
     nuzlockes,
     pokemon,
diff --git a/src/state/index.ts b/src/state/index.ts
index 69a66d682..0465859af 100644
--- a/src/state/index.ts
+++ b/src/state/index.ts
@@ -9,6 +9,7 @@ export interface State {
     confirmation: boolean;
     checkpoints: Checkpoints;
     editor: Editor;
+    excludedAreas: string[];
     game: Game;
     pokemon: Pokemon[];
     rules: string[];