enhancement(OCFBanner): link to dashboard (#10201)

opencollective · Mar 18, 2024 · fe1eb00 · fe1eb00
1 parent db1f42d
commit fe1eb00
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 8 deletions.
diff --git a/components/OCFBanner.tsx b/components/OCFBanner.tsx
@@ -39,7 +39,7 @@ const OCFPublicBannerMessage = ({ collective, newAccount, isSimplified }) => {
   }
 };
 
-const OCFCollectiveAdminsBannerMessage = ({ account, newAccount, isCentered, hideNextSteps }) => {
+const OCFCollectiveAdminsBannerMessage = ({ account, newAccount, isCentered, hideNextSteps, isDashboard }) => {
   return (
     <React.Fragment>
       <div className="flex flex-col gap-3">
@@ -48,7 +48,10 @@ const OCFCollectiveAdminsBannerMessage = ({ account, newAccount, isCentered, hid
           {newAccount && (
             <React.Fragment>
               {newAccount.name} now operates under{' '}
-              <StyledLink as={LinkCollective} collective={newAccount}>
+              <StyledLink
+                as={Link}
+                href={isDashboard ? getDashboardRoute(newAccount) : getCollectivePageRoute(newAccount)}
+              >
                 @{newAccount.slug}
               </StyledLink>
               {'. '}
@@ -97,6 +100,7 @@ export const getOCFBannerMessage = ({
   hideNextSteps,
   isCentered = false,
   isSimplified = false,
+  isDashboard = false,
 }): {
   title: string;
   severity: 'error' | 'warning';
@@ -120,6 +124,7 @@ export const getOCFBannerMessage = ({
           newAccount={newAccount}
           isCentered={isCentered}
           hideNextSteps={hideNextSteps}
+          isDashboard={isDashboard}
         />
       ),
     };
@@ -130,6 +135,7 @@ type OCFBannerProps = {
   collective: Pick<Account, 'slug'>;
   hideNextSteps?: boolean;
   isSimplified?: boolean;
+  isDashboard?: boolean;
 };
 
 export function OCFBannerWithData(props: OCFBannerProps) {
@@ -212,6 +218,7 @@ export function OCFBannerWithData(props: OCFBannerProps) {
       newAccount,
       hideNextSteps: props.hideNextSteps,
       isSimplified: props.isSimplified,
+      isDashboard: props.isDashboard,
     });
 
     return (
@@ -229,7 +236,11 @@ export function OCFBannerWithData(props: OCFBannerProps) {
           <p className="text-lg font-semibold">Reminder: You have an account pending to close.</p>
           <p className="text-sm">
             The remaining balance from your previous Fiscal Host is in this account:{' '}
-            <StyledLink as={LinkCollective} collective={oldAccount}>
+            <StyledLink
+              as={Link}
+              collective={oldAccount}
+              href={props.isDashboard ? getDashboardRoute(oldAccount) : getCollectivePageRoute(oldAccount)}
+            >
               @{oldAccount.slug}
             </StyledLink>
             . Is not able to receive contributions, you should zero-out this account soon.

diff --git a/components/dashboard/DashboardSection.tsx b/components/dashboard/DashboardSection.tsx
@@ -73,7 +73,7 @@ const DashboardSection = ({ account, isLoading, section, subpath }) => {
   if (isLoading) {
     return (
       <div className="w-full">
-        <OCFBannerWithData collective={account} hideNextSteps={section === 'host'} />
+        <OCFBannerWithData isDashboard collective={account} hideNextSteps={section === 'host'} />
         <LoadingPlaceholder height={26} mb={4} maxWidth={500} />
         <LoadingPlaceholder height={300} />
       </div>
@@ -89,7 +89,7 @@ const DashboardSection = ({ account, isLoading, section, subpath }) => {
     }
     return (
       <div className="w-full">
-        <OCFBannerWithData collective={account} hideNextSteps={section === 'host'} />
+        <OCFBannerWithData isDashboard collective={account} hideNextSteps={section === 'host'} />
         <DashboardComponent accountSlug={account.slug} subpath={subpath} isDashboard />
       </div>
     );
@@ -98,7 +98,7 @@ const DashboardSection = ({ account, isLoading, section, subpath }) => {
   if (values(LEGACY_SECTIONS).includes(section)) {
     return (
       <div className="w-full max-w-screen-lg">
-        <OCFBannerWithData collective={account} hideNextSteps={section === 'host'} />
+        <OCFBannerWithData isDashboard collective={account} hideNextSteps={section === 'host'} />
         {SECTION_LABELS[section] && <DashboardHeader className="mb-2" title={formatMessage(SECTION_LABELS[section])} />}
 
         <AccountSettings account={account} section={section} />
@@ -112,7 +112,7 @@ const DashboardSection = ({ account, isLoading, section, subpath }) => {
     return (
       // <div className="flex max-w-screen-lg justify-center">
       <div className="max-w-screen-md flex-1">
-        <OCFBannerWithData collective={account} hideNextSteps={section === 'host'} />
+        <OCFBannerWithData isDashboard collective={account} hideNextSteps={section === 'host'} />
         <SettingsComponent account={account} accountSlug={account.slug} subpath={subpath} />
       </div>
       // </div>
@@ -123,7 +123,7 @@ const DashboardSection = ({ account, isLoading, section, subpath }) => {
     return (
       // <div className="flex max-w-screen-lg justify-center">
       <div className="max-w-screen-md flex-1">
-        <OCFBannerWithData collective={account} hideNextSteps={section === 'host'} />
+        <OCFBannerWithData isDashboard collective={account} hideNextSteps={section === 'host'} />
         {SECTION_LABELS[section] && <DashboardHeader className="mb-2" title={formatMessage(SECTION_LABELS[section])} />}
 
         <AccountSettings account={account} section={section} />