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

[Accessibility & Polish] Cancelled section badge

Aperta Adatta ai principianti
  • Qualcosa non va?
#775 0 commenti 0 reazioni 0 assegnatari Vedi su GitHub

Nessuno ha ancora preso questa issue.

Valutazione

Difficoltà
2/5
Tempo stimato
1-3 ore
Idoneità per principianti
88/100
Tipo di issue
Funzionalità
Chiarezza
Specificata chiaramente
Stato di attività
Attiva
Stack tecnologico
react, typescript
Ambito
frontend, testing

Direzione di ricerca

Inizia da src/components/courses/SectionExclusionList.tsx e controlla come le righe delle sezioni mostrano il CRN e la casella di controllo; cancelled è già disponibile in SectionRow, in src/types/course.ts. Aggiungi il badge solo quando cancelled è true, mantenendo intatto il comportamento della casella di controllo. Crea SectionExclusionList.test.tsx accanto al componente, seguendo src/components/Footer.test.tsx, e verifica entrambi i valori di cancelled; il lavoro è completato quando i test, pnpm lint e pnpm typecheck passano.

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

Descrizione

good first issue polish

What to build

A cancelled class still appears in the list of available sections. Add a visible “Cancelled” label beside its registration number so students can spot it before choosing classes.

Files

Steps

  1. Find the span displaying CRN {o.crn}. After it, render a small text badge only when o.cancelled is true.
  2. Reuse the row font/color utilities; leave checked, onChange and onToggle unchanged.
  3. Render one active and one cancelled row and assert only the latter has the badge.

Example

{crn:12345, professor:null, seatsAvailable:3, cancelled:true} → visible Cancelled badge; false → no badge.

Use two Section values: one with cancelled: false, and one with cancelled: true. Follow the complete sample factory in src/lib/domain/catalogSections.test.ts. Pass both as offerings, an empty excludedCrns set, and a test function for onToggle.

Check it works

In src/components/courses/SectionExclusionList.test.tsx, check the example above and the failure or limit described in the steps. Run pnpm test -- src/components/courses/SectionExclusionList.test.tsx, pnpm lint and pnpm typecheck.

References

Assign yourself before starting, or comment to claim the issue. Project setup.

Lingua principale
TypeScript
Stelle
19
Fork
94
Nessuna PR unita negli ultimi 30g

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 DevDogsUGA/DogDays

Tutte le issue di DevDogsUGA/DogDays

Issue simili

Altre issue su TypeScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.