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

The WhatsApp screen on a phone asks you to pick from a list it does not show

Abierto
#261 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
3/5
Tiempo estimado
1-2 días
Aptitud para principiantes
78/100
Tipo de issue
Nueva funcionalidad
Claridad
Bien especificado
Estado de actividad
Activo
Stack tecnológico
go, react, typescript
Área
frontend, mobile

Línea de trabajo

Start with plugins/whatsapp/frontend/Empty.tsx and the mobileSidebar and mobileContent areas under packages/edit-site/src/components/site-editor-routes/ to understand the small-screen pattern. Check how sdk/frontend/index.ts exposes useMediaQuery and SMALL_VIEWPORT, then run the new frontend/src/test/small-shell.test.tsx and the thread test in test/e2e/tests/responsive.spec.ts. Done means the list appears on the /whatsapp page on small screens, while wide screens retain the empty state.

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

Descripción

bug help wanted

What happens

On a phone, and on any screen under 1024 pixels wide, the admin folds its sidebar into a drawer behind the menu button. At /whatsapp the conversation list is the section's sidebar, so it goes into the drawer too. The page itself shows only the empty state "No conversation selected. Pick one from the list to read its messages." No list appears on the page. A new user has to guess that the menu button holds it.

What should happen

Under 1024 pixels, /whatsapp shows the conversation list on the page, under the Conversations title, instead of the empty state. Tapping a conversation opens its thread, as it does today. On a wide screen nothing changes. The list stays in the sidebar and the page keeps the empty state. The drawer keeps the WhatsApp screen and its back link to the main menu.

WordPress does the same in the Site Editor. Below its medium breakpoint, the Navigation screen drops the preview and fills the screen with the list of menus. The Patterns screen shows the list of categories first, and shows the patterns only after you pick one. See the mobileSidebar and mobileContent areas in packages/edit-site/src/components/site-editor-routes/.

Where

  • plugins/whatsapp/frontend/Empty.tsx, render ConversationList when the viewport is small
  • sdk/frontend/index.ts, export useMediaQuery and SMALL_VIEWPORT from @gopherium/godmin. That is the query the frame folds its rail at.
  • frontend/src/index.css, the .alphone-conversation rows, so they read well on the light page
  • frontend/src/test/small-shell.test.tsx, a new test. With a small viewport, /whatsapp shows a conversation link on the page without opening the drawer. With a wide viewport, the empty state stays.
  • test/e2e/tests/responsive.spec.ts, the thread test taps the conversation on the page instead of opening the drawer
Lenguaje dominante
Go
Estrellas
287
Forks
64
Merge medio
13 h 24 min
PR fusionados (30 d)
60

Preparar el entorno

  • Incluye un Dockerfile o un archivo de Docker Compose
  • Sin plantilla de pull request
  • Sin guía de contribución

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 gopherium/AlphOne

Todos los issues de gopherium/AlphOne

Issues similares

Más issues de Go

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.