Restrict reminder component to /now view only

packages/web/src/views/Calendar/components/Header/Header.tsx

@@ -1,4 +1,4 @@
-import { FC, useRef } from "react";
+import { FC } from "react";
 import dayjs, { Dayjs } from "@core/util/date/dayjs";
 import { theme } from "@web/common/styles/theme";
 import { getCalendarHeadingLabel } from "@web/common/utils/datetime/web.date.util";
@@ -12,11 +12,9 @@ import { viewSlice } from "@web/ducks/events/slices/view.slice";
 import { useAppDispatch, useAppSelector } from "@web/store/store.hooks";
 import { RootProps } from "../../calendarView.types";
 import { Util_Scroll } from "../../hooks/grid/useScroll";
-import { useReminderHotkey } from "../../hooks/shortcuts/useFocusHotkey";
 import { WeekProps } from "../../hooks/useWeek";
 import { TodayButton } from "../TodayButton/TodayButton";
 import { DayLabels } from "./DayLabels";
-import { Reminder } from "./Reminder/Reminder";
 import {
   ArrowNavigationButton,
   StyledHeaderLabel,
@@ -51,10 +49,6 @@ export const Header: FC<Props> = ({ scrollUtil, today, weekProps }) => {
     scrollToNow();
   };
 
-  const reminderRef = useRef<HTMLDivElement>(null);
-
-  useReminderHotkey(() => reminderRef.current?.focus(), [reminderRef]);
-
   return (
     <>
       <StyledHeaderRow alignItems={AlignItems.BASELINE}>
@@ -76,7 +70,6 @@ export const Header: FC<Props> = ({ scrollUtil, today, weekProps }) => {
             <Text size="xl">{headerLabel}</Text>
           </StyledHeaderLabel>
         </StyledLeftGroup>
-        <Reminder ref={reminderRef} />
         <StyledRightGroup>
           <SelectView />
           <div>

packages/web/src/views/Day/components/Header/Header.test.tsx

@@ -4,9 +4,23 @@ import { renderWithMemoryRouter } from "@web/__tests__/utils/providers/MemoryRou
 import { Header } from "./Header";
 
 describe("Header", () => {
-  it("renders the header with reminder and view selector", async () => {
+  it("renders the header without reminder by default", async () => {
     await renderWithMemoryRouter(<Header />);
 
+    // Check that Reminder component is NOT rendered by default
+    expect(
+      screen.queryByText("Click to add your reminder"),
+    ).not.toBeInTheDocument();
+
+    // Check that SelectView component is rendered
+    expect(
+      screen.getByRole("button", { name: /select view/i }),
+    ).toBeInTheDocument();
+  });
+
+  it("renders the header with reminder when showReminder is true", async () => {
+    await renderWithMemoryRouter(<Header showReminder={true} />);
+
     // Check that Reminder component is rendered (shows placeholder when no reminder)
     expect(screen.getByText("Click to add your reminder")).toBeInTheDocument();
 
@@ -17,7 +31,7 @@ describe("Header", () => {
   });
 
   it("renders with proper layout structure", async () => {
-    await renderWithMemoryRouter(<Header />);
+    await renderWithMemoryRouter(<Header showReminder={true} />);
 
     // Check that the header row exists (it should be a div with specific styling)
     // Since StyledHeaderRow is a styled div, we can check for the presence of its children

packages/web/src/views/Day/components/Header/Header.tsx

@@ -8,16 +8,23 @@ import {
 } from "@web/views/Calendar/components/Header/styled";
 import { useReminderHotkey } from "@web/views/Calendar/hooks/shortcuts/useFocusHotkey";
 
-export const Header: FC = () => {
+interface HeaderProps {
+  showReminder?: boolean;
+}
+
+export const Header: FC<HeaderProps> = ({ showReminder = false }) => {
   const reminderRef = useRef<HTMLDivElement>(null);
 
-  useReminderHotkey(() => reminderRef.current?.focus(), [reminderRef]);
+  useReminderHotkey(
+    showReminder ? () => reminderRef.current?.focus() : () => {},
+    [reminderRef, showReminder],
+  );
 
   return (
     <StyledHeaderRow alignItems={AlignItems.BASELINE}>
       <StyledLeftGroup />
 
-      <Reminder ref={reminderRef} />
+      {showReminder && <Reminder ref={reminderRef} />}
 
       <SelectView />
     </StyledHeaderRow>

packages/web/src/views/Now/view/NowView.tsx

@@ -24,7 +24,7 @@ export const NowView = () => {
     <NowViewProvider>
       <NowCmdPalette />
       <StyledCalendar>
-        <Header />
+        <Header showReminder={true} />
 
         <div
           className={`from-bg-bg-primary via-bg-bg-secondary to-bg-bg-primary flex max-w-3/4 min-w-3/4 flex-1 justify-center gap-8 self-center overflow-hidden bg-gradient-to-b`}

packages/web/src/views/Onboarding/OnboardingFlow.tsx

@@ -23,8 +23,6 @@ import {
   DayTasksIntro,
   OutroQuote,
   OutroTwo,
-  SetReminder,
-  SetReminderSuccess,
   SignInWithGoogle,
   SignInWithGooglePrelude,
   TasksIntro,
@@ -39,8 +37,6 @@ import { SomedayEventsIntro } from "@web/views/Onboarding/steps/events/SomedayEv
 import { SomedaySandbox } from "@web/views/Onboarding/steps/events/SomedaySandbox/SomedaySandbox";
 import { MobileSignIn } from "@web/views/Onboarding/steps/mobile/MobileSignIn";
 import { MobileWarning } from "@web/views/Onboarding/steps/mobile/MobileWarning";
-import { ReminderIntroOne } from "@web/views/Onboarding/steps/reminder/ReminderIntroOne";
-import { ReminderIntroTwo } from "@web/views/Onboarding/steps/reminder/ReminderIntroTwo";
 import { TasksToday } from "@web/views/Onboarding/steps/tasks/TasksToday/TasksToday";
 
 const loginSteps: OnboardingStepType[] = [
@@ -89,29 +85,11 @@ const onboardingSteps: OnboardingStepType[] = [
     component: (props: OnboardingStepProps) => <SignInWithGoogle {...props} />,
     handlesKeyboardEvents: true,
   },
-  {
-    id: ONBOARDING_STEP_IDS.REMINDER_INTRO_ONE,
-    component: (props: OnboardingStepProps) => <ReminderIntroOne {...props} />,
-    disablePrevious: true,
-  },
-  {
-    id: ONBOARDING_STEP_IDS.REMINDER_INTRO_TWO,
-    component: (props: OnboardingStepProps) => <ReminderIntroTwo {...props} />,
-  },
-  {
-    id: ONBOARDING_STEP_IDS.SET_REMINDER,
-    component: (props: OnboardingStepProps) => <SetReminder {...props} />,
-  },
-  {
-    id: ONBOARDING_STEP_IDS.SET_REMINDER_SUCCESS,
-    component: (props: OnboardingStepProps) => (
-      <SetReminderSuccess {...props} />
-    ),
-  },
 
   {
     id: ONBOARDING_STEP_IDS.SET_SOMEDAY_EVENTS_ONE,
     component: (props: OnboardingStepProps) => <DayTasksIntro {...props} />,
+    disablePrevious: true,
   },
   {
     id: ONBOARDING_STEP_IDS.TASKS_INTRO,

packages/web/src/views/Onboarding/constants/onboarding.constants.ts

@@ -16,10 +16,6 @@ export const ONBOARDING_STEP_IDS = {
   WELCOME_NOTE_TWO: "welcome-note-two",
   SIGN_IN_WITH_GOOGLE_PRELUDE: "sign-in-with-google-prelude",
   SIGN_IN_WITH_GOOGLE: "sign-in-with-google",
-  REMINDER_INTRO_ONE: "reminder-intro-one",
-  REMINDER_INTRO_TWO: "reminder-intro-two",
-  SET_REMINDER: "set-reminder",
-  SET_REMINDER_SUCCESS: "set-reminder-success",
   SET_SOMEDAY_EVENTS_ONE: "set-someday-events-one",
   TASKS_INTRO: "tasks-intro",
   TASKS_TODAY: "tasks-today",

packages/web/src/views/Onboarding/steps/index.ts

@@ -5,8 +5,6 @@ export * from "./welcome/WelcomeNoteTwo";
 export * from "./oauth/SignInWithGooglePrelude";
 export * from "./oauth/SignInWithGoogle";
 export * from "./oauth/SignInWithGoogleSuccess";
-export * from "./reminder/SetReminder";
-export * from "./reminder/SetReminderSuccess";
 export * from "./tasks/DayTasksIntro/DayTasksIntro";
 export * from "./tasks/TasksIntro/TasksIntro";
 export * from "./outro/OutroTwo";