feat(auth): give the public pages the post page's signup banner

packages/shared/src/components/MainFeedLayout.tsx

@@ -30,7 +30,10 @@ import { useFeeds } from '../hooks/feed/useFeeds';
 import { WebappShortcutsRow } from '../features/shortcuts/components/WebappShortcutsRow';
 import { AskSearchBanner } from './marketing/banners/AskSearchBanner';
 import { FeedEngagementBanner } from './brand/FeedEngagementBanner';
-import { ExploreSignupStrip } from './auth/ExploreSignupStrip';
+import {
+  PublicPageSignupBanner,
+  usePublicPageSignupBanner,
+} from './auth/PublicPageSignupBanner';
 import FeedContext from '../contexts/FeedContext';
 import AuthContext from '../contexts/AuthContext';
 import type { LoggedUser } from '../lib/user';
@@ -249,7 +252,7 @@ export default function MainFeedLayout({
 }: MainFeedLayoutProps): ReactElement {
   useScrollRestoration();
   const { sortingEnabled, loadedSettings } = useContext(SettingsContext);
-  const { user, isTokenValid } = useContext(AuthContext);
+  const { user, isTokenValid, isAuthReady } = useContext(AuthContext);
   const { alerts } = useContext(AlertContext);
   const { numCards: feedSpacinessCards } = useContext(FeedContext);
   const feedWidthStyle = {
@@ -850,12 +853,23 @@ export default function MainFeedLayout({
     chipsTopContent
   );
 
+  const isSignupBannerVisible = usePublicPageSignupBanner();
+  const showSignupBanner =
+    !isExtension && isExploreHub && isSignupBannerVisible;
+  // Both pin to the window's bottom edge, so an anonymous visitor gets the
+  // signup banner or the sponsor dock, never both. Auth unknown counts as
+  // "banner may show": the boot cache readies GrowthBook before the remote
+  // boot answers, and the dock must not enroll a visitor it is about to
+  // leave.
+  const mayShowSignupBanner =
+    !isExtension && isExploreHub && isLaptop && (!isAuthReady || !user);
   // Read here rather than inside the feed or the strip: this is the one place
   // that owns both, so the card can only ever go missing on a surface that is
   // mounting the strip — with headlines in it — in the card's place.
   const sponsorStrip = useSponsorStripFeed({
     feedName,
     disableAds: feedProps?.disableAds,
+    suppressed: mayShowSignupBanner,
   });
   const v2ActionButtons = feedProps?.actionButtons;
   const showFeedV2PageHeader =
@@ -887,16 +901,6 @@ export default function MainFeedLayout({
       <FeedPageLayoutComponent
         className={classNames('relative', disableTopPadding && '!pt-0')}
       >
-        {!isExtension && isExploreHub && (
-          <div className={feedWidthClassName} style={feedWidthStyle}>
-            <ExploreSignupStrip
-              className={classNames(
-                'mb-4',
-                !shouldUseCommentFeedLayout && feedGutter,
-              )}
-            />
-          </div>
-        )}
         {isAnyExplore && !showExploreV2PageHeader && <FeedExploreComponent />}
         {isSearchOn && !isSearchPageLaptop && search}
         {isSearchOn && !isSearchPageLaptop && (
@@ -953,6 +957,7 @@ export default function MainFeedLayout({
           )
         )}
         {children}
+        {showSignupBanner && <PublicPageSignupBanner />}
       </FeedPageLayoutComponent>
       {/* Docked outside the page container so it spans the feed column and
           pins to the window, and mounted here rather than in each app's

packages/shared/src/components/auth/AuthenticationBanner.tsx

@@ -19,11 +19,13 @@ const Section = classed('div', 'flex flex-col');
 
 interface AuthenticationBannerProps extends PropsWithChildren {
   compact?: boolean;
+  targetId?: string;
 }
 
 export function AuthenticationBanner({
   children,
   compact,
+  targetId,
 }: AuthenticationBannerProps): ReactElement {
   const { showLogin } = useAuthContext();
 
@@ -75,6 +77,7 @@ export function AuthenticationBanner({
             ignoreMessages
             formRef={null as unknown as React.MutableRefObject<HTMLFormElement>}
             trigger={AuthTriggers.Onboarding}
+            targetId={targetId}
             simplified
             defaultDisplay={AuthDisplay.OnboardingSignup}
             forceDefaultDisplay