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

Add HTML / Markdown Table Exporter to CSV & TXT Viewer

Aperta
#93 0 commenti 0 reazioni 0 assegnatari Vedi su GitHub

Nessuno ha ancora preso questa issue.

Valutazione

Difficoltà
3/5
Tempo stimato
1-2 giorni
Idoneità per principianti
74/100
Tipo di issue
Funzionalità
Chiarezza
Specificata chiaramente
Stato di attività
Attiva
Stack tecnologico
html, markdown, typescript
Ambito
frontend, tooling

Direzione di ricerca

Start with src/components/tools/data-tools/CsvTxtViewer.tsx to see how the current filtered or active table state is represented, then read src/utils/tableExport.ts and src/__tests__/tableExport.test.ts. Implement and test both export utilities, including empty states and escaping, then connect Markdown and HTML copy and download flows in the viewer. Done means exports preserve the visible table's headers and row order and the tests validate the generated formats.

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

Descrizione

data-tools enhancement good first issue

Summary

Add an export option for the CSV/TXT viewer so users can convert the currently filtered or active table view into GitHub-flavored Markdown or a clean HTML table.

Problem

The CsvTxtViewer tool parses large CSV and delimited text files into a paginated grid. Users can review and filter the data, but there is currently no way to export the visible table in a reusable format for docs, tickets, or quick sharing.

Scope

  • Add an "Export As" dropdown or toggle with options:
    • Markdown Table
    • HTML Table
  • Support copying to clipboard and downloading the exported output.
  • Implement shared utility functions:
    • tableToMarkdown(headers, rows)
    • tableToHtml(headers, rows)
  • Add test coverage for export utilities.

Requirements

  • Export the filtered/active table state, not just the raw CSV data.
  • Preserve header and row ordering from the current table view.
  • Output should be clean, valid GitHub-flavored Markdown table syntax.
  • Output should be clean, valid HTML <table> markup.
  • Provide a copy-to-clipboard flow and a download flow for the generated output.
  • Include handling for empty states and safely escaped content.

Key Files

  • Tool component: src/components/tools/data-tools/CsvTxtViewer.tsx
  • Utility: src/utils/tableExport.ts
  • Unit test: src/__tests__/tableExport.test.ts

Acceptance Criteria

  • Users can choose Markdown or HTML export from the CSV/TXT viewer UI.
  • The exported format reflects the current table content.
  • Users can either copy the result to the clipboard or download it as a file.
  • Utility functions are implemented and validated by unit tests.

Labels

  • good first issue
  • enhancement
  • data-tools

Difficulty

Easy

Lingua principale
TypeScript
Stelle
1
Fork
3
Merge medio
2h 50m
PR unite (30g)
3

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 goldi0002/devtoolbox

Tutte le issue di goldi0002/devtoolbox

Issue simili

Altre issue su TypeScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.