web: add utils for grouping

Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org>
This commit is contained in:
Jens Langhammer 2021-03-31 15:57:59 +02:00
parent 25e043afea
commit b15aca80ca
2 changed files with 15 additions and 9 deletions

View File

@ -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);

View File

@ -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);
}