src/App.tsx

@@ -2,28 +2,13 @@ import { useState } from "react";
 import Exercises from "./components/Exercises";
 import Header from "./components/Header";
 import WorkoutSelector from "./components/WorkoutSelector";
-import { CurrentExerciseType, ExerciseInfosType } from "./types";
+import { CurrentExerciseType } from "./types";
 
-export enum Stat { Reps, Sets, Weight, Time, Steps, MaxHR, AvgHR, StepsPerMin };
 
-export function statLength() {
+enum Stat { Reps, Sets, Weight, Time, Steps, MaxHR, AvgHR, StepsPerMin };
-  return Object.keys(Stat).length / 2;
-}
-
-export const exerciseInfos: ExerciseInfosType = {
-  "Squat": {
-    defaultStats: [Stat.Reps, Stat.Sets, Stat.Weight]
-  },
-  "Deadlift": {
-    defaultStats: [Stat.Reps, Stat.Sets, Stat.Weight]
-  },
-  "Bench Press": {
-    defaultStats: [Stat.Reps, Stat.Sets, Stat.Weight]
-  }
-}
 
 function App() {
-  const [currentExercises, setExercises] = useState<CurrentExerciseType[]>([
+  const [currentExercises, setExercises]: [CurrentExerciseType[], any] = useState([
     {
       name: "Squat",
       stats: { "Weight": 10 }
@@ -43,20 +28,15 @@ function App() {
     {
       name: "Squat",
       stats: {}
-    }]);
+    }])
   }
 
   function addStat(addIndex: number) {
-    const l = statLength();
+    for (const checkStat in Stat) {
-    for (let i = 0; i < l; i++) {
+      //console.log(checkStat, typeof (checkStat));
-      if (currentExercises[addIndex].stats[Stat[i]] === undefined) {
-        var newExercises = [...currentExercises];
-        newExercises[addIndex].stats[Stat[i]] = null;
-        setExercises(newExercises);
-        return;
-      }
-
     }
+    console.log(currentExercises[addIndex].stats)
+    //setExercises([..])
   }
 
 

src/components/Exercise.tsx

@@ -1,13 +1,10 @@
-import { exerciseInfos } from "../App";
 import { CurrentExerciseType } from "../types";
 import InputStat from "./InputStat";
 
 function Exercise({ currentExercise, deleteCurrentExercise, addStat }: { currentExercise: CurrentExerciseType, deleteCurrentExercise: () => void, addStat: () => void }) {
     return (
         <div>
-            Exercise :<select>
+            Exercise :<select></select>
-                {Object.keys(exerciseInfos).map((exerciseName, index) => <option key={index} value={exerciseName}>{exerciseName}</option>)}
-            </select>
             {Object.entries(currentExercise.stats).map(([stat, value], index) => <InputStat key={index} stat={stat} />)}
             <button onClick={addStat}>Add Stat</button>
             <button onClick={deleteCurrentExercise}>Delete</button>

src/components/InputStat.tsx

@@ -1,10 +1,7 @@
-import { Stat, statLength } from "../App";
 function InputStat({ stat, statType }: { stat: string, statType?: string }) {
     return (
         <div>
-            <select>
+            <select>{stat}</select>: <input type={(statType === undefined ? 'number' : statType)} />
-                {Object.keys(Stat).filter((_, index) => index < statLength()).map((_, index) => <option key={index} value={Stat[index]}>{Stat[index]}</option>)}
-            </select>: <input type={(statType === undefined ? 'number' : statType)} />
         </div >
     );
 }

src/types.d.ts

@@ -1,8 +1,4 @@
 export type CurrentExerciseType = {
     name: string,
-    stats: { [stat: string]: any },
+    stats: { [stat: Stat]: any },
 };
-
-export type ExerciseInfosType = {
-    [key: string]: { defaultStats: Stat[] }
-}