From cf67c78823bd1e7591c2199d51aa3f3fffed73c4 Mon Sep 17 00:00:00 2001
From: Luke Granger-Brown <git@lukegb.com>
Date: Thu, 18 Jun 2020 18:44:52 +0100
Subject: [PATCH] Refactor webui changes.

Don't use contexts, just raw Apollo, since it's cached anyway.

Change "ReadonlyHidden" to "IfLoggedIn".
---
 webui/src/layout/CurrentIdentity.tsx        | 30 ++++++++-------------
 webui/src/layout/CurrentIdentityContext.tsx |  6 -----
 webui/src/layout/IfLoggedIn.tsx             | 14 ++++++++++
 webui/src/layout/ReadonlyHidden.tsx         | 19 -------------
 webui/src/layout/index.tsx                  |  6 ++---
 webui/src/pages/bug/Bug.tsx                 |  6 ++---
 webui/src/pages/bug/CommentForm.graphql     |  4 +--
 7 files changed, 31 insertions(+), 54 deletions(-)
 delete mode 100644 webui/src/layout/CurrentIdentityContext.tsx
 create mode 100644 webui/src/layout/IfLoggedIn.tsx
 delete mode 100644 webui/src/layout/ReadonlyHidden.tsx

diff --git a/webui/src/layout/CurrentIdentity.tsx b/webui/src/layout/CurrentIdentity.tsx
index 550601799993cededd3028496fb1c965351127d8..21f489ef73289010650bac69e1c99bbfce9e2c87 100644
--- a/webui/src/layout/CurrentIdentity.tsx
+++ b/webui/src/layout/CurrentIdentity.tsx
@@ -3,7 +3,7 @@ import React from 'react';
 import Avatar from '@material-ui/core/Avatar';
 import { makeStyles } from '@material-ui/core/styles';
 
