feat(web): restrict someday event recurrence to weekly/monthly only#1017
feat(web): restrict someday event recurrence to weekly/monthly only#1017tyler-dane merged 18 commits intomainfrom
Conversation
…ions Co-authored-by: tyler-dane <30163055+tyler-dane@users.noreply.github.com>
…n RecurrenceSection components
…handling and styling
…ies for better accessibility
…bobox interaction checks
| import { parseCompassEventDate } from "@core/util/event/event.util"; | ||
| import { theme } from "@web/common/styles/theme"; | ||
| import { hoverColorByPriority } from "@web/common/styles/theme.util"; | ||
| import { ConditionalRender } from "@web/components/ConditionalRender/conditional-render"; |
There was a problem hiding this comment.
This component wasn't providing any additional value or functionality from the standard JSX rendering. It also introduced a second way to render conditionally, which makes the codebase less consistent.
There was a problem hiding this comment.
@tyler-dane I didn't see this on time. This component is needed to ensure we have a cleaner rendering process.
It also allows us to replace the inconsistent rendering logic using && which relies on JS's short-circuiting evalutation which can sometimes produce unexpected results.
There was a problem hiding this comment.
Summarizing an offline meeting:
Instead of using ConditonalRender we decided
- to get away from ternary and nested ternary, we'll use a local conditional component, where it returns a component or
null. It'll just use pure React, though (not a customConditionalRendercomponent)
Pros & Cons:
Why ConditionalRender
- reduces context switching between HTML and JSX
- preference
- easier to understand — avoids bugs with && and conditional
- platform/version agnostic (runs same on web vs electron, eg)
Why not ConditionalRender
- verbose
- multiple patterns
- raises barrier to entry for new contributors
- doesn’t do anything that JS that JSX + variables can’t do
There was a problem hiding this comment.
Pull Request Overview
Introduces a specialized SomedayRecurrenceSection to restrict Someday event recurrence to weekly or monthly, removes UI elements not applicable to Someday events, and refactors recurrence utilities into clearer modules.
- Adds Someday-specific recurrence select (weekly/monthly only) and removes daily option, interval, weekday, and end-date controls from Someday recurrence UI.
- Refactors recurrence utilities into constants, util, and hook-specific files with expanded unit tests.
- Adjusts keyboard handling to avoid form submission conflicts when interacting with recurrence comboboxes.
Reviewed Changes
Copilot reviewed 20 out of 21 changed files in this pull request and generated 5 comments.
Show a summary per file
| File | Description |
|---|---|
| SomedayEventForm/useSomedayFormShortcuts.ts | Adds combobox interaction guard to Enter hotkey handling. |
| SomedayEventForm/useSomedayFormShortcuts.test.tsx | Tests new combobox handling behavior. |
| SomedayEventForm/SomedayEventForm.tsx | Integrates new SomedayRecurrenceSection and adjusts Enter handling. |
| EventForm/EventForm.tsx | Updates import path for DateControlsSection. |
| EventForm/EventForm.test.tsx | Passes category prop (potentially extraneous) into EventForm. |
| RecurrenceSection/* (new + refactor) | Splits recurrence constants, utils, and hook tests; adds Someday recurrence components. |
| RecurrenceSection/util & constants tests | Adds granular unit tests for recurrence transformations. |
| RecurrenceSection/useRecurrence/useRecurrence.ts | Refactors hook; (introduces an incorrect type import). |
| RecurrenceSection/styled.ts | Styling adjustments for recurrence UI affordances. |
| SomedayRecurrenceSection/* | New Someday-specific recurrence selector components and tests. |
| RecurrenceSection/RecurrenceSection.tsx | Removes ConditionalRender usage in favor of inline conditionals. |
| DateControlsSection/DateControlsSection.tsx | Adjusts relative import path for DateTimeSection. |
| ConditionalRender/conditional-render.tsx | Removes unused ConditionalRender component. |
...c/views/Forms/EventForm/DateControlsSection/RecurrenceSection/useRecurrence/useRecurrence.ts
Outdated
Show resolved
Hide resolved
...currenceSection/SomedayRecurrenceSection/SomedayRecurrenceSelect/SomedayRecurrenceSelect.tsx
Show resolved
Hide resolved
...ControlsSection/RecurrenceSection/SomedayRecurrenceSection/SomedayRecurrenceSection.test.tsx
Show resolved
Hide resolved
...currenceSection/SomedayRecurrenceSection/SomedayRecurrenceSelect/SomedayRecurrenceSelect.tsx
Show resolved
Hide resolved
…urrenceSection/useRecurrence/useRecurrence.ts Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
Problem
Someday event forms were allowing users to create daily recurring events, which doesn't make sense in the context of the someday list. The someday list organizes tasks according to weekly and monthly timeframes with a limit of 9 tasks per period. Daily recurrence would result in 7 identical tasks in the current week, breaking this organizational structure.
Solution
Created a specialized

SomedayRecurrenceSectioncomponent that restricts recurrence options for someday events while maintaining all core functionality.Fixes #1005
Related to #1058 <- this is happening in
mainand this branch, which means this bug wasn't introduced in this PR. Therefore, I'm moving foward with thisThis pull request refactors the recurrence controls in the event form, primarily by removing the
ConditionalRendercomponent and replacing it with direct conditional rendering. It also introduces a newSomedayRecurrenceSectioncomponent with comprehensive tests, and reorganizes recurrence-related imports for better clarity and maintainability.Refactoring and Code Simplification
ConditionalRendercomponent and replaced all its usages inRecurrenceSectionwith direct conditional rendering, simplifying the logic and reducing unnecessary abstraction (conditional-render.tsx,RecurrenceSection.tsx). [1] [2] [3] [4]Feature Addition and Testing
SomedayRecurrenceSectioncomponent for handling recurrence options for "someday" events, including logic for opening/closing the select menu, handling option selection, and canceling edits (SomedayRecurrenceSection.tsx).SomedayRecurrenceSection, covering rendering, recurrence option selection, UI restrictions, keyboard interactions, and state restoration (SomedayRecurrenceSection.test.tsx).Code Organization and Import Updates
DateControlsSection.tsx,RecurrenceSection.tsx). [1] [2] [3]