Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

UI - Faster topic-data search & sorting #1209

Merged
merged 2 commits into from
Nov 6, 2022

Conversation

HailToDodongo
Copy link
Contributor

This PR fixes a few UI issues in the topic-data view:

  1. searching in large topics no longer freezes the entire tab
  2. sorting by "Newest" works again (removed in Search / Pagination in topic data #473)
  3. correctly updating the table-row react state

Using the search on topics with many rows (e.g. one of our topics has ~5M entries @ 7GB) completely freezes the UI.
The search itself it really fast, however the HTTP result streams "percent" values with the current progress, this happens around once per ms.
The UI then tries to update in real-time and freezes, ironically also rendering the "Stop" Button unusable.
With this PR it will only update in 0.5% increments.
While i didn't change the backend, it might be a good idea to check if it's possible to reduce the progress events to avoid unnecessary traffic.


Sorting by newest now works by assuming that sorting by oldest works, and inserting the data in the front instead.
The search itself will still scan the data from oldest to newest, but the data view will be sorted correctly.
To make this work, rows now have a custom ID instead of using the index.
This also fixes an unrelated issue where expanded messages will auto-expand messages with the same index when switching to the next page.


The last issue was a small fix in the model update, which modified the state directly, now it's creating copies to do proper state updates.

@tchiotludo
Copy link
Owner

Thanks a lot :)

