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

The public signup page and the sign-up dialog are English-only

Aperta
  • Qualcosa non va?
#629 0 commenti 0 reazioni 0 assegnatari Vedi su GitHub

I maintainer di solito rispondono entro 1 giorno

Nessuno ha ancora preso questa issue.

Valutazione

Difficoltà
5/5
Tempo stimato
Più di una settimana
Idoneità per principianti
25/100
Tipo di issue
Funzionalità
Chiarezza
Specificata chiaramente
Stato di attività
Attiva
Stack tecnologico
next.js, nextjs, typescript
Ambito
frontend, internationalization, localization, testing

Direzione di ricerca

Start with the listed signup page, dialog, message helper and shared component files, then read the prerequisite work in issues #622, #623, #624 and #628. Run the existing signup tests and inspect the JavaScript budgets and slot row layout test. Done means Swedish strings render for the Swedish test signup, English remains unchanged, the production build end-to-end check passes in both languages, and all listed budgets and checks meet the stated limits.

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

Descrizione

enhancement pipeline:proposed pipeline:ux

Needs your OK: this moves the public signup page's and the sign-up dialog's text into the catalog, and raises four JavaScript budgets by about 3.5 KB. English stays word for word the same. Swap pipeline:proposed for pipeline:ready to have it built.

What happens

These files hold about 120 English strings:

  • the public page: src/app/s/[slug]/page.tsx and signup-view.tsx;
  • the sign-up dialog: commit-dialog.tsx and participant-fields.tsx;
  • the message helpers: capacity-message.ts, closed-message.ts, conflict-message.ts, gone-message.ts, name-message.ts, rate-limit-message.ts and participant-error.ts.

Many of the strings are glued from pieces:

  • 'spot is' / 'spots are';
  • `${ownCount} slots`;
  • "You're signed up for {x}." split across elements;
  • a reminder clause spliced into the middle of a sentence;
  • `(no ${field.label.toLowerCase()})`.

Swedish word order and plurals need whole messages.

Fix, in outline

  • Server components take a translator from getTranslator(locale, 'participant') (#620) and stay synchronous.
  • The message helpers take a translator argument instead of returning English, so the same code runs on the server and in the dialog.
  • The dialog gets its messages from ClientMessages:
    • a 'use client' component that imports NextIntlClientProvider from next-intl and takes locale, messages and timeZone="UTC" as props;
    • a server-only messagesFor(locale, namespace), with English merged under, picks the participant messages;
    • only ClientMessages.tsx may import the provider, enforced by a lint rule. next-intl's server provider fills any missing prop from the request config, which reads headers and would make static pages dynamic;
    • where the dialog needs only a few fixed strings, pass them as props instead.
  • SignupViewBody takes its language from its caller: the signup's on /s/[slug] and in Preview, and 'en' for the landing page's example card, whose content is English.
  • Whole messages with ICU plural and select for every glued sentence. Rephrase "(no {label})" so it works for any noun's gender.
  • Draft and archived signups show their state messages in the signup's language, which the loader from #628 gives.
  • The shared bits. site-footer.tsx, banner.tsx and ui/BottomSheet.tsx move into common. SiteFooter takes locale as a prop (help and legal pass 'en'), because static pages must not call getEnv().
  • A partial src/messages/sv.json is committed from here on.
  • A Swedish test signup. Add one to tests/e2e/global-setup.ts: create it through createSignup, then set settings.locale with db.update, since Swedish can't be chosen until the launch step.
  • A production-build e2e renders a participant message with arguments, in English and Swedish. It's the end-to-end guard for precompiling (#624).
  • Turn on the lint rules from #623 for src/app/s/[slug] (not c/ or unsubscribe/ yet) and these components.

Watch for

  • English must not change by a character. The existing unit and e2e tests assert it. The e2e specs that import GONE_PAGE (signup-not-found.spec.ts, edit-token.spec.ts) build an English translator.
  • Budgets.
    • The dialog's chunk counts on every route whose module graph includes it: /s/[slug], /s/[slug]/c/[id], / and /app/signups/[id]/preview.
    • Raise each by the measured amount, about 3.5 KB, with that reason. Raising a budget goes to the owner.
    • pnpm budgets counts JS chunks only, so note the messages' size in the HTML and RSC payload in the PR.
  • Layout widths. ACTION_SIZING in slot-format.ts was sized for "Sign up"; run tests/e2e/slot-row-layout.spec.ts against the Swedish signup too.
  • Help walkthroughs find some of these strings through .ui.ts lists ('Sign up', 'Untitled slot', 'Email (optional)'). Unchanged English keeps them green.

Order

After #622, #623, #624 and #628. This needs the formatting with a language from #622, the checks and lint rules from #623, precompiling from #624 (so the dialog never ships the full runtime), and the page's language from #628.

Done when

  • The Swedish test signup renders every string sv.json has in Swedish, and English elsewhere. English pages are unchanged.
  • The production-build e2e with arguments passes in both languages.
  • The four budgets are raised by the measured amount, no more.
  • pnpm lint && pnpm typecheck && pnpm knip && pnpm test, pnpm test:db and pnpm test:e2e pass.

Planned with the owner in https://claude.ai/code/session_01EFKmj716ZY3b3SwR8TV8Y2 and checked against the code on main at 35288fa. The full plan is private to the owner's account: https://claude.ai/artifact/VgQH6U2s2EVx3LX991fJi8 (a Claude session on that account can open it with the Artifact tool's read action). This is part of step 1.2 there.

Lingua principale
TypeScript
Stelle
19
Fork
4
Merge medio
21h 3m
PR unite (30g)
176

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 richshaw/OpenSignup

Tutte le issue di richshaw/OpenSignup

Issue simili

Altre issue su TypeScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.