From 1377a8d48bf93616c26a2227f4fee769397168a1 Mon Sep 17 00:00:00 2001
From: PepperLola <PepperLola@users.noreply.github.com>
Date: Mon, 29 Jul 2024 12:26:50 -0700
Subject: [PATCH 1/2] add initial aps management modal has name and profile
 picture with logout button

---
 fission/src/Synthesis.tsx                    |  2 ++
 fission/src/ui/components/MainHUD.tsx        |  2 +-
 fission/src/ui/modals/APSManagementModal.tsx | 24 ++++++++++++++++++++
 3 files changed, 27 insertions(+), 1 deletion(-)
 create mode 100644 fission/src/ui/modals/APSManagementModal.tsx

diff --git a/fission/src/Synthesis.tsx b/fission/src/Synthesis.tsx
index 51e9c4db05..8f0f09f62f 100644
--- a/fission/src/Synthesis.tsx
+++ b/fission/src/Synthesis.tsx
@@ -66,6 +66,7 @@ import NewInputSchemeModal from "./ui/modals/configuring/theme-editor/NewInputSc
 import AssignNewSchemeModal from "./ui/modals/configuring/theme-editor/AssignNewSchemeModal.tsx"
 import AnalyticsConsent from "./ui/components/AnalyticsConsent.tsx"
 import PreferencesSystem from "./systems/preferences/PreferencesSystem.ts"
+import APSManagementModal from "./ui/modals/APSManagementModal.tsx"
 
 const worker = new Lazy<Worker>(() => new WPILibWSWorker())
 
@@ -227,6 +228,7 @@ const initialModals = [
     <ImportLocalMirabufModal key="import-local-mirabuf" modalId="import-local-mirabuf" />,
     <ConfigureRobotModal key="config-robot" modalId="config-robot" />,
     <ResetAllInputsModal key="reset-inputs" modalId="reset-inputs" />,
+    <APSManagementModal key="aps-management" modalId="aps-management" />,
 ]
 
 const initialPanels: ReactElement[] = [
diff --git a/fission/src/ui/components/MainHUD.tsx b/fission/src/ui/components/MainHUD.tsx
index af55290eab..8007143109 100644
--- a/fission/src/ui/components/MainHUD.tsx
+++ b/fission/src/ui/components/MainHUD.tsx
@@ -133,7 +133,7 @@ const MainHUD: React.FC = () => {
                         value={`Hi, ${userInfo.givenName}`}
                         icon={<UserIcon className="h-[20pt] m-[5pt] rounded-full" />}
                         larger={true}
-                        onClick={() => APS.logout()}
+                        onClick={() => openModal("aps-management")}
                     />
                 ) : (
                     <MainHUDButton
diff --git a/fission/src/ui/modals/APSManagementModal.tsx b/fission/src/ui/modals/APSManagementModal.tsx
new file mode 100644
index 0000000000..ab1ec57e7c
--- /dev/null
+++ b/fission/src/ui/modals/APSManagementModal.tsx
@@ -0,0 +1,24 @@
+import React, { useState } from "react"
+import Modal, { ModalPropsImpl } from "@/components/Modal"
+import Stack, { StackDirection } from "@/components/Stack"
+import Label, { LabelSize } from "@/components/Label"
+import { HiUser } from "react-icons/hi"
+import APS from "@/aps/APS"
+
+const APSManagementModal: React.FC<ModalPropsImpl> = ({ modalId }) => {
+    const [userInfo, setUserInfo] = useState(APS.userInfo)
+    return (
+        <Modal name={userInfo?.name ?? "Not signed in"} icon={
+            userInfo?.picture ?
+                <img src={userInfo?.picture} className="h-10 rounded-full" /> :
+                <HiUser />
+        } modalId={modalId} acceptName="Logout" onAccept={() => {
+            APS.logout()
+        }}>
+            <Stack direction={StackDirection.Vertical} spacing={10}>
+            </Stack>
+        </Modal>
+    )
+}
+
+export default APSManagementModal

From ee6cf471512a36a9425d573e1ee80833c74befd4 Mon Sep 17 00:00:00 2001
From: PepperLola <PepperLola@users.noreply.github.com>
Date: Wed, 31 Jul 2024 14:38:13 -0700
Subject: [PATCH 2/2] ran formatter

---
 fission/src/ui/modals/APSManagementModal.tsx | 22 ++++++++++----------
 1 file changed, 11 insertions(+), 11 deletions(-)

diff --git a/fission/src/ui/modals/APSManagementModal.tsx b/fission/src/ui/modals/APSManagementModal.tsx
index ab1ec57e7c..fa4d8ddaaa 100644
--- a/fission/src/ui/modals/APSManagementModal.tsx
+++ b/fission/src/ui/modals/APSManagementModal.tsx
@@ -1,22 +1,22 @@
 import React, { useState } from "react"
 import Modal, { ModalPropsImpl } from "@/components/Modal"
 import Stack, { StackDirection } from "@/components/Stack"
-import Label, { LabelSize } from "@/components/Label"
 import { HiUser } from "react-icons/hi"
 import APS from "@/aps/APS"
 
 const APSManagementModal: React.FC<ModalPropsImpl> = ({ modalId }) => {
-    const [userInfo, setUserInfo] = useState(APS.userInfo)
+    const [userInfo, _] = useState(APS.userInfo)
     return (
-        <Modal name={userInfo?.name ?? "Not signed in"} icon={
-            userInfo?.picture ?
-                <img src={userInfo?.picture} className="h-10 rounded-full" /> :
-                <HiUser />
-        } modalId={modalId} acceptName="Logout" onAccept={() => {
-            APS.logout()
-        }}>
-            <Stack direction={StackDirection.Vertical} spacing={10}>
-            </Stack>
+        <Modal
+            name={userInfo?.name ?? "Not signed in"}
+            icon={userInfo?.picture ? <img src={userInfo?.picture} className="h-10 rounded-full" /> : <HiUser />}
+            modalId={modalId}
+            acceptName="Logout"
+            onAccept={() => {
+                APS.logout()
+            }}
+        >
+            <Stack direction={StackDirection.Vertical} spacing={10}></Stack>
         </Modal>
     )
 }