Hacktoberfest 2026: los issues que los mantenedores marcaron para octubre, abiertos y aptos para principiantes. Explorar issues de Hacktoberfest

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

Abierto
  • ¿Algo no está bien?
#629 0 comentarios 0 reacciones 0 asignados Ver en GitHub

Los mantenedores suelen responder en 1 día

Nadie ha tomado este issue todavía.

Evaluación

Dificultad
5/5
Tiempo estimado
Más de una semana
Aptitud para principiantes
25/100
Tipo de issue
Nueva funcionalidad
Claridad
Bien especificado
Estado de actividad
Activo
Stack tecnológico
next.js, nextjs, typescript
Área
frontend, internationalization, localization, testing

Línea de trabajo

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.

Escrito por el modelo de indexación a partir del texto del issue.

Descripción

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.

Lenguaje dominante
TypeScript
Estrellas
19
Forks
4
Merge medio
21 h 3 min
PR fusionados (30 d)
176

Preparar el entorno

Primeros pasos

  1. Lee el issue completo y luego la guía de contribución del proyecto.
  2. Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
  3. Haz un fork del repositorio y trabaja en una rama.
  4. Abre un pull request que haga referencia al número del issue.

Más de richshaw/OpenSignup

Todos los issues de richshaw/OpenSignup

Issues similares

Más issues de TypeScript

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.