12ushan added a commit to giffgaff/akhq that referenced this pull request Nov 22, 2022
* fix(topicdata): handle unsupported DescribeLogDirs  for MSK Serverless (tchiotludo#1113)

close tchiotludo#1112

* chore(deps): upgrade aws-msk-iam-auth to 1.1.4 to avoid vulnerability (tchiotludo#1114)

https://github.com/aws/aws-msk-iam-auth/releases/tag/v1.1.4 shows several fixes for CVEs

* chore(docs): add tui to usage list (tchiotludo#1118)

* chore(docs): update alt text for tui (tchiotludo#1119)

* chore(docs): add tui logo to public assets (tchiotludo#1120)

* feat(topicdata): adding serializer for protobuf schema registry (tchiotludo#1117)

* feat(topicdata): allow integer/long to be serialized as float/double when using AVRO schema. (tchiotludo#1123)

close tchiotludo#1122

* feat(ui): add pagination size of topic list (tchiotludo#1109)

relate tchiotludo#1051

* feat(acsl): add  Pattern Type to ACLs Panel Information (tchiotludo#1125)

close tchiotludo#1115

* fix(docker): run upgrade in order to reduce CVEs (tchiotludo#1134)

libssl1.1
dpkg
libldap-common

close tchiotludo#1132

* feat(docker): add healthcheck (tchiotludo#1136)


Co-authored-by: Ludovic DEHON <tchiot.ludo@gmail.com>

* fix(ui): handle consumer group with slash (tchiotludo#1143)

close tchiotludo#1101

* Revert "chore(readme): add redpanda sponsors"

This reverts commit ab9a444.

* fix(helm): adding namespace to kubectl port-forward Helm Chart NOTES (tchiotludo#1171)

Co-authored-by: rogerio <r.fonseca@serrala.com>

* fix(helm): correct port for port-forward is 8080 (tchiotludo#1178)

Fix port displayed at the end of the helm release.

It displays `{{ .Values.service.port }}` which is `80` per default, it should be `8080`.

* feat(docker): change upstream image from openjdk to eclipse-temurin (tchiotludo#1179)


Signed-off-by: Erik Godding Boye <egboye@gmail.com>

* fix(core): close consumer when returning null after calculating offset for newest sort (tchiotludo#1069)

fix a memory leak 

Co-authored-by: Neeraj.singh <email@test.com>

* fix(ui): load, display and store settings on settings screen if no settings have been stored yet (tchiotludo#1161)

Co-authored-by: David Müller <david.mueller@codecentric.de>

* feat(docs): update vuepress to last versions

* chore(docs): add Fresha to whos using (tchiotludo#1111)

* chore(version): update to 0.22.0

* fix(ui): showing protobuf schema in versions tab crash (tchiotludo#1189)

Fixes tchiotludo#1188

* feat(docs): helm example with basic auth and aws msk (tchiotludo#1192)


Co-authored-by: Ludovic DEHON <tchiot.ludo@gmail.com>

* feat(helm): add networkpolicy (tchiotludo#1193)

Signed-off-by: Quan TRAN <itscaro@users.noreply.github.com>

* feat(helm): add configuration for readiness & livenessProbe

* chore(deps) add missing scala dependent modules (tchiotludo#1223)

* feat(docs): add a Kestra banner

* fix(topicdata): protection against tombstone message and headers

close tchiotludo#1210

* feat(webserver): add custom headers configuration (tchiotludo#1235)


Co-authored-by: Ludovic DEHON <tchiot.ludo@gmail.com>

* chore(docs): fix typo (tchiotludo#1240)

* chore(cicd): update slack channel

* fix(ui): decimals are not parsed correctl (tchiotludo#1246)

replaced 'json-bigint' parser with 'lossless-json', this replacement allows for pretty-printing the json data, but still keeping the original values especially for floating numbers and bigints.

fix tchiotludo#1006

* core(deps): Updated micronaut to latest version (tchiotludo#1247)

and fixes to tests to have a successful build

close tchiotludo#1215

* fix(ui): Disabled edit access topic configs when role has reader mode (tchiotludo#1237)

close tchiotludo#1219

* fix(ui): encode groupId to allow '&' as part of the name of a consumer group (tchiotludo#1184)


relate to tchiotludo#1143

* feat(ui): faster topic-data search & sorting (tchiotludo#1209)


Co-authored-by: Max Bebök <beboek@etracker.com>

* feat(topicdata): added fix for incorrect datatype and missing fields in the json while producing to topic (tchiotludo#1233)

* feat(ui): Use `set INLINE_RUNTIME_CHUNK=false&& ` in react build. (tchiotludo#1238)

See also https://drag13.io/posts/react-inline-runtimer-chunk/index.html. This is to make _Content-Security-Policy_ work when `unsafe-inline` is not set.

Co-authored-by: Ludovic DEHON <tchiot.ludo@gmail.com>

* fix(node):  fix nullpointer when trying to view cluster information in MSK Serverless (tchiotludo#1227)

close tchiotludo#1226

Co-authored-by: Ludovic DEHON <tchiot.ludo@gmail.com>

* chore(deps): update all java deps

* feat(ui): optimze svgs with https://jakearchibald.github.io/svgomg/ (tchiotludo#1252)

In preparation for a React upgrade, see tchiotludo#1243

* feat(topicdata): support duplicate header keys (tchiotludo#1258)

close tchiotludo#1257 

Co-authored-by: rafanyan <raphael.afanyan@nexthink.com>

* chore(deps): update codeql actions to supported version (tchiotludo#1253)

See
https://github.blog/changelog/2022-04-27-code-scanning-deprecation-of-codeql-action-v1/
for context

* chore(version): update to 0.23.0

* feat(ui): update node to the latest lts version (tchiotludo#1251)

* Update node to the latest LTS version
* Replace node-sass with sass
* Also use the correct version of react-test-renderer.
* Update react scripts so we don't use insecure hashing functions
* Do not check eslint for production build

See tchiotludo#1243 for more information.

* fix(topicdata): fix null key and value (tchiotludo#1261)

Co-authored-by: alozano3 <alozano@caixabanktech.com>

* feat(ui): fix eslint warnings (tchiotludo#1254)


Co-authored-by: Ludovic DEHON <tchiot.ludo@gmail.com>

* fix(topci): create topics with configuration in one call (tchiotludo#1273)

close tchiotludo#1272

Signed-off-by: Erik Godding Boye <egboye@gmail.com>
Signed-off-by: Quan TRAN <itscaro@users.noreply.github.com>
Co-authored-by: Mitsuaki Ito <itoumagic@gmail.com>
Co-authored-by: tooptoop4 <33283496+tooptoop4@users.noreply.github.com>
Co-authored-by: Steven Masala <smasala@gmail.com>
Co-authored-by: Steven Masala <me@smasala.com>
Co-authored-by: Andrei Strelnikov <AlarArelon@gmail.com>
Co-authored-by: Marcello <marcellorego@gmail.com>
Co-authored-by: 10xtechie <102477169+10xtechie@users.noreply.github.com>
Co-authored-by: ThomasSanson <93382375+ThomasSanson@users.noreply.github.com>
Co-authored-by: Ludovic DEHON <tchiot.ludo@gmail.com>
Co-authored-by: Rodrigo Rodriguez Ramos <51171995+rdrck47@users.noreply.github.com>
Co-authored-by: Rogério Fonseca <rogerio@teccross.com.br>
Co-authored-by: rogerio <r.fonseca@serrala.com>
Co-authored-by: Thomas <12407096+thomas-chauvet@users.noreply.github.com>
Co-authored-by: Erik Godding Boye <egboye@gmail.com>
Co-authored-by: neeraj-singh47 <neeraj-singh47@users.noreply.github.com>
Co-authored-by: Neeraj.singh <email@test.com>
Co-authored-by: sam0r040 <93372330+sam0r040@users.noreply.github.com>
Co-authored-by: David Müller <david.mueller@codecentric.de>
Co-authored-by: Piotr Rybarczyk <argonuspiotr@gmail.com>
Co-authored-by: Ali Akhtari <ali_akhtari@live.com>
Co-authored-by: Alex Vaque <alex.vaque@gmx.com>
Co-authored-by: Quan TRAN <itscaro@users.noreply.github.com>
Co-authored-by: Adi Wehrli <adi@theadi.ch>
Co-authored-by: lucapette <ciao@lucapette.me>
Co-authored-by: tristanessquare <44587610+tristanessquare@users.noreply.github.com>
Co-authored-by: meeraj257 <nagaraj.vn@aexp.com>
Co-authored-by: Gnana_Jeyam <gnanajeyam95@gmail.com>
Co-authored-by: owidder <oliver.widder@gmail.com>
Co-authored-by: Stuff is on GitLab <beboek.max@gmail.com>
Co-authored-by: Max Bebök <beboek@etracker.com>
Co-authored-by: Raphael <raphyninho@hotmail.fr>
Co-authored-by: rafanyan <raphael.afanyan@nexthink.com>
Co-authored-by: Albert <31214345+alozano3@users.noreply.github.com>
Co-authored-by: alozano3 <alozano@caixabanktech.com>
Co-authored-by: Emmanuel <emmanuel.brard@getyourguide.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants