Include CtaBanner in layouts

app/soapbox/features/ui/util/async-components.ts

@@ -346,6 +346,10 @@ export function SignUpPanel() {
   return import(/* webpackChunkName: "features/ui" */'../components/panels/sign-up-panel');
 }
 
+export function CtaBanner() {
+  return import(/* webpackChunkName: "features/ui" */'../components/cta-banner');
+}
+
 export function FundingPanel() {
   return import(/* webpackChunkName: "features/ui" */'../components/funding_panel');
 }

app/soapbox/pages/default_page.tsx

@@ -6,6 +6,7 @@ import {
   WhoToFollowPanel,
   TrendsPanel,
   SignUpPanel,
+  CtaBanner,
 } from 'soapbox/features/ui/util/async-components';
 import { useAppSelector, useFeatures } from 'soapbox/hooks';
 
@@ -19,6 +20,12 @@ const DefaultPage: React.FC = ({ children }) => {
     <>
       <Layout.Main>
         {children}
+
+        {!me && (
+          <BundleContainer fetchComponent={CtaBanner}>
+            {Component => <Component key='cta-banner' />}
+          </BundleContainer>
+        )}
       </Layout.Main>
 
       <Layout.Aside>

app/soapbox/pages/home_page.tsx

@@ -10,6 +10,7 @@ import {
   FundingPanel,
   CryptoDonatePanel,
   BirthdayPanel,
+  CtaBanner,
 } from 'soapbox/features/ui/util/async-components';
 import { useAppSelector, useOwnAccount, useFeatures, useSoapboxConfig } from 'soapbox/hooks';
 
@@ -56,6 +57,12 @@ const HomePage: React.FC = ({ children }) => {
         )}
 
         {children}
+
+        {!me && (
+          <BundleContainer fetchComponent={CtaBanner}>
+            {Component => <Component key='cta-banner' />}
+          </BundleContainer>
+        )}
       </Layout.Main>
 
       <Layout.Aside>

app/soapbox/pages/profile_page.tsx

@@ -10,6 +10,7 @@ import {
   ProfileMediaPanel,
   ProfileFieldsPanel,
   SignUpPanel,
+  CtaBanner,
 } from 'soapbox/features/ui/util/async-components';
 import { useAppSelector, useFeatures, useSoapboxConfig } from 'soapbox/hooks';
 import { findAccountByUsername } from 'soapbox/selectors';
@@ -134,6 +135,12 @@ const ProfilePage: React.FC<IProfilePage> = ({ params, children }) => {
             {children}
           </div>
         </Column>
+
+        {!me && (
+          <BundleContainer fetchComponent={CtaBanner}>
+            {Component => <Component key='cta-banner' />}
+          </BundleContainer>
+        )}
       </Layout.Main>
 
       <Layout.Aside>

app/soapbox/pages/status_page.js

@@ -7,6 +7,7 @@ import {
   WhoToFollowPanel,
   TrendsPanel,
   SignUpPanel,
+  CtaBanner,
 } from 'soapbox/features/ui/util/async-components';
 // import GroupSidebarPanel from '../features/groups/sidebar_panel';
 import { getFeatures } from 'soapbox/utils/features';
@@ -35,6 +36,12 @@ class StatusPage extends ImmutablePureComponent {
       <>
         <Layout.Main>
           {children}
+
+          {!me && (
+            <BundleContainer fetchComponent={CtaBanner}>
+              {Component => <Component key='cta-banner' />}
+            </BundleContainer>
+          )}
         </Layout.Main>
 
         <Layout.Aside>