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

[Bug]: Mobile usage filter shows a dot while loading and nothing when an environment fails

Aperta Adatta ai principianti
#15,558 1 commento 0 reazioni 0 assegnatari Vedi su GitHub

I maintainer di solito rispondono entro 1 giorno

Nessuno ha ancora preso questa issue.

Valutazione

Difficoltà
2/5
Tempo stimato
1-3 ore
Idoneità per principianti
84/100
Tipo di issue
Bug
Chiarezza
Specificata chiaramente
Stato di attività
Attiva
Stack tecnologico
typescript
Ambito
mobile-dev

Direzione di ricerca

Inizia da apps/mobile/src/features/usage/UsageRouteScreen.tsx, in particolare da hasLoadingEnvironments e isUsageLoading, poi confronta la logica equivalente in apps/web/src/components/usage/UsagePage.tsx usando pendingCount e hasIssue. Il lavoro è completato quando il caricamento usa uno spinner con il testo di scanning esistente, mentre il punto del filtro e l’etichetta di accessibilità identificano gli ambienti selezionati con errori o differenze nella versione di usage.

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

Descrizione

bug via-triage
Before submitting
  • I searched existing issues and did not find a duplicate.
  • I included enough detail to reproduce or investigate the problem.
Area

apps/mobile

Steps to reproduce
  1. Open Usage in the mobile app with at least one connected environment.
  2. Watch the filter icon in the header while "Scanning provider transcripts…" is showing.
  3. Separately, open Usage with two environments where one cannot report usage, so its query fails.
Expected behavior
  • Loading is shown with a spinner, as it is elsewhere in the mobile app.
  • When a selected environment fails to report usage, the filter icon is marked, so I know the totals are incomplete without opening the menu.
Actual behavior
  • While any selected environment is still loading, an amber dot appears on the filter icon. A dot on a filter icon reads as "a filter is applied", not as "loading". The meaning is only stated in the accessibility label.
  • When an environment fails, the dot disappears and the icon looks normal. The failure is only visible by opening the filter menu and reading "Usage unavailable" under that environment. The totals on screen silently exclude it.

The loading dot was observed in the app. The failure behavior comes from reading the code and has not been reproduced on a device.

Suggested fix
  • Show a spinner with the "Scanning provider transcripts…" text and drop the loading dot.
  • Show the dot on the filter icon only when a selected environment errored or reports a usage version mismatch, with an accessibility label saying so.

This matches web, which shows a dashed-circle icon while scanning and a warning icon labelled "Some environments could not report usage" on failure.

Supporting detail
  • The dot is drawn from hasLoadingEnvironments in apps/mobile/src/features/usage/UsageRouteScreen.tsx. isUsageLoading in the same file excludes environments that have an error, so a failure clears the dot.
  • Web's equivalent is the environment menu trigger in apps/web/src/components/usage/UsagePage.tsx, which uses pendingCount and hasIssue.
  • The mobile app uses ActivityIndicator for loading in 30 files. This dot is the only badge overlaid on an icon.
Impact

Minor bug or occasional failure

Version or commit

d60a71ef6e

Workaround

Open the filter menu and read each environment's status line.

Lingua principale
TypeScript
Stelle
24.8k
Fork
6.4k
Merge medio
7h 58m
PR unite (30g)
258

Preparare l'ambiente

Apri in Codespaces

Avvia il container di sviluppo del progetto nel browser, con il tuo account GitHub.

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 pingdotgg/t3code

Tutte le issue di pingdotgg/t3code

Issue simili

Altre issue su TypeScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.