Refactoring structure of the UI app - #102
Merged
Merged
Conversation
Each feature now owns its DTOs under features/{feature}/model/index.ts
instead of a single central src/types/index.ts, so a feature's data
shape lives next to the code that uses it.
Each feature owns its API surface under features/{feature}/api/:
prod.ts (real ky requests, moved from src/api/*), dev.ts (in-memory
mocks derived from the existing MSW fixtures), and index.ts, which
picks one based on VITE_USE_MOCKS. Mock data and MSW request handlers
used by tests move alongside as mockData.ts and handlers.ts.
Adds MockHttpError/getErrorStatus/mockDelay to lib/apiClient.ts so
error-status checks in apiErrors.ts work uniformly against both a
real ky HTTPError and a mocked one.
Feature-specific TanStack Query hooks move from src/hooks/ into
features/{feature}/hooks/, updated to call each feature's own api/
module. The generic, domain-agnostic hooks (useDebouncedValue,
useFormState, useRowMutationState, useOptimisticPatchMutation) stay
shared in src/hooks/ and are converted to arrow functions.
calendarUtils/freeSlots -> features/calendar/lib, taskUtils -> features/tasks/lib, subscriptionUtils -> features/subscription/lib. constants.ts (lobby-type styling, task-status/priority labels, and the QUERY_KEYS cache-key registry) is split the same way, with each feature keeping its own QUERY_KEYS object so call sites didn't need renaming, only their import path. src/lib/ now holds only the truly cross-feature infra: apiClient, apiErrors, and the cn() class-merge helper.
Moves every domain component and route page out of the flat
src/components/ and src/pages/ trees into feature-owned folders under
src/features/{feature}/ (auth, calendar, dashboard, layout, lobby,
notifications, settings, subscription, tasks), grouping each
feature's larger component sets into topic subfolders (e.g.
calendar/grid, calendar/events, lobby/members, lobby/settings,
tasks/kanban) with colocated __tests__.
Introduces a new `users` feature for the cross-cutting UserDto/user
lookup surface used by auth, lobby, tasks, and calendar.
Truly shared, non-domain components stay in src/components/
(AssigneeAvatar, ConfirmDialog, EmptyState, FormField, ToggleRow, and
the shadcn-owned components/ui/), each now in its own folder as
index.tsx + __tests__/.
All `function` declarations were converted to arrow-function consts
(ES6 style) as part of this move, including in components/ui/*.
router.tsx, App.tsx, and main.tsx updated for the new import paths.
CLAUDE.md's documented conventions updated to match (route files now
live in src/features/{feature}/pages/).
Adds positive/negative coverage for every component and lib/util file that didn't already have a test: AssigneeAvatar, SettingsRow, SettingsCard, TopBar, DashboardHero, KanbanFilters, KanbanColumn, TasksPage, SearchResultRow, SearchResultsList, MemberListContent, PendingInvitesSection, LobbyLoadStates, LobbyCard, plus lib/utils.ts, lib/apiClient.ts, subscriptionUtils.ts, kanbanConstants.ts, and every feature's lib/constants.ts (QUERY_KEYS shape/uniqueness, lookup-map completeness against their enum, and any pure functions like lobbyAccentColor).
…esting conventions
Adds three docs, written from this session's full-repo refactor
(layer-first -> feature-first: components/pages into src/features/,
types into per-feature model/, API split into per-feature prod/dev/index,
hooks and lib split the same way):
- docs/ARCHITECTURE.md: the feature-folder concept, the
shared-vs-feature-owned ownership rule, the api/{prod,dev,index}.ts
mock-switch pattern and how it relates to the existing MSW/
VITE_ENABLE_MSW mocking layer, and a summary of the refactor steps
that produced this structure.
- docs/PROJECT_STRUCTURE.md: the concrete directory layout, when to
group a feature's components into a topic subfolder, and import-path
rules.
- docs/TESTING.md: where tests live, the "every component/util file
needs positive + negative coverage" rule, and conventions
(renderWithProviders, MSW over mocking ky, expect.assertions, query
priority).
Links these from lined-web/AGENTS.md and lined-web/CLAUDE.md as
required reading before writing code, and fixes stale references to
the old flat src/api|hooks|types|components layout in both files and
in the root AGENTS.md/CLAUDE.md.
|
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Purpose
Type
Changes
Files changed
Expected result
checkstyle_violationsspotbugs_totalline_coveragecritical_violationscode_smellsduplicated_lines_densityChecklist
./gradlew checkpasses locally./gradlew jacocoTestReportpasses locally