From 761061c9a80737d4a473815f481170bf2c0bfae6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?marcin=20miko=C5=82ajczak?= <git@mkljczk.pl>
Date: Mon, 12 Dec 2022 23:58:11 +0100
Subject: [PATCH] Default header should not be clickable
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: marcin mikołajczak <git@mkljczk.pl>
---
 .../features/account/components/header.tsx    | 33 ++++++++++++++-----
 .../event/components/event-header.tsx         |  1 +
 .../steps/cover-photo-selection-step.tsx      |  4 +--
 3 files changed, 28 insertions(+), 10 deletions(-)

diff --git a/app/soapbox/features/account/components/header.tsx b/app/soapbox/features/account/components/header.tsx
index 47584dc68..02d7c0320 100644
--- a/app/soapbox/features/account/components/header.tsx
+++ b/app/soapbox/features/account/components/header.tsx
@@ -21,6 +21,7 @@ import StillImage from 'soapbox/components/still-image';
 import { Avatar, HStack, IconButton, Menu, MenuButton, MenuDivider, MenuItem, MenuLink, MenuList } from 'soapbox/components/ui';
 import SvgIcon from 'soapbox/components/ui/icon/svg-icon';
 import MovedNote from 'soapbox/features/account-timeline/components/moved-note';
+import { isDefaultHeader } from 'soapbox/features/onboarding/steps/cover-photo-selection-step';
 import ActionButton from 'soapbox/features/ui/components/action-button';
 import SubscriptionButton from 'soapbox/features/ui/components/subscription-button';
 import { useAppDispatch, useFeatures, useOwnAccount } from 'soapbox/hooks';
@@ -502,6 +503,29 @@ const Header: React.FC<IHeader> = ({ account }) => {
     return info;
   };
 
+  const renderHeader = () => {
+    let header: React.ReactNode;
+
+    if (account.header) {
+      header = (
+        <StillImage
+          src={account.header}
+          alt={intl.formatMessage(messages.header)}
+        />
+      );
+
+      if (!isDefaultHeader(account.header)) {
+        header = (
+          <a href={account.header} onClick={handleHeaderClick} target='_blank'>
+            {header}
+          </a>
+        );
+      }
+    }
+
+    return header;
+  };
+
   const renderMessageButton = () => {
     if (features.chatsWithFollowers) { // Truth Social
       if (!ownAccount || !account || account.id === ownAccount?.id) {
@@ -570,14 +594,7 @@ const Header: React.FC<IHeader> = ({ account }) => {
 
       <div>
         <div className='relative flex flex-col justify-center h-32 w-full lg:h-48 md:rounded-t-xl bg-gray-200 dark:bg-gray-900/50 overflow-hidden isolate'>
-          {account.header && (
-            <a href={account.header} onClick={handleHeaderClick} target='_blank'>
-              <StillImage
-                src={account.header}
-                alt={intl.formatMessage(messages.header)}
-              />
-            </a>
-          )}
+          {renderHeader()}
 
           <div className='absolute top-2 left-2'>
             <HStack alignItems='center' space={1}>
diff --git a/app/soapbox/features/event/components/event-header.tsx b/app/soapbox/features/event/components/event-header.tsx
index dd7a66d88..adfb2dc32 100644
--- a/app/soapbox/features/event/components/event-header.tsx
+++ b/app/soapbox/features/event/components/event-header.tsx
@@ -95,6 +95,7 @@ const EventHeader: React.FC<IEventHeader> = ({ status }) => {
   const username = account.username;
 
   const handleHeaderClick: React.MouseEventHandler<HTMLAnchorElement> = (e) => {
+    e.preventDefault();
     e.stopPropagation();
 
     dispatch(openModal('MEDIA', { media: ImmutableList([event.banner]) }));
diff --git a/app/soapbox/features/onboarding/steps/cover-photo-selection-step.tsx b/app/soapbox/features/onboarding/steps/cover-photo-selection-step.tsx
index e1a9c5f30..f5ab0d0ab 100644
--- a/app/soapbox/features/onboarding/steps/cover-photo-selection-step.tsx
+++ b/app/soapbox/features/onboarding/steps/cover-photo-selection-step.tsx
@@ -24,8 +24,8 @@ const DEFAULT_HEADERS = [
 ];
 
 /** Check if the avatar is a default avatar */
-const isDefaultHeader = (url: string) => {
-  return DEFAULT_HEADERS.every(header => url.endsWith(header));
+export const isDefaultHeader = (url: string) => {
+  return DEFAULT_HEADERS.some(header => url.endsWith(header));
 };
 
 const CoverPhotoSelectionStep = ({ onNext }: { onNext: () => void }) => {