-import CurrentIdentityContext from './CurrentIdentityContext';
+import { useCurrentIdentityQuery } from './CurrentIdentity.generated';
 
 const useStyles = makeStyles(theme => ({
   displayName: {
@@ -13,26 +13,18 @@ const useStyles = makeStyles(theme => ({
 
 const CurrentIdentity = () => {
   const classes = useStyles();
+  const { loading, error, data } = useCurrentIdentityQuery();
 
-  return (
-    <CurrentIdentityContext.Consumer>
-      {context => {
-        if (!context) return null;
-        const { loading, error, data } = context as any;
-
-        if (error || loading || !data?.repository?.userIdentity) return null;
+  if (error || loading || !data?.repository?.userIdentity) return null;
 
-        const user = data.repository.userIdentity;
-        return (
-          <>
-            <Avatar src={user.avatarUrl ? user.avatarUrl : undefined}>
-              {user.displayName.charAt(0).toUpperCase()}
-            </Avatar>
-            <div className={classes.displayName}>{user.displayName}</div>
-          </>
-        );
-      }}
-    </CurrentIdentityContext.Consumer>
+  const user = data.repository.userIdentity;
+  return (
+    <>
+      <Avatar src={user.avatarUrl ? user.avatarUrl : undefined}>
+        {user.displayName.charAt(0).toUpperCase()}
+      </Avatar>
+      <div className={classes.displayName}>{user.displayName}</div>
+    </>
   );
 };
 
diff --git a/webui/src/layout/CurrentIdentityContext.tsx b/webui/src/layout/CurrentIdentityContext.tsx
deleted file mode 100644
index 78f2f263f8106be6995db534aee6b63e9706fd42..0000000000000000000000000000000000000000
--- a/webui/src/layout/CurrentIdentityContext.tsx
+++ /dev/null
@@ -1,6 +0,0 @@
-import React from 'react';
-
-import { CurrentIdentityQueryResult } from './CurrentIdentity.generated';
-
-const Context = React.createContext(null as CurrentIdentityQueryResult | null);
-export default Context;
diff --git a/webui/src/layout/IfLoggedIn.tsx b/webui/src/layout/IfLoggedIn.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..8b9058dcc6b32c575082d51a86207a0e362dc9ec
--- /dev/null
+++ b/webui/src/layout/IfLoggedIn.tsx
@@ -0,0 +1,14 @@
+import React from 'react';
+
+import { useCurrentIdentityQuery } from './CurrentIdentity.generated';
+
+type Props = { children: React.ReactNode };
+const IfLoggedIn = ({ children }: Props) => {
+  const { loading, error, data } = useCurrentIdentityQuery();
+
+  if (error || loading || !data?.repository?.userIdentity) return null;
+
+  return <>{children}</>;
+};
+
+export default IfLoggedIn;
diff --git a/webui/src/layout/ReadonlyHidden.tsx b/webui/src/layout/ReadonlyHidden.tsx
deleted file mode 100644
index 9ed0af6acc625352924d4340b55c04868218a73e..0000000000000000000000000000000000000000
--- a/webui/src/layout/ReadonlyHidden.tsx
+++ /dev/null
@@ -1,19 +0,0 @@
-import React from 'react';
-
-import CurrentIdentityContext from './CurrentIdentityContext';
-
-type Props = { children: React.ReactNode };
-const ReadonlyHidden = ({ children }: Props) => (
-  <CurrentIdentityContext.Consumer>
-    {context => {
-      if (!context) return null;
-      const { loading, error, data } = context;
-
-      if (error || loading || !data?.repository?.userIdentity) return null;
-
-      return <>{children}</>;
-    }}
-  </CurrentIdentityContext.Consumer>
-);
-
-export default ReadonlyHidden;
diff --git a/webui/src/layout/index.tsx b/webui/src/layout/index.tsx
index 78ff5ae8061982383adb54502dfc3ff51bd03b53..42a0cfc1bc494d7bc08959cdfe659bc76a1c8423 100644
--- a/webui/src/layout/index.tsx
+++ b/webui/src/layout/index.tsx
@@ -2,18 +2,16 @@ import React from 'react';
 
 import CssBaseline from '@material-ui/core/CssBaseline';
 
-import { useCurrentIdentityQuery } from './CurrentIdentity.generated';
-import CurrentIdentityContext from './CurrentIdentityContext';
 import Header from './Header';
 
 type Props = { children: React.ReactNode };
 function Layout({ children }: Props) {
   return (
-    <CurrentIdentityContext.Provider value={useCurrentIdentityQuery()}>
+    <>
       <CssBaseline />
       <Header />
       {children}
-    </CurrentIdentityContext.Provider>
+    </>
   );
 }
 
diff --git a/webui/src/pages/bug/Bug.tsx b/webui/src/pages/bug/Bug.tsx
index 99b9bddd41feb016209621a08409cedba4446a62..7057f5a188382ae3c097df7845a5e4a7a7076f8d 100644
--- a/webui/src/pages/bug/Bug.tsx
+++ b/webui/src/pages/bug/Bug.tsx
@@ -6,7 +6,7 @@ import { makeStyles } from '@material-ui/core/styles';
 import Author from 'src/components/Author';
 import Date from 'src/components/Date';
 import Label from 'src/components/Label';
-import ReadonlyHidden from 'src/layout/ReadonlyHidden';
+import IfLoggedIn from 'src/layout/IfLoggedIn';
 
 import { BugFragment } from './Bug.generated';
 import CommentForm from './CommentForm';
@@ -89,11 +89,11 @@ function Bug({ bug }: Props) {
       <div className={classes.container}>
         <div className={classes.timeline}>
           <TimelineQuery id={bug.id} />
-          <ReadonlyHidden>
+          <IfLoggedIn>
             <div className={classes.commentForm}>
               <CommentForm bugId={bug.id} />
             </div>
-          </ReadonlyHidden>
+          </IfLoggedIn>
         </div>
         <div className={classes.sidebar}>
           <span className={classes.sidebarTitle}>Labels</span>
diff --git a/webui/src/pages/bug/CommentForm.graphql b/webui/src/pages/bug/CommentForm.graphql
index f4b618501b3a6becbc56f3cee6976c08ee45f5da..33d211938e35acb209ef71ba2b0f56cbc16dfa03 100644
--- a/webui/src/pages/bug/CommentForm.graphql
+++ b/webui/src/pages/bug/CommentForm.graphql
@@ -1,7 +1,5 @@
 mutation AddComment($input: AddCommentInput!) {
   addComment(input: $input) {
-    operation {
-      id
-    }
+    operation { id }
   }
 }