Skip to content

Visualization release 1.143.0

Latest

Choose a tag to compare

@github-actions github-actions released this 23 Jun 18:15
· 2 commits to main since this release
af03fd0

Added 🚀

  • Per-map top labels: When more than one map is selected, the Label Settings panel offers a new All maps | Per map toggle below the Top Labels slider. In Per map mode the top-N labels are picked separately for each map (Height and Color label mode alike), and overlapping labels are only grouped within the same map. The toggle is hidden for a single map and in delta mode.
  • Label Size slider: New slider in the Label Settings panel scales floating label text (name, metric value, and "+N more" badge) between 0.75× and 2.5×. The setting is preserved in scenarios.
  • File Explorer sidebar: The file tree was redesigned as a dedicated left-side sidebar drawer that overlays the codemap. The drawer adds a Shown/Flattened/Hidden chip row at the top, a sort control, and click-to-edit popovers for the active flatten and exclude rules.
  • Collapsible File Explorer: The sidebar can now be collapsed via the « button in the header. Collapsed mode shows a small floating search box (with the kebab Flatten/Exclude menu) pinned at the top-left, freeing the full viewport for the codemap. Re-expand with the folder-tree button.
  • Folder overrides in the Color settings popover: Marked packages can now be managed directly from the Color popover. A new "Folder Overrides" section lists each pinned folder with its file count, lets you recolor it via a swatch click (any color, no longer limited to the five marking colors), unpin it, and pin new folders through an inline folder search.
  • Explorer hover tooltip: Hovering a file or folder in the File Explorer shows the same tooltip as hovering a building on the map — the node name plus its current area, height, and color metric values (folders show aggregated values) — anchored to the right of the hovered row. The native browser tooltip on row names was removed as redundant.

Changed

  • Node context menu: Right-clicking a building or a File Explorer row opens a redesigned context menu (features/nodeContextMenu/, DaisyUI, free of @angular/material). The header row shows the node name and copies its path — without the leading root/map segment — on click. A new "Show in Explorer" action (offered for map right-clicks only) expands the File Explorer, scrolls to the node, and briefly highlights it. The folder color row keeps the five known marking colors and the custom color picker, and now shows a clear (×) button when the folder is marked with a custom color. The unflatten entry ("Show") displays the flatten icon rotated 180°.
  • File extension bar: The metric distribution strip moved from below the toolbar to the bottom of the screen, sitting directly above the bottom bar. The floating metrics bar, the legend, and both sidebars account for its height, and map screenshots exclude it at its new position.
  • Toolbar: Small vertical dividers now separate the Compare, 3D Print, and Settings controls on the right side, and the CodeCharta logo links to codecharta.com instead of the GitHub repository.
  • Inspector sidebar: The attribute sidebar was redesigned as the "Inspector" — a right-side drawer (features/sidebarInspector/) that slides in when a building is selected and closes via ✕ (which also deselects the building) or by deselecting. It shows the selected node's path with a copy-to-clipboard button and badges for the node type (file/folder) and a folder's file count, the current Area/Height/Color/Edge metric mapping with the selected node's value per mapped metric (buildings show their own values, folders the aggregate of the contained files; the color block carries an inverted marker), and all node metrics with severity-colored bars sized by the value's share of the whole map — a building with 100 rloc in a 1,000-rloc map fills 10% (severity respects higher-is-better metric directions). A map | range toggle in the METRICS header switches the bars between comparing against the whole map and comparing against the min/max range of all files. The header and metric mapping stay pinned at the top; only the metrics list scrolls. Metrics with empty (zero) values and no delta are greyed out and grouped in a collapsible "Empty metrics" section below the valued metrics; in comparison mode a metric that dropped to zero stays in the main list so its delta remains visible. Delta values and delta file counts are still shown in comparison mode. The Σ/median attribute-type toggle was removed.
  • Floating metrics bar: Replaced the top-of-page ribbon with a single rounded card that floats just above the bottom bar (features/metricsBar/). Each metric segment (Scenario, Area, Height, Color, Edges, Labels) opens a native popover for search and settings; the bar uses DaisyUI primitives and is free of @angular/material.
  • Metric settings popovers: Restyled the Area, Height, Color, and Edge settings popovers to match the Label settings panel — same DaisyUI spacing (gap-2.5 py-2 px-5) and a full btn btn-outline btn-error reset button that stretches to the popover width.
  • Color settings popover layout: Redesigned the Color settings popover as a single narrow column: a header with the metric name and a reset-thresholds icon, the threshold slider, a compact "Distribution" quantile chart, the gradient mode as a segmented control (Absolute / Focused / Weighted / Relative), a "Bands" list showing each color band with its building count and a click-to-recolor swatch, followed by an Invert colors toggle and the Reset colors button (which now also resets the gradient mode) above the folder overrides. The popover narrows further in delta or unary-metric mode.
  • Legend panel: Migrated to the new feature architecture (features/legend/) and restyled with DaisyUI to match the metric settings popovers. The legend is now purely informational: it shows the current Area/Height/Color (and Edge) metric mapping plus the color-scale, selected, and edge colors as read-only swatches with their value ranges, and it renders above the floating metrics bar. Map colors are no longer editable from the legend (recolor them via the Color settings popover) and marked folders are no longer listed there (managed as Folder Overrides in the Color popover); metric titles no longer link to external documentation.
  • Faster blacklist operations: Adding or removing flatten and exclude patterns is significantly faster on large codebases — the matching engines are now cached and only rebuilt when the blacklist itself changes.

Removed

  • Angular Material fully removed: the last @angular/material usages are gone. The edge and logo colour pickers now reuse the existing DaisyUI inline color picker (the old colorPicker/labelledColorPicker/colorPickerForMapColor family was deleted), and the loading spinner is a DaisyUI/Tailwind spinner whose rotation is GPU-composited so it no longer stutters while the codemap re-renders. The app/material/ theme layer, the Material build wiring, and the @angular/material + @angular/cdk dependencies were dropped.

Fixed 🐞

  • Label connector line on hover: Hovering a building now hides the connector line between the building and its label together with the label. The label hides via CSS, but the connector is WebGL geometry whose update was computed after the frame had already rendered and never triggered a follow-up render, so the line lingered. The connector layout now requests a render when the set of drawn connectors changes.
  • Edges vanishing while navigating: Moving or scrolling the map no longer makes all edge arrows disappear until the cursor leaves the canvas. The edge service kept the store's hovered building after the highlight had been cleared out-of-band (so passing over empty map area never restored the preview), and a queued hover recalculation could blank the preview right after it was restored. Hovering over empty area now restores the preview, and the pending recalculation is cancelled on unhover/deselect.
  • Edges hidden by the height metric: Hovering or selecting a building now always shows its edges. The arrow-drawing only drew an edge when both endpoints had a (truthy) height-metric value, so flat buildings — and any whose endpoints lacked the metric — showed no edges. An edge is a file relationship drawn from layout geometry and is independent of the height metric, so the guard was removed (matching the always-on edge preview, which never had it).
  • Folder color pinning crash: Pinning a folder in the Color settings popover no longer throws markingColors.filter is not a function. Applying a scenario or resetting settings deep-merged the markingColors array through SET_STATE and turned it into an object with numeric keys, which then persisted to IndexedDB and survived reloads. The array is now preserved at the SET_STATE boundary and normalized when read from the store, healing already-corrupted persisted state.
  • The threshold slider in the Color settings popover no longer grows endlessly to the right when one thumb is dragged against the other. Subpixel differences between rendered thumb rects and the stored slider positions could let the thumbs cross, producing a negative segment width that the browser dropped — the overflowing segments widened the track, and the slider's resize observer fed the bigger width back into the segments in an unbounded loop. Thumb clamping now happens in logical track pixels and segment widths are clamped to always sum to the measured track width.
  • Folder (floor) labels stay sharp when the camera moves away: their texture now uses anisotropic filtering (the flat viewing angle previously over-blurred the text) and the white glyphs get a subtle dark outline so they no longer fade into the floor when minified.
  • Treemap maps are packed substantially denser: margins and floor-label strips now scale with the folder they belong to instead of being fixed pixel amounts (or sized from the whole map). Small files in crowded folders are no longer squeezed invisible, and files with the same metric value are drawn at comparable sizes across different folders.
  • Fix amountOfEdgePreviews being silently overwritten when restoring saved state — it incorrectly dispatched the top-labels action instead.
  • Loading spinner now stays visible until the codemap's full initial render completes; previously it disappeared too early.
  • Top metric labels follow the rendered building height again, so the labels always attach to the visually tallest buildings — including with "invert height" or inverted attribute directions.
  • Typing into the settings number inputs no longer destroys intermediate values: entering "45" into a field with a minimum of 30 works again (the field is normalized when leaving it), and retyping the current value no longer commits a stale intermediate digit.
  • Fractional values restored from a shared URL can no longer crash top-label rendering or disable the edge-preview cutoff.
  • Blacklist matching is unified behind one shared matcher: selection cleanup, the street layout, metric calculations and the file-explorer counts now always agree with what flatten/exclude rules actually remove, including negated !-rules (which apply to files only).
  • The selected building no longer survives a map rebuild as a stale reference: it is remapped onto the new mesh (or deselected when it disappears), preventing wrong recoloring after changing a metric and clicking another building.

Removed

  • Display Quality setting: The Low/Medium/High/Best selection in the Global Configuration dialog was removed. The map is now always rendered at the former "Best" quality (antialiasing plus native device pixel ratio); the FXAA post-processing pipeline that only served the Medium mode was removed along with it.

Chore 👨‍💻 👩‍💻

  • npm no longer executes dependency install scripts (ignore-scripts=true in .npmrc) — the main npm supply-chain attack vector. All native dependencies ship prebuilt platform packages; electron's binary download now happens on demand via script/ensureElectron.js when running npm run start/npm run package, and git hooks are set up via npm run prepare (done automatically by mise run install).
  • Upgrade FontAwesome from 4.7 to 7 (@fortawesome/fontawesome-free); existing icon usages keep working via the v4 compatibility shim.
  • Backfilled unit specs across the new metrics bar components (segments, settings popovers, color range slider/diagram, metric select).
  • Deduplicated the metrics bar: shared MetricSegmentBase for the area/height segments and a shared cc-settings-popover-shell container for the four settings popovers. Added Playwright e2e coverage for the metric-select flow.
  • Reworked the metrics bar onto the feature stores/services/selectors architecture (matching labelSettings) so it passes the dependency-cruiser architecture lint: components no longer inject the ngrx Store directly, and the scenarios feature is accessed through its facade.
  • Top metric label selection now uses a single-pass top-N selection instead of sorting every building, reducing work when rendering labels on large maps.
  • Performance: the layout is no longer re-run on every search keystroke or margin drag for a fallback display value; metric option lists render lazily on popover open; selection clicks update the highlight colors incrementally instead of re-uploading the full color buffer; the color-range diagram computes percentiles with a single sort and pauses entirely while its popover is closed.
  • Removed dead metrics-bar store/service mirror pairs and never-called setters; renamed the duplicate AreaMetricStore/ColorModeStore singletons to feature-scoped names so auto-imports cannot mix them up; the metric select popover and labels/scenarios segment reuse the shared popover shell.