FE: Messages: Implement messages export by alexanderlz · Pull Request #740 · kafbat/kafka-ui

alexanderlz · 2024-12-30T19:53:58Z

Breaking change? (if so, please describe the impact and migration path for existing application instances)

What changes did you make? (Give an overview)

Added an option to download all messages that are displayed on page(as csv or json)
as per #688

useDataSaver method is reused here.

Is there anything you'd like reviewers to focus on?

How Has This Been Tested? (put an "x" (case-sensitive!) next to an item)

Checklist (put an "x" (case-sensitive!) next to all the items, otherwise the build will fail)

I have performed a self-review of my own code
I have commented my code, particularly in hard-to-understand areas
I have made corresponding changes to the documentation (e.g. ENVIRONMENT VARIABLES)
My changes generate no new warnings (e.g. Sonar is happy)
I have added tests that prove my fix is effective or that my feature works
New and existing unit tests pass locally with my changes
Any dependent changes have been merged

Check out Contributing and Code of Conduct

A picture of a cute animal (not mandatory but encouraged)

sync with upstream

github-actions

Hi alexanderlz! 👋

Welcome, and thank you for opening your first PR in the repo!

Please wait for triaging by our maintainers.

Please take a look at our contributing guide.

Haarolean

Hi, thanks for the PR! Could you please take a look at the linter errors? And could we get some tests for the new functionality?

alexanderlz · 2025-01-01T13:22:36Z

definitely (both of your questions).

Happy New Year!

Haarolean · 2025-01-03T11:13:35Z

definitely (both of your questions).

Happy New Year!

likewise, happy new year 😊

frontend/src/components/Topics/Topic/Messages/MessagesTable.tsx

Haarolean

Can we use the export icon provided with the design reference?

alexanderlz · 2025-08-05T13:28:52Z

@Haarolean replaced.

yeikel

I liked the other icon more but it's a matter of opinions now. Let's get this merged! :)

Haarolean

The icon

Haarolean · 2025-08-05T22:08:55Z

frontend/src/components/Topics/Topic/Messages/Filters/Filters.tsx

+                viewBox="0 0 18 18"
+                fill="currentColor"
+              >
+                <path d="M4.24 5.8a.75.75 0 001.06-.04l1.95-2.1v6.59a.75.75 0 001.5 0V3.66l1.95 2.1a.75.75 0 101.1-1.02l-3.25-3.5a.75.75 0 00-1.101.001L4.2 4.74a.75.75 0 00.04 1.06z" />


Can we please extract this icon like others into a separate file/class in src/components/common/Icons?

Haarolean · 2025-08-05T22:11:04Z

frontend/src/components/Topics/Topic/Messages/Filters/Filters.tsx

+              }}
+            >
+              <svg
+                width="24"


The icon is 16x16 in figma

Could you adjust the size please?

@alexanderlz Any chance you can resume this work?

I am looking forward to using this feature

Thanks again! 🎖️

yes, will do it during one of the upcoming days

@yeikel done

Awesome, thank you for your hard work @alexanderlz

@Haarolean Any chance you can take a look again?

Thanks in advance 🫡

yeikel · 2025-11-16T17:59:41Z

Hi team

What is the latest status on this one? What's blocking merging it?

Thanks!

Mgrdich · 2025-11-21T09:30:35Z

frontend/src/components/Topics/Topic/Messages/Filters/Filters.tsx

+
+type DownloadFormat = 'json' | 'csv';
+
+function padCurrentDateTimeString(): string {


Suggested change

function padCurrentDateTimeString(): string {

function padCurrentDateTimeString() {

Typescript will infer the value correctly don't need return type

I am not a TS expert, but even if this is the case, isn't adding the type explicitly a good pattern for self-documentation?

ibalat · 2026-01-05T06:06:03Z

Any update for this pr? We are waiting excitedly this feature

alexanderlz and others added 2 commits December 29, 2024 17:58

Merge pull request #1 from kafbat/main

b008fa9

sync with upstream

add an option to save all messages as csv/json, Issue kafbat#688

c55f8c0

alexanderlz requested a review from a team as a code owner December 30, 2024 19:53

kapybro bot added status/triage Issues pending maintainers triage status/triage/manual Manual triage in progress status/triage/completed Automatic triage completed and removed status/triage Issues pending maintainers triage labels Dec 30, 2024

github-actions bot reviewed Dec 30, 2024

View reviewed changes

alexanderlz added 2 commits December 30, 2024 20:29

linter issues fix

252c8a9

lint fixes

1aab310

Haarolean requested changes Jan 1, 2025

View reviewed changes

Haarolean changed the title ~~Closes #688~~ FE: Messages: Implement messages export Jan 1, 2025

Haarolean added type/enhancement En enhancement/improvement to an already existing feature scope/frontend Related to frontend changes area/messages and removed status/triage/manual Manual triage in progress labels Jan 1, 2025

yeikel reviewed Jan 3, 2025

View reviewed changes

frontend/src/components/Topics/Topic/Messages/MessagesTable.tsx Outdated Show resolved Hide resolved

yeikel reviewed Jan 3, 2025

View reviewed changes

frontend/src/components/Topics/Topic/Messages/MessagesTable.tsx Outdated Show resolved Hide resolved

alexanderlz and others added 8 commits January 5, 2025 16:26

linter fixes + comments

9817ee5

forgot missing date-fns in package.json

628ecf1

forgot missing date-fns in pnpm

b393c2d

linter

d841a95

linter warnings fix

eef6107

linter warnings fix ->> single-quote

cc31f80

linter warnings fix (hopefully last)

578982d

Merge branch 'main' into issues/688

0615fc5

germanosin added the status/pending-design Pending UI design solution label Jan 6, 2025

alexanderlz requested a review from Haarolean January 7, 2025 11:41

alexanderlz force-pushed the issues/688 branch from ebb9188 to b168638 Compare August 2, 2025 15:18

yeikel approved these changes Aug 3, 2025

View reviewed changes

Haarolean requested changes Aug 3, 2025

View reviewed changes

github-project-automation bot moved this from In Development to Changes requested in Release 1.4 Aug 3, 2025

alexanderlz force-pushed the issues/688 branch 2 times, most recently from 88579f2 to 08f0967 Compare August 5, 2025 13:23

linter warning

72cc645

alexanderlz force-pushed the issues/688 branch from 08f0967 to 72cc645 Compare August 5, 2025 13:26

alexanderlz requested a review from Haarolean August 5, 2025 13:42

yeikel approved these changes Aug 5, 2025

View reviewed changes

Haarolean requested changes Aug 5, 2025

View reviewed changes

alexanderlz and others added 6 commits September 21, 2025 15:33

svg to separate file, size according to figma

9ccacb8

Update useMessagesFilters to be aligned with merge

e32d02e

linter

4c00bb7

linter

1346b6d

Fix spacing in ExportIcon component usage

14ff067

Merge branch 'main' into issues/688

8c13134

Haarolean added the hacktoberfest-accepted PRs accepted towards hacktoberfest goal and will be counted as approved label Oct 5, 2025

Merge branch 'main' into issues/688

7479f01

Haarolean modified the milestones: 1.4, 1.5 Nov 10, 2025

Haarolean removed this from Release 1.4 Nov 10, 2025

Haarolean self-requested a review November 10, 2025 11:24

Haarolean moved this to Todo in Release 1.5 Nov 10, 2025

Haarolean added this to Release 1.5 Nov 10, 2025

yeikel mentioned this pull request Nov 16, 2025

Export tables to CSV #1495

Merged

13 tasks

Mgrdich reviewed Nov 21, 2025

View reviewed changes


		type DownloadFormat = 'json' \| 'csv';

		function padCurrentDateTimeString(): string {

	function padCurrentDateTimeString(): string {
	function padCurrentDateTimeString() {

Uh oh!

Conversation

alexanderlz commented Dec 30, 2024

Uh oh!

github-actions bot left a comment

Choose a reason for hiding this comment

Uh oh!

Haarolean left a comment

Choose a reason for hiding this comment

Uh oh!

alexanderlz commented Jan 1, 2025

Uh oh!

Haarolean commented Jan 3, 2025

Uh oh!

Uh oh!

Uh oh!

Haarolean left a comment

Choose a reason for hiding this comment

Uh oh!

alexanderlz commented Aug 5, 2025

Uh oh!

yeikel left a comment

Choose a reason for hiding this comment

Uh oh!

Haarolean left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

yeikel commented Nov 16, 2025

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

ibalat commented Jan 5, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

7 participants