From eccfdb90f835ede0dccbd115d474006326c6a711 Mon Sep 17 00:00:00 2001
From: Alex Gleason <alex@alexgleason.me>
Date: Thu, 11 Aug 2022 14:02:01 -0500
Subject: [PATCH] Header: make account optional again

---
 .../features/account/components/header.tsx    | 42 +++++++++----------
 app/soapbox/pages/profile_page.tsx            |  4 +-
 2 files changed, 22 insertions(+), 24 deletions(-)

diff --git a/app/soapbox/features/account/components/header.tsx b/app/soapbox/features/account/components/header.tsx
index fe7bb7497..f15b3b635 100644
--- a/app/soapbox/features/account/components/header.tsx
+++ b/app/soapbox/features/account/components/header.tsx
@@ -96,7 +96,7 @@ const messages = defineMessages({
 });
 
 interface IHeader {
-  account: Account,
+  account?: Account,
 }
 
 const Header: React.FC<IHeader> = ({ account }) => {
@@ -107,6 +107,26 @@ const Header: React.FC<IHeader> = ({ account }) => {
   const features = useFeatures();
   const ownAccount = useOwnAccount();
 
+  if (!account) {
+    return (
+      <div className='-mt-4 -mx-4'>
+        <div>
+          <div className='relative h-32 w-full lg:h-48 md:rounded-t-xl bg-gray-200 dark:bg-gray-900/50' />
+        </div>
+
+        <div className='px-4 sm:px-6'>
+          <div className='-mt-12 flex items-end space-x-5'>
+            <div className='flex relative'>
+              <div
+                className='h-24 w-24 bg-gray-400 rounded-full ring-4 ring-white dark:ring-gray-800'
+              />
+            </div>
+          </div>
+        </div>
+      </div>
+    );
+  }
+
   const onBlock = () => {
     if (account.relationship?.blocking) {
       dispatch(unblockAccount(account.id));
@@ -701,26 +721,6 @@ const Header: React.FC<IHeader> = ({ account }) => {
     );
   };
 
-  if (!account) {
-    return (
-      <div className='-mt-4 -mx-4'>
-        <div>
-          <div className='relative h-32 w-full lg:h-48 md:rounded-t-xl bg-gray-200 dark:bg-gray-900/50' />
-        </div>
-
-        <div className='px-4 sm:px-6'>
-          <div className='-mt-12 flex items-end space-x-5'>
-            <div className='flex relative'>
-              <div
-                className='h-24 w-24 bg-gray-400 rounded-full ring-4 ring-white dark:ring-gray-800'
-              />
-            </div>
-          </div>
-        </div>
-      </div>
-    );
-  }
-
   const info = makeInfo();
   const menu = makeMenu();
 
diff --git a/app/soapbox/pages/profile_page.tsx b/app/soapbox/pages/profile_page.tsx
index bcf6ef081..9c5a4a55e 100644
--- a/app/soapbox/pages/profile_page.tsx
+++ b/app/soapbox/pages/profile_page.tsx
@@ -98,9 +98,7 @@ const ProfilePage: React.FC<IProfilePage> = ({ params, children }) => {
       <Layout.Main>
         <Column label={account ? `@${getAcct(account, displayFqn)}` : ''} withHeader={false}>
           <div className='space-y-4'>
-            {account && (
-              <Header account={account} />
-            )}
+            <Header account={account} />
 
             <BundleContainer fetchComponent={ProfileInfoPanel}>
               {Component => <Component username={username} account={account} />}