Redesign kubedb-ui-presets options with a sidebar layout - #1126
Draft
Sourav-Kumar-19 wants to merge 5 commits into
Draft
Redesign kubedb-ui-presets options with a sidebar layout#1126Sourav-Kumar-19 wants to merge 5 commits into
Sourav-Kumar-19 wants to merge 5 commits into
Conversation
The preset editor was one long page of nested accordions, so reaching a single setting meant scrolling past every other group. Move the four option groups into the sidebar-layout the TelemetryStack editor already uses: the group headings become sidebar sections, each block becomes its own page, and the databases sit nested under "Configure Databases". Every form, field, schema path and function is carried over untouched. The only per-block change is dropping hideBlock, which used to collapse the accordion by default and makes no sense now that a block owns the whole page. The catalog loader stays on a wrapper around the database pages so FetchAllDbVersions still runs once. isActivePage() reads the page the sidebar wrote to the discriminator, same as the TelemetryStack wizard. Signed-off-by: Sourav Roy <souravroy@appscode.com>
Every page holds one card whose header just repeats the row you clicked, and it was collapsible, so a single click emptied the page. fixedBlock keeps the card as the page heading and drops the toggle. Dropped the rail's own "KubeDB Presets / Configuration" title. The breadcrumb and the H1 above it already say that, and the ~56px it took pushed the first nav row well below the first card. Icons on all 51 rows, keyed by hugeicons name. The databases are grouped by what the engine actually is - analytics, search, cache, broker, vector, proxy - rather than 30 copies of one glyph, so the list stays scannable when it is expanded. Section headings get none on purpose: an icon there shifts the heading text 22px right and eats the indent that separates it from its own rows, which is why TelemetryStack has none either. No schema paths, fields, loaders, watchers or functions were touched. Signed-off-by: Sourav Roy <souravroy@appscode.com>
Both of these ran past the rail and wrapped. "specifics" reads as filler on a section header that already sits under a Monitoring & Backups group, and MachineProfiles is the part of the row that matters. Signed-off-by: Sourav Roy <souravroy@appscode.com>
Signed-off-by: Sourav Roy <souravroy@appscode.com>
Sourav-Kumar-19
force-pushed
the
sourav-preset-sidebar
branch
from
August 7, 2026 12:16
84931fb to
fff4545
Compare
Sourav-Kumar-19
changed the title
Sourav-Kumar-19
marked this pull request as draft
August 10, 2026 08:21
This branch was cut before the TelemetryStack sidebar was reworked, so it still carries the first version of that wizard. Both branches land on master, and the preset sidebar has nothing to do with the telemetry one, so carry the newer files over verbatim to keep the second merge clean. Taken as-is from sourav-telemetry-sidebar: Metrics moves ahead of Logs and Traces is dropped, Thanos gets its own Additional Config page, S3 becomes one page shared by both pillars with the metrics copy kept in sync, and volume mounts are derived from the volume at the same index. Nothing outside charts/monitoringk8sappscodecom-telemetrystack-editor-options/ui is touched. Signed-off-by: Sourav Roy <souravroy@appscode.com>
SamiulSourav
approved these changes
Aug 12, 2026
SamiulSourav
marked this pull request as ready for review
August 12, 2026 07:53
SamiulSourav
changed the title
SamiulSourav
marked this pull request as draft
August 12, 2026 09:50
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Follow-up to #1107. Same sidebar treatment, this time for the
kubedb-ui-presetsside ofchartsxhelmdev-clusterchartpreset-editor-options.Why
The preset editor renders every option group on one page as nested accordions. With 30 databases under Configure Databases, getting to something like Alert or GitOps means scrolling past the whole catalog. The sidebar turns the groups into navigation instead.
What changed
ui/create-ui.yaml— the four group blocks (Machine specifics, Database specifics, Monitoring & Backups specifics, Extras) are replaced by a singlesidebar-layout:if: isActivePage|<page>hideOptions: true)FetchAllDbVersionsmoves onto a plain wrapper around the database pages, so it still runs exactly onceui/functions.js— addsisActivePage()and seeds/presetPagewith the first page, mirroring the TelemetryStack wizard.What did not change
No schema paths, field definitions, loaders, watchers or existing functions were touched. Diffing the leaf elements before and after gives an identical set (256 elements). The only per-block edit is dropping
hideBlock, which collapsed the accordion by default — pointless now that each block owns its page.Also corrected the Database sepcifics → Database specifics typo while it was becoming a section heading.
Notes
Needs appscode-cloud/form-builder#341 (
sidebar-layout), same dependency as #1107../bin/uibuilder-tools check --wizard-dir=./charts/chartsxhelmdev-clusterchartpreset-editor-optionspasses, including schema-ref validation.