Hacktoberfest 2026: le issue che i maintainer hanno segnato per ottobre, aperte e adatte ai principianti. Sfoglia le issue Hacktoberfest

Phone shell: Home · Projects · Inbox with Search, one "+", the view menu in the title, no tab bar in a conversation

Chiusa
  • Qualcosa non va?
#341 2 commenti 0 reazioni 1 assegnatario Vedi su GitHub

I maintainer di solito rispondono entro 1 giorno

@PelikanFix16 ci sta già lavorando.

Dal 8/10/2026.

Valutazione

Difficoltà
4/5
Tempo stimato
3-5 giorni
Idoneità per principianti
35/100
Tipo di issue
Funzionalità
Chiarezza
Specificata chiaramente
Stato di attività
Attiva
Stack tecnologico
typescript
Ambito
frontend

Direzione di ricerca

Start with app/AppLayout.tsx and ui/Tabs.tsx for the phone shell, then inspect dm/DmIndex.tsx and the named task components; use the design guide and renders as the reference. Rewrite the listed UI tests, especially test_phone_shell.py, and run ./scripts/check_ui.sh. Done means the acceptance criteria hold at the specified phone sizes and the updated UI tests pass; coordinate with the owner and account for dependencies #338 and #339.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Descrizione

agent:ready enhancement

Part of #336 (F-026, founder direction 2026-10-07). Design guide: docs/design/final (phone · §1 principles; until #337 merges, read the pinned copy). Interactive boards (light/dark toggle, notes): design canvas, page "Prostota".

Outcome

On the phone, Flux has one floating tab bar, one "+", one view menu in the project title, and conversations that get the whole screen.

Final design

phone-home phone-projects phone-viewsmenu phone-create phone-conversation phone-search

Acceptance criteria

  • AC-1. A floating capsule tab bar holds Home · Projects · Inbox, with a separate round Search button. Direct messages live in Projects. No other bottom bar exists.
  • AC-2. One floating "+" above the tab bar opens the Create sheet: Task, Thought, Message, Decision, File or link, Sketch. No other "+" appears in a phone header.
  • AC-3. Inside a project, the title opens the view menu: Conversation, Tasks, Map, Wiki, Agents, then "Details, goal and people". There are no chip rows and no stacked toolbars, and Decisions is not a view.
  • AC-4. In a conversation the tab bar is hidden, the composer sits at the bottom above the safe area, and Back returns to where the person came from.
  • AC-5. Touch targets are at least 44 px, meta text at least 12.5 px and body text 15–16 px. Type uses rem, so the system text size applies. 390 × 844 and 320 px match the renders without sideways scrolling.

What changes in the code today

From a read of main at 3c553b79; the owner confirms before starting. Paths are under app/apps/web/src, public/ is app/apps/web/public, root scripts/ and tests/ are the repository's, and UI tests are in app/tests/ui.

Change

  • app/AppLayout.tsx + ui/Tabs.tsx BottomNav: Home · Inbox · Messages · Projects, shown in conversations too → floating capsule Home · Projects · Inbox + round Search, hidden in a conversation.
  • DM list moves into Projects (dm/DmIndex.tsx); the project title becomes the view menu.
  • app/AppLayout.tsx (around lines 239–249): the on-screen-keyboard heuristic (innerHeight - visualViewport.height > 120) also fires on pinch-zoom, because it does not check visualViewport.scale. Carried over from the #267 review (N1).

Remove

  • The Messages tab; the hamburger nav Drawer (≤ 680 px); the state-row with "What matters"; project view chips (views--chips); DM chips Messages · Sketches; the phone "+" in the Tasks header (work/ProjectTasks.tsx tb-add) and board columns (work/TaskBoard.tsx).

New

  • One floating "+" and the Create sheet; the view menu sheet; safe-area composer layout.

Tests to rewrite

  • test_phone_shell.py (PLACES at line 19, chips in 01/02, Details/What matters in 03, drawer swipe in 06, tasks toolbar in 10), test_direct_messages.py, test_app_shell.py::06, test_adaptive_matrix.py.

Depends on

#338, #339 (tokens and shared components first; independent parts can start earlier).

How to test

./scripts/check_ui.sh            # browser suite; add the new or changed tests
./scripts/check_application.sh   # when API or data paths change
python3 scripts/check_agent_setup.py && git diff --check

Compare with the renders above at 1440 × 900 and 390 × 844 CSS px, in light and dark, on ./flux demo data, then get an independent visual review with a neutral brief (guide §9). Screenshots do not prove interaction or accessibility, so also test keyboard, touch (Chromium and WebKit emulation), reduced motion and contrast in the running app.

Owner: whoever claims it (assign yourself and comment once). Evaluator: the other agent. The design is a founder direction: implement it as drawn; raise a conflict with a functional contract on #336 instead of changing the design.

Updated 2026-10-07: carries the pinch-zoom keyboard follow-up from the #267 review.

Lingua principale
TypeScript
Stelle
3
Fork
0
Merge medio
20h 42m
PR unite (30g)
371

Preparare l'ambiente

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di ColdPhase/flux

Tutte le issue di ColdPhase/flux

Issue simili

Altre issue su TypeScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.