diff --git a/apps/client/src/services/attributes.ts b/apps/client/src/services/attributes.ts index 8de409e9b..315dc2c15 100644 --- a/apps/client/src/services/attributes.ts +++ b/apps/client/src/services/attributes.ts @@ -11,7 +11,7 @@ async function addLabel(noteId: string, name: string, value: string = "") { }); } -async function setLabel(noteId: string, name: string, value: string = "") { +export async function setLabel(noteId: string, name: string, value: string = "") { await server.put(`notes/${noteId}/set-attribute`, { type: "label", name: name, diff --git a/apps/client/src/widgets/view_widgets/table_view/data.ts b/apps/client/src/widgets/view_widgets/table_view/data.ts index 046cef52b..1a7d6fd08 100644 --- a/apps/client/src/widgets/view_widgets/table_view/data.ts +++ b/apps/client/src/widgets/view_widgets/table_view/data.ts @@ -1,21 +1,17 @@ import { GridOptions } from "ag-grid-community"; -import FNote from "../../../entities/fnote"; +import FNote from "../../../entities/fnote.js"; import type { LabelType } from "../../../services/promoted_attribute_definition_parser.js"; +import { default as getPromotedAttributeInformation, type PromotedAttributeInformation } from "./parser.js"; -type Data = { +export type TableData = { + noteId: string; title: string; } & Record; -interface PromotedAttributeInformation { - name: string; - title?: string; - type?: LabelType; -} type GridLabelType = 'text' | 'number' | 'boolean' | 'date' | 'dateString' | 'object'; -export function buildData(parentNote: FNote, notes: FNote[]) { - const info = getPromotedAttributeInformation(parentNote); +export function buildData(info: PromotedAttributeInformation[], notes: FNote[]) { const columnDefs = buildColumnDefinitions(info); const rowData = buildRowDefinitions(notes, info); @@ -26,7 +22,10 @@ export function buildData(parentNote: FNote, notes: FNote[]) { } export function buildColumnDefinitions(info: PromotedAttributeInformation[]) { - const columnDefs: GridOptions["columnDefs"] = [ + const columnDefs: GridOptions["columnDefs"] = [ + { + field: "noteId" + }, { field: "title" } @@ -36,36 +35,14 @@ export function buildColumnDefinitions(info: PromotedAttributeInformation[]) { columnDefs.push({ field: name, headerName: title, - cellDataType: mapDataType(type) + cellDataType: mapDataType(type), + editable: true }); } return columnDefs; } -function getPromotedAttributeInformation(parentNote: FNote) { - const info: PromotedAttributeInformation[] = []; - for (const promotedAttribute of parentNote.getPromotedDefinitionAttributes()) { - if (promotedAttribute.type !== "label") { - console.warn("Relations are not supported for now"); - continue; - } - - const def = promotedAttribute.getDefinition(); - if (def.multiplicity !== "single") { - console.warn("Multiple values are not supported for now"); - continue; - } - - info.push({ - name: promotedAttribute.name.split(":", 2)[1], - title: def.promotedAlias, - type: def.labelType - }) - } - return info; -} - function mapDataType(labelType: LabelType | undefined): GridLabelType { if (!labelType) { return "text"; @@ -84,10 +61,11 @@ function mapDataType(labelType: LabelType | undefined): GridLabelType { } } -export function buildRowDefinitions(notes: FNote[], infos: PromotedAttributeInformation[]): GridOptions["rowData"] { - const definitions: GridOptions["rowData"] = []; +export function buildRowDefinitions(notes: FNote[], infos: PromotedAttributeInformation[]) { + const definitions: GridOptions["rowData"] = []; for (const note of notes) { const data = { + noteId: note.noteId, title: note.title }; diff --git a/apps/client/src/widgets/view_widgets/table_view/parser.ts b/apps/client/src/widgets/view_widgets/table_view/parser.ts new file mode 100644 index 000000000..7719948b6 --- /dev/null +++ b/apps/client/src/widgets/view_widgets/table_view/parser.ts @@ -0,0 +1,31 @@ +import FNote from "../../../entities/fnote"; +import { LabelType } from "../../../services/promoted_attribute_definition_parser"; + +export interface PromotedAttributeInformation { + name: string; + title?: string; + type?: LabelType; +} + +export default function getPromotedAttributeInformation(parentNote: FNote) { + const info: PromotedAttributeInformation[] = []; + for (const promotedAttribute of parentNote.getPromotedDefinitionAttributes()) { + if (promotedAttribute.type !== "label") { + console.warn("Relations are not supported for now"); + continue; + } + + const def = promotedAttribute.getDefinition(); + if (def.multiplicity !== "single") { + console.warn("Multiple values are not supported for now"); + continue; + } + + info.push({ + name: promotedAttribute.name.split(":", 2)[1], + title: def.promotedAlias, + type: def.labelType + }) + } + return info; +} diff --git a/apps/client/src/widgets/view_widgets/table_view/renderer.ts b/apps/client/src/widgets/view_widgets/table_view/renderer.ts index b8e9b92ca..8a9fc12cc 100644 --- a/apps/client/src/widgets/view_widgets/table_view/renderer.ts +++ b/apps/client/src/widgets/view_widgets/table_view/renderer.ts @@ -1,11 +1,35 @@ -import { createGrid, AllCommunityModule, ModuleRegistry } from "ag-grid-community"; -import { buildData } from "./data.js"; +import { createGrid, AllCommunityModule, ModuleRegistry, columnDropStyleBordered, GridOptions } from "ag-grid-community"; +import { buildData, type TableData } from "./data.js"; import FNote from "../../../entities/fnote.js"; +import getPromotedAttributeInformation, { PromotedAttributeInformation } from "./parser.js"; +import { setLabel } from "../../../services/attributes.js"; ModuleRegistry.registerModules([ AllCommunityModule ]); export default function renderTable(el: HTMLElement, parentNote: FNote, notes: FNote[]) { + const info = getPromotedAttributeInformation(parentNote); + createGrid(el, { - ...buildData(parentNote, notes) + ...buildData(info, notes), + ...setupEditing(info) }); } + +function setupEditing(info: PromotedAttributeInformation[]): GridOptions { + return { + onCellValueChanged(event) { + if (event.type !== "cellValueChanged") { + return; + } + + const noteId = event.data.noteId; + const name = event.colDef.field; + if (!name) { + return; + } + + const { newValue } = event; + setLabel(noteId, name, newValue); + } + } +}