Reorganise into feature folders and extract reusable components
- Dominant language
- TypeScript
- Stars
- 2
- Forks
- 0
- PR merge metrics
- No merged PRs in 30d
Description
`src/components` is flat with a mix of UI primitives and feature components. Suggested layout:
```
src/
components/ ← truly shared, dumb UI (Button, Pill, ScrollRow)
features/
stations/
api.ts ← server fns + query options
types.ts
StationCard.tsx
StationGrid.tsx
CountryFilter.tsx
player/
Player.tsx
InlinePlayer.tsx
useAudioPlayer.ts
audioRegistry.ts
routes/
lib/ ← framework-level (db, env, pagination)
```
## Concrete extractions from `src/routes/index.tsx`
- The country pill scroller (lines ~156–224) → `` with `scrollRef`, `canScrollLeft/Right`, gradient fades.
- The `
- The repeated arrow-button SVG → ``.
**Files**
- `src/routes/index.tsx`
- `src/components/`
Contributor guide
No contributing guide indexed for this repository
Research direction
Read src/routes/index.tsx first, focusing on the country pill scroller, station card, and repeated arrow-button SVG around the mentioned lines. Extract these into the named components and organize the feature folders as shown, with the station card using a real button; done means the listed responsibilities are separated without losing keyboard, focus, or screen-reader behavior.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- typescript
- Domain
- accessibility, frontend
- Issue type
- Refactor
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Quiet
- Clarity
- Clearly specified
- Newbie friendliness
- 55/100