Dockery/Trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-12-21 07:39:55 +01:00
Code Issues Packages Projects Releases Activity

chore(react/promoted_attributes): port multiplicity buttons (without implementation)

Browse Source
This commit is contained in:
Elian Doran
2025-11-23 10:22:58 +02:00
parent 33c3fb7de0
commit 9bed6b7e22
2 changed files with 44 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

51
apps/client/src/widgets/PromotedAttributes.tsx
View File

@@ -3,9 +3,13 @@ import "./PromotedAttributes.css";
import { useNoteContext } from "./react/hooks";
import { Attribute } from "../services/attribute_parser";
import FAttribute from "../entities/fattribute";
import clsx from "clsx";
import { t } from "../services/i18n";
import { DefinitionObject } from "../services/promoted_attribute_definition_parser";
interface Cell {
definitionAttr: FAttribute;
definition: DefinitionObject;
valueAttr: Attribute;
valueName: string;
}
@@ -44,7 +48,8 @@ export default function PromotedAttributes() {
}
for (const valueAttr of valueAttrs) {
cells.push({ definitionAttr, valueAttr, valueName });
const definition = definitionAttr.getDefinition();
cells.push({ definitionAttr, definition, valueAttr, valueName });
}
}
setCells(cells);
@@ -60,17 +65,49 @@ export default function PromotedAttributes() {
}
function PromotedAttributeCell({ cell }: { cell: Cell }) {
const { valueName, valueAttr, definitionAttr } = cell;
const { valueName, valueAttr, definition, definitionAttr } = cell;
const inputId = `value-${valueAttr.attributeId}`;
const definition = definitionAttr.getDefinition();
return (
<div className="promoted-attribute-cell">
<label for={inputId}>{definition.promotedAlias ?? valueName}</label>
<input
tabIndex={200 + definitionAttr.position}
id={inputId}
/>
<div className="input-group">
<input
tabIndex={200 + definitionAttr.position}
id={inputId}
/>
</div>
<ActionCell cell={cell} />
<MultiplicityCell cell={cell} />
</div>
)
}
function ActionCell({ cell }: { cell: Cell }) {
return (
<div>
</div>
)
}
function MultiplicityCell({ cell }: { cell: Cell }) {
return (cell.definition.multiplicity === "multi" &&
<td className="multiplicity">
<PromotedActionButton icon="bx bx-plus" title={t("promoted_attributes.add_new_attribute")} />{' '}
<PromotedActionButton icon="bx bx-trash" title={t("promoted_attributes.remove_this_attribute")} />
</td>
)
}
function PromotedActionButton({ icon, title }: {
icon: string,
title: string })
{
return (
<span
className={clsx("tn-tool-button pointer", icon)}
title={title}
/>
)
}