Widget: a header menu with New conversation, Download transcript and a privacy link

Fermée
  • Quelque chose ne va pas ?
#496 4 commentaires 0 réactions 1 personne assignée Voir sur GitHub

Les mainteneurs répondent en général sous 1 jour

@anurag2787 y travaille déjà.

Depuis le 30/10/2026.

  • #505 par @anurag2787 — ouverte

Évaluation

Cette issue n'a pas encore été évaluée.

Description

hacktoberfest

F-05 task 19. The panel header has the name, the subtitle and a close button (packages/widget/src/dom/panel.ts:128-160). Visitors have no way to start over or keep a copy of the chat, though the widget can already do the first one: newConversation() exists (packages/widget/src/widget.ts:455), and so does its string, newConversation: 'New conversation' (packages/widget/src/i18n.ts:62), which nothing uses yet.

What to do

  • Add a "More options" button (a ⋯ icon in packages/widget/src/dom/icons.ts) before the close button. It opens a small menu with:
    • New conversation: calls newConversation().
    • Download transcript: saves the visible conversation as a .txt file (who said it and the text, one message after another) through a Blob and a temporary <a download>. No network request.
    • Privacy: a link that opens in a new tab. It's only shown when a new privacyUrl config option is set (only https: and http: URLs).
  • Use the menu button pattern: aria-haspopup="menu" and aria-expanded on the button, role="menu" and role="menuitem", arrow keys and Home/End to move, Enter/Space to pick, and Escape closes the menu only, putting focus back on the button. Escape now closes the popup, so the menu has to handle Escape first (the F-05 key table says Escape "closes that layer only").
  • New strings in WidgetLocaleStrings (English defaults; other languages fall back to them): the button label, "Download transcript" and "Privacy".
  • Use --cc-surface-raised for the menu background, with logical CSS so RTL works.

Size
The panel is at 17.15 of 18 kB. If the menu doesn't fit, it can load on first open the way the pre-chat form does (its own chunk, with a 2 kB budget). Talk to me before raising a budget.

Acceptance criteria

  • Unit tests: the menu opens and closes, keyboard navigation works, New conversation resets the log, the transcript file has the right text, and Privacy only shows with privacyUrl set (and never for a javascript: URL)
  • An e2e test for opening the menu with the keyboard and choosing New conversation, with the axe checks passing in light, dark and RTL
  • privacyUrl documented in website/src/content/docs/widget/configuration.mdx and the widget README (pnpm docs:check passes)
  • A minor changeset for @chatcops/widget; pnpm test:coverage, pnpm lint, pnpm api (commit the snapshot change) and pnpm size pass

Comment here to be assigned.

Langage dominant
TypeScript
Étoiles
13
Forks
7
Merge moyen
3 h 11 min
PR mergées (30 j)
330

Préparer son environnement

Par où commencer

  1. Lisez l'issue en entier, puis le guide de contribution du projet.
  2. Signalez en commentaire que vous la prenez — cela évite que deux personnes fassent le même travail.
  3. Forkez le dépôt et travaillez sur une branche.
  4. Ouvrez une pull request qui référence le numéro de l'issue.

Autres issues de codercops/chatcops

Toutes les issues de codercops/chatcops

Issues similaires

Plus d'issues TypeScript

Recevez les nouvelles issues par e-mail

Un résumé court des issues GitHub adaptées aux débutants.