From 9978075867548fefabe8c836dd3cb9e3a04f2304 Mon Sep 17 00:00:00 2001
From: arcticfly <41524992+arcticfly@users.noreply.github.com>
Date: Thu, 20 Jul 2023 20:46:31 -0700
Subject: [PATCH] Fix auth flicker (#75)

* Remove experiments flicker for unauthenticated users

* Decrease size of NewScenarioButton spinner
---
 .../OutputsTable/NewScenarioButton.tsx        |  6 ++++-
 src/pages/experiments/index.tsx               | 27 ++++++++++---------
 2 files changed, 20 insertions(+), 13 deletions(-)

diff --git a/src/components/OutputsTable/NewScenarioButton.tsx b/src/components/OutputsTable/NewScenarioButton.tsx
index 3f1ddb6..5542338 100644
--- a/src/components/OutputsTable/NewScenarioButton.tsx
+++ b/src/components/OutputsTable/NewScenarioButton.tsx
@@ -49,7 +49,11 @@ export default function NewScenarioButton() {
         Add Scenario
       </StyledButton>
       <StyledButton onClick={onAutogenerate}>
-        <Icon as={autogenerating ? Spinner : BsPlus} boxSize={6} mr={autogenerating ? 1 : 0} />
+        <Icon
+          as={autogenerating ? Spinner : BsPlus}
+          boxSize={autogenerating ? 4 : 6}
+          mr={autogenerating ? 2 : 0}
+        />
         Autogenerate Scenario
       </StyledButton>
     </HStack>
diff --git a/src/pages/experiments/index.tsx b/src/pages/experiments/index.tsx
index 241dc8a..c37e19c 100644
--- a/src/pages/experiments/index.tsx
+++ b/src/pages/experiments/index.tsx
@@ -20,22 +20,25 @@ export default function ExperimentsPage() {
   const experiments = api.experiments.list.useQuery();
 
   const user = useSession().data;
+  const authLoading = useSession().status === "loading";
 
-  if (user === null) {
+  if (user === null || authLoading) {
     return (
       <AppShell title="Experiments">
         <Center h="100%">
-          <Text>
-            <Link
-              onClick={() => {
-                signIn("github").catch(console.error);
-              }}
-              textDecor="underline"
-            >
-              Sign in
-            </Link>{" "}
-            to view or create new experiments!
-          </Text>
+          {!authLoading && (
+            <Text>
+              <Link
+                onClick={() => {
+                  signIn("github").catch(console.error);
+                }}
+                textDecor="underline"
+              >
+                Sign in
+              </Link>{" "}
+              to view or create new experiments!
+            </Text>
+          )}
         </Center>
       </AppShell>
     );