Add system variable to character

src/app/components/Characters/CharacterDialog.tsx

@@ -17,10 +17,12 @@ export const CharacterDialog = ({
 }) => {
   const [account, setAccount] = useState("");
   const [comment, setComment] = useState("");
+  const [system, setSystem] = useState("");
 
   useEffect(() => {
     if (character?.account) setAccount(character.account);
     if (character?.comment) setComment(character.comment);
+    if (character?.system) setSystem(character.system);
   }, [character]);
 
   const logout = (character: AccessToken) => {
@@ -52,6 +54,15 @@ export const CharacterDialog = ({
         onChange={(event) => setAccount(event.target.value)}
         onKeyDown={handleKeyDown}
       />
+      <TextField
+        id="outlined-basic"
+        label="System"
+        variant="outlined"
+        value={system ?? ""}
+        sx={{ margin: 1 }}
+        minRows={6}
+        onChange={(event) => setSystem(event.target.value)}
+      />
       <TextField
         id="outlined-basic"
         label="Comment / Plan"
@@ -62,10 +73,12 @@ export const CharacterDialog = ({
         minRows={6}
         onChange={(event) => setComment(event.target.value)}
       />
+
       <DialogActions>
         <Button
           onClick={() => {
-            character && updateCharacter(character, { account, comment });
+            character &&
+              updateCharacter(character, { account, comment, system });
             closeDialog();
           }}
           variant="contained"

src/app/context/Context.tsx

@@ -67,5 +67,5 @@ export const ColorContext = createContext<{
   setColors: (colors: ColorSelectionType) => void;
 }>({
   colors: defaultColors,
-  setColors: () => {}
+  setColors: () => {},
 });

src/app/page.tsx

@@ -51,6 +51,7 @@ const Home = () => {
           ...c,
           ...(updates.account ? { account: updates.account } : {}),
           ...(updates.comment ? { comment: updates.comment } : {}),
+          ...(updates.system ? { system: updates.system } : {}),
         };
       return c;
     });