Add comment field that is shown on account hover. Update discord link

src/app/components/Characters/CharacterDialog.tsx

@@ -16,9 +16,11 @@ export const CharacterDialog = ({
   updateCharacter: (characer: AccessToken, update: CharacterUpdate) => void;
 }) => {
   const [account, setAccount] = useState("");
+  const [comment, setComment] = useState("");
 
   useEffect(() => {
     if (character?.account) setAccount(character.account);
+    if (character?.comment) setComment(character.comment);
   }, [character]);
 
   const logout = (character: AccessToken) => {
@@ -29,8 +31,8 @@ export const CharacterDialog = ({
 
   const handleKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {
     if (event.key === "Enter") {
-      character && updateCharacter(character, { account });
       closeDialog();
+      character && updateCharacter(character, { account, comment });
     }
   };
 
@@ -46,10 +48,20 @@ export const CharacterDialog = ({
         onChange={(event) => setAccount(event.target.value)}
         onKeyDown={handleKeyDown}
       />
+      <TextField
+        id="outlined-basic"
+        label="Comment"
+        variant="outlined"
+        value={comment ?? ""}
+        sx={{ margin: 1 }}
+        multiline={true}
+        onChange={(event) => setComment(event.target.value)}
+        onKeyDown={handleKeyDown}
+      />
       <DialogActions>
         <Button
           onClick={() => {
-            character && updateCharacter(character, { account });
+            character && updateCharacter(character, { account, comment });
             closeDialog();
           }}
           variant="contained"

src/app/components/Characters/CharacterRow.tsx

@@ -7,7 +7,7 @@ import { styled, useTheme } from "@mui/material/styles";
 import React from "react";
 import { CharacterDialog } from "./CharacterDialog";
 import { AccessToken } from "@/types";
-import { Box, Button } from "@mui/material";
+import { Box, Button, Tooltip } from "@mui/material";
 import { EVE_IMAGE_URL } from "@/const";
 import { CharacterContext } from "@/app/context/Context";
 
@@ -38,6 +38,7 @@ export const CharacterRow = ({ character }: { character: AccessToken }) => {
         updateCharacter={updateCharacter}
         closeDialog={() => setSelectedCharacter(undefined)}
       />
+      <Tooltip title={character.comment}>
         <Box
           display="flex"
           flexDirection="column"
@@ -62,6 +63,7 @@ export const CharacterRow = ({ character }: { character: AccessToken }) => {
             {character.character.name}
           </Button>
         </Box>
+      </Tooltip>
     </StackItem>
   );
 };

src/app/components/Discord/DiscordButton.tsx

@@ -4,7 +4,7 @@ export const DiscordButton = () => {
     <Box>
       <Tooltip title="Come nerd out in discord about PI and this tool">
         <Button
-          href="https://discord.gg/MDapvGyw"
+          href="https://discord.gg/qQK7vu3y9"
           target="_blank"
           style={{ width: "100%" }}
           sx={{ color: "white", display: "block" }}

src/app/page.tsx

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

src/pages/api/refresh.ts

@@ -1,7 +1,7 @@
 import { AccessToken } from "@/types";
 import { extractCharacterFromToken } from "@/utils";
-import { NextApiRequest, NextApiResponse } from "next";
 import crypto from "crypto-js";
+import { NextApiRequest, NextApiResponse } from "next";
 
 const EVE_SSO_TOKEN_URL = "https://login.eveonline.com/v2/oauth/token";
 const EVE_SSO_CLIENT_ID = process.env.EVE_SSO_CLIENT_ID ?? "";
@@ -46,6 +46,7 @@ const handler = async (req: NextApiRequest, res: NextApiResponse) => {
         character,
         needsLogin: false,
         account: accessToken.account,
+        comment: accessToken.comment
       };
 
       console.log("Refresh", character.name, character.characterId);

src/pages/api/token.ts

@@ -47,6 +47,7 @@ const handler = async (req: NextApiRequest, res: NextApiResponse) => {
       character,
       needsLogin: false,
       account: "-",
+      comment: "",
     };
     res.json(token);
   } else {

src/types.ts

@@ -8,6 +8,7 @@ export interface AccessToken {
   character: Character;
   account: string;
   needsLogin: boolean;
+  comment: string;
 }
 
 export interface Character {
@@ -28,6 +29,7 @@ export interface CharacterPlanets {
 
 export interface CharacterUpdate {
   account?: string;
+  comment?: string;
 }
 
 export type Planet = EsiType<"v1", "getCharactersCharacterIdPlanets">[number];