web: add utils for grouping
Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org>
This commit is contained in:
parent
25e043afea
commit
b15aca80ca
|
@ -7,6 +7,7 @@ import { Form } from "../../elements/forms/Form";
|
||||||
import { until } from "lit-html/directives/until";
|
import { until } from "lit-html/directives/until";
|
||||||
import { ifDefined } from "lit-html/directives/if-defined";
|
import { ifDefined } from "lit-html/directives/if-defined";
|
||||||
import "../../elements/forms/HorizontalFormElement";
|
import "../../elements/forms/HorizontalFormElement";
|
||||||
|
import { groupBy } from "../../utils";
|
||||||
|
|
||||||
@customElement("ak-stage-binding-form")
|
@customElement("ak-stage-binding-form")
|
||||||
export class StageBindingForm extends Form<FlowStageBinding> {
|
export class StageBindingForm extends Form<FlowStageBinding> {
|
||||||
|
@ -39,16 +40,8 @@ export class StageBindingForm extends Form<FlowStageBinding> {
|
||||||
};
|
};
|
||||||
|
|
||||||
groupStages(stages: Stage[]): TemplateResult {
|
groupStages(stages: Stage[]): TemplateResult {
|
||||||
const m = new Map<string, Stage[]>();
|
|
||||||
stages.forEach(p => {
|
|
||||||
if (!m.has(p.verboseName || "")) {
|
|
||||||
m.set(p.verboseName || "", []);
|
|
||||||
}
|
|
||||||
const tProviders = m.get(p.verboseName || "") || [];
|
|
||||||
tProviders.push(p);
|
|
||||||
});
|
|
||||||
return html`
|
return html`
|
||||||
${Array.from(m).map(([group, stages]) => {
|
${groupBy<Stage>(stages, (s => s.verboseName || "")).map(([group, stages]) => {
|
||||||
return html`<optgroup label=${group}>
|
return html`<optgroup label=${group}>
|
||||||
${stages.map(stage => {
|
${stages.map(stage => {
|
||||||
const selected = (this.fsb?.stage === stage.pk);
|
const selected = (this.fsb?.stage === stage.pk);
|
||||||
|
|
|
@ -56,3 +56,16 @@ export function camelToSnake(key: string): string {
|
||||||
const result = key.replace(/([A-Z])/g, " $1");
|
const result = key.replace(/([A-Z])/g, " $1");
|
||||||
return result.split(" ").join("_").toLowerCase();
|
return result.split(" ").join("_").toLowerCase();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export function groupBy<T>(objects: T[], callback: (obj: T) => string): Array<[string, T[]]> {
|
||||||
|
const m = new Map<string, T[]>();
|
||||||
|
objects.forEach(obj => {
|
||||||
|
const group = callback(obj);
|
||||||
|
if (!m.has(group)) {
|
||||||
|
m.set(group, []);
|
||||||
|
}
|
||||||
|
const tProviders = m.get(group) || [];
|
||||||
|
tProviders.push(obj);
|
||||||
|
});
|
||||||
|
return Array.from(m);
|
||||||
|
}
|
||||||
|
|
Reference in New Issue