forked from MapComplete/MapComplete
Reformat all files with prettier
This commit is contained in:
parent
e22d189376
commit
b541d3eab4
382 changed files with 50893 additions and 35566 deletions
|
|
@ -1,156 +1,183 @@
|
|||
import {FlowStep} from "./FlowStep";
|
||||
import Combine from "../Base/Combine";
|
||||
import {Store} from "../../Logic/UIEventSource";
|
||||
import LayerConfig from "../../Models/ThemeConfig/LayerConfig";
|
||||
import {InputElement} from "../Input/InputElement";
|
||||
import {AllKnownLayouts} from "../../Customizations/AllKnownLayouts";
|
||||
import {FixedInputElement} from "../Input/FixedInputElement";
|
||||
import Img from "../Base/Img";
|
||||
import Title from "../Base/Title";
|
||||
import {RadioButton} from "../Input/RadioButton";
|
||||
import {And} from "../../Logic/Tags/And";
|
||||
import {VariableUiElement} from "../Base/VariableUIElement";
|
||||
import Toggleable from "../Base/Toggleable";
|
||||
import {BBox} from "../../Logic/BBox";
|
||||
import BaseUIElement from "../BaseUIElement";
|
||||
import PresetConfig from "../../Models/ThemeConfig/PresetConfig";
|
||||
import List from "../Base/List";
|
||||
import Translations from "../i18n/Translations";
|
||||
|
||||
export default class SelectTheme extends Combine implements FlowStep<{
|
||||
features: any[],
|
||||
theme: string,
|
||||
layer: LayerConfig,
|
||||
bbox: BBox,
|
||||
}> {
|
||||
import { FlowStep } from "./FlowStep"
|
||||
import Combine from "../Base/Combine"
|
||||
import { Store } from "../../Logic/UIEventSource"
|
||||
import LayerConfig from "../../Models/ThemeConfig/LayerConfig"
|
||||
import { InputElement } from "../Input/InputElement"
|
||||
import { AllKnownLayouts } from "../../Customizations/AllKnownLayouts"
|
||||
import { FixedInputElement } from "../Input/FixedInputElement"
|
||||
import Img from "../Base/Img"
|
||||
import Title from "../Base/Title"
|
||||
import { RadioButton } from "../Input/RadioButton"
|
||||
import { And } from "../../Logic/Tags/And"
|
||||
import { VariableUiElement } from "../Base/VariableUIElement"
|
||||
import Toggleable from "../Base/Toggleable"
|
||||
import { BBox } from "../../Logic/BBox"
|
||||
import BaseUIElement from "../BaseUIElement"
|
||||
import PresetConfig from "../../Models/ThemeConfig/PresetConfig"
|
||||
import List from "../Base/List"
|
||||
import Translations from "../i18n/Translations"
|
||||
|
||||
export default class SelectTheme
|
||||
extends Combine
|
||||
implements
|
||||
FlowStep<{
|
||||
features: any[]
|
||||
theme: string
|
||||
layer: LayerConfig
|
||||
bbox: BBox
|
||||
}>
|
||||
{
|
||||
public readonly Value: Store<{
|
||||
features: any[],
|
||||
theme: string,
|
||||
layer: LayerConfig,
|
||||
bbox: BBox,
|
||||
}>;
|
||||
public readonly IsValid: Store<boolean>;
|
||||
features: any[]
|
||||
theme: string
|
||||
layer: LayerConfig
|
||||
bbox: BBox
|
||||
}>
|
||||
public readonly IsValid: Store<boolean>
|
||||
|
||||
constructor(params: ({ features: any[], layer: LayerConfig, bbox: BBox, })) {
|
||||
constructor(params: { features: any[]; layer: LayerConfig; bbox: BBox }) {
|
||||
const t = Translations.t.importHelper.selectTheme
|
||||
let options: InputElement<string>[] = AllKnownLayouts.layoutsList
|
||||
.filter(th => th.layers.some(l => l.id === params.layer.id))
|
||||
.filter(th => th.id !== "personal")
|
||||
.map(th => new FixedInputElement<string>(
|
||||
new Combine([
|
||||
new Img(th.icon).SetClass("block h-12 w-12 br-4"),
|
||||
new Title(th.title)
|
||||
]).SetClass("flex items-center"),
|
||||
th.id))
|
||||
|
||||
.filter((th) => th.layers.some((l) => l.id === params.layer.id))
|
||||
.filter((th) => th.id !== "personal")
|
||||
.map(
|
||||
(th) =>
|
||||
new FixedInputElement<string>(
|
||||
new Combine([
|
||||
new Img(th.icon).SetClass("block h-12 w-12 br-4"),
|
||||
new Title(th.title),
|
||||
]).SetClass("flex items-center"),
|
||||
th.id
|
||||
)
|
||||
)
|
||||
|
||||
const themeRadios = new RadioButton<string>(options, {
|
||||
selectFirstAsDefault: false
|
||||
selectFirstAsDefault: false,
|
||||
})
|
||||
|
||||
|
||||
const applicablePresets = themeRadios.GetValue().map(theme => {
|
||||
const applicablePresets = themeRadios.GetValue().map((theme) => {
|
||||
if (theme === undefined) {
|
||||
return []
|
||||
}
|
||||
// we get the layer with the correct ID via the actual theme config, as the actual theme might have different presets due to overrides
|
||||
const themeConfig = AllKnownLayouts.layoutsList.find(th => th.id === theme)
|
||||
const layer = themeConfig.layers.find(l => l.id === params.layer.id)
|
||||
const themeConfig = AllKnownLayouts.layoutsList.find((th) => th.id === theme)
|
||||
const layer = themeConfig.layers.find((l) => l.id === params.layer.id)
|
||||
return layer.presets
|
||||
})
|
||||
|
||||
|
||||
const nonMatchedElements = applicablePresets.map(presets => {
|
||||
const nonMatchedElements = applicablePresets.map((presets) => {
|
||||
if (presets === undefined || presets.length === 0) {
|
||||
return undefined
|
||||
}
|
||||
return params.features.filter(feat => !presets.some(preset => new And(preset.tags).matchesProperties(feat.properties)))
|
||||
return params.features.filter(
|
||||
(feat) =>
|
||||
!presets.some((preset) =>
|
||||
new And(preset.tags).matchesProperties(feat.properties)
|
||||
)
|
||||
)
|
||||
})
|
||||
|
||||
super([
|
||||
new Title(t.title),
|
||||
t.intro,
|
||||
t.intro,
|
||||
themeRadios,
|
||||
new VariableUiElement(applicablePresets.map(applicablePresets => {
|
||||
if (themeRadios.GetValue().data === undefined) {
|
||||
return undefined
|
||||
}
|
||||
if (applicablePresets === undefined || applicablePresets.length === 0) {
|
||||
return t.noMatchingPresets.SetClass("alert")
|
||||
}
|
||||
}, [themeRadios.GetValue()])),
|
||||
new VariableUiElement(
|
||||
applicablePresets.map(
|
||||
(applicablePresets) => {
|
||||
if (themeRadios.GetValue().data === undefined) {
|
||||
return undefined
|
||||
}
|
||||
if (applicablePresets === undefined || applicablePresets.length === 0) {
|
||||
return t.noMatchingPresets.SetClass("alert")
|
||||
}
|
||||
},
|
||||
[themeRadios.GetValue()]
|
||||
)
|
||||
),
|
||||
|
||||
new VariableUiElement(nonMatchedElements.map(unmatched => SelectTheme.nonMatchedElementsPanel(unmatched, applicablePresets.data), [applicablePresets]))
|
||||
]);
|
||||
new VariableUiElement(
|
||||
nonMatchedElements.map(
|
||||
(unmatched) =>
|
||||
SelectTheme.nonMatchedElementsPanel(unmatched, applicablePresets.data),
|
||||
[applicablePresets]
|
||||
)
|
||||
),
|
||||
])
|
||||
this.SetClass("flex flex-col")
|
||||
|
||||
this.Value = themeRadios.GetValue().map(theme => ({
|
||||
this.Value = themeRadios.GetValue().map((theme) => ({
|
||||
features: params.features,
|
||||
layer: params.layer,
|
||||
bbox: params.bbox,
|
||||
theme
|
||||
theme,
|
||||
}))
|
||||
|
||||
this.IsValid = this.Value.map(obj => {
|
||||
if (obj === undefined) {
|
||||
return false;
|
||||
}
|
||||
if ([obj.theme, obj.features].some(v => v === undefined)) {
|
||||
return false;
|
||||
}
|
||||
if (applicablePresets.data === undefined || applicablePresets.data.length === 0) {
|
||||
return false
|
||||
}
|
||||
if ((nonMatchedElements.data?.length ?? 0) > 0) {
|
||||
return false;
|
||||
}
|
||||
this.IsValid = this.Value.map(
|
||||
(obj) => {
|
||||
if (obj === undefined) {
|
||||
return false
|
||||
}
|
||||
if ([obj.theme, obj.features].some((v) => v === undefined)) {
|
||||
return false
|
||||
}
|
||||
if (applicablePresets.data === undefined || applicablePresets.data.length === 0) {
|
||||
return false
|
||||
}
|
||||
if ((nonMatchedElements.data?.length ?? 0) > 0) {
|
||||
return false
|
||||
}
|
||||
|
||||
return true;
|
||||
|
||||
}, [applicablePresets])
|
||||
return true
|
||||
},
|
||||
[applicablePresets]
|
||||
)
|
||||
}
|
||||
|
||||
private static nonMatchedElementsPanel(unmatched: any[], applicablePresets: PresetConfig[]): BaseUIElement {
|
||||
private static nonMatchedElementsPanel(
|
||||
unmatched: any[],
|
||||
applicablePresets: PresetConfig[]
|
||||
): BaseUIElement {
|
||||
if (unmatched === undefined || unmatched.length === 0) {
|
||||
return
|
||||
}
|
||||
const t = Translations.t.importHelper.selectTheme
|
||||
|
||||
const applicablePresetsOverview = applicablePresets.map(preset =>
|
||||
t.needsTags.Subs(
|
||||
{title: preset.title,
|
||||
tags:preset.tags.map(t => t.asHumanString()).join(" & ") })
|
||||
const t = Translations.t.importHelper.selectTheme
|
||||
|
||||
const applicablePresetsOverview = applicablePresets.map((preset) =>
|
||||
t.needsTags
|
||||
.Subs({
|
||||
title: preset.title,
|
||||
tags: preset.tags.map((t) => t.asHumanString()).join(" & "),
|
||||
})
|
||||
.SetClass("thanks")
|
||||
);
|
||||
)
|
||||
|
||||
const unmatchedPanels: BaseUIElement[] = []
|
||||
for (const feat of unmatched) {
|
||||
const parts: BaseUIElement[] = []
|
||||
parts.push(new Combine(Object.keys(feat.properties).map(k =>
|
||||
k+"="+feat.properties[k]
|
||||
)).SetClass("flex flex-col"))
|
||||
parts.push(
|
||||
new Combine(
|
||||
Object.keys(feat.properties).map((k) => k + "=" + feat.properties[k])
|
||||
).SetClass("flex flex-col")
|
||||
)
|
||||
|
||||
for (const preset of applicablePresets) {
|
||||
const tags = new And(preset.tags).asChange({})
|
||||
const missing = []
|
||||
for (const {k, v} of tags) {
|
||||
for (const { k, v } of tags) {
|
||||
if (preset[k] === undefined) {
|
||||
missing.push(t.missing.Subs({k,v}))
|
||||
missing.push(t.missing.Subs({ k, v }))
|
||||
} else if (feat.properties[k] !== v) {
|
||||
missing.push(t.misMatch.Subs({k, v, properties: feat.properties}))
|
||||
missing.push(t.misMatch.Subs({ k, v, properties: feat.properties }))
|
||||
}
|
||||
}
|
||||
|
||||
if (missing.length > 0) {
|
||||
parts.push(
|
||||
new Combine([
|
||||
t.notApplicable.Subs(preset),
|
||||
new List(missing)
|
||||
]).SetClass("flex flex-col alert")
|
||||
new Combine([t.notApplicable.Subs(preset), new List(missing)]).SetClass(
|
||||
"flex flex-col alert"
|
||||
)
|
||||
)
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
unmatchedPanels.push(new Combine(parts).SetClass("flex flex-col"))
|
||||
|
|
@ -159,11 +186,7 @@ export default class SelectTheme extends Combine implements FlowStep<{
|
|||
return new Combine([
|
||||
t.displayNonMatchingCount.Subs(unmatched).SetClass("alert"),
|
||||
...applicablePresetsOverview,
|
||||
new Toggleable(new Title(t.unmatchedTitle),
|
||||
new Combine(unmatchedPanels))
|
||||
new Toggleable(new Title(t.unmatchedTitle), new Combine(unmatchedPanels)),
|
||||
]).SetClass("flex flex-col")
|
||||
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue