feat(views/table): basic dark mode support

This commit is contained in:
Elian Doran 2025-06-27 23:40:00 +03:00
parent c058673e33
commit d31ba39a91
No known key found for this signature in database

View File

@ -1,11 +1,11 @@
import froca from "../../../services/froca.js"; import froca from "../../../services/froca.js";
import ViewMode, { type ViewModeArgs } from "../view_mode.js"; import ViewMode, { type ViewModeArgs } from "../view_mode.js";
import { createGrid, AllCommunityModule, ModuleRegistry, GridOptions } from "ag-grid-community"; import { createGrid, AllCommunityModule, ModuleRegistry, GridOptions, themeQuartz, colorSchemeDark } from "ag-grid-community";
import attributes, { setLabel } from "../../../services/attributes.js"; import attributes, { setLabel } from "../../../services/attributes.js";
import getPromotedAttributeInformation, { buildColumnDefinitions, buildData, TableData } from "./data.js"; import getPromotedAttributeInformation, { buildColumnDefinitions, buildData, TableData } from "./data.js";
import applyHeaderCustomization from "./header-customization.js"; import applyHeaderCustomization from "./header-customization.js";
import server from "../../../services/server.js"; import server from "../../../services/server.js";
import type { GridApi, GridState } from "ag-grid-community"; import type { GridApi, GridState, Theme } from "ag-grid-community";
import SpacedUpdate from "../../../services/spaced_update.js"; import SpacedUpdate from "../../../services/spaced_update.js";
import branches from "../../../services/branches.js"; import branches from "../../../services/branches.js";
import type { CommandListenerData, EventData } from "../../../components/app_context.js"; import type { CommandListenerData, EventData } from "../../../components/app_context.js";
@ -86,6 +86,7 @@ export default class TableView extends ViewMode<StateInfo> {
...this.setupEditing(), ...this.setupEditing(),
...this.setupDragging(), ...this.setupDragging(),
initialState, initialState,
theme: this.getTheme(),
async onGridReady(event) { async onGridReady(event) {
applyHeaderCustomization(el, event.api); applyHeaderCustomization(el, event.api);
}, },
@ -191,6 +192,14 @@ export default class TableView extends ViewMode<StateInfo> {
console.log("Save attributes", this.newAttribute); console.log("Save attributes", this.newAttribute);
} }
private getTheme(): Theme {
if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
return themeQuartz.withPart(colorSchemeDark)
} else {
return themeQuartz;
}
}
onEntitiesReloaded({ loadResults }: EventData<"entitiesReloaded">): boolean | void { onEntitiesReloaded({ loadResults }: EventData<"entitiesReloaded">): boolean | void {
// Refresh if promoted attributes get changed. // Refresh if promoted attributes get changed.
if (loadResults.getAttributeRows().find(attr => if (loadResults.getAttributeRows().find(attr =>