101 lines
3.8 KiB
TypeScript
101 lines
3.8 KiB
TypeScript
import { Store, UIEventSource } from "../../Logic/UIEventSource"
|
|
import QuestionBox from "./QuestionBox"
|
|
import Combine from "../Base/Combine"
|
|
import TagRenderingAnswer from "./TagRenderingAnswer"
|
|
import ScrollableFullScreen from "../Base/ScrollableFullScreen"
|
|
import Constants from "../../Models/Constants"
|
|
import SharedTagRenderings from "../../Customizations/SharedTagRenderings"
|
|
import BaseUIElement from "../BaseUIElement"
|
|
import { VariableUiElement } from "../Base/VariableUIElement"
|
|
import LayerConfig from "../../Models/ThemeConfig/LayerConfig"
|
|
import Toggle from "../Input/Toggle"
|
|
import Lazy from "../Base/Lazy"
|
|
import FeaturePipelineState from "../../Logic/State/FeaturePipelineState"
|
|
import Svg from "../../Svg"
|
|
import Translations from "../i18n/Translations"
|
|
|
|
export default class FeatureInfoBox extends ScrollableFullScreen {
|
|
public constructor(
|
|
tags: UIEventSource<any>,
|
|
layerConfig: LayerConfig,
|
|
state: FeaturePipelineState,
|
|
options?: {
|
|
hashToShow?: string
|
|
isShown?: UIEventSource<boolean>
|
|
setHash?: true | boolean
|
|
}
|
|
) {
|
|
const showAllQuestions = state.featureSwitchShowAllQuestions.map(
|
|
(fsShow) => fsShow || state.showAllQuestionsAtOnce.data,
|
|
[state.showAllQuestionsAtOnce]
|
|
)
|
|
super(
|
|
() => undefined,
|
|
() => FeatureInfoBox.GenerateContent(tags, layerConfig, state, showAllQuestions),
|
|
options?.hashToShow ?? tags.data.id ?? "item",
|
|
options?.isShown,
|
|
options
|
|
)
|
|
|
|
if (layerConfig === undefined) {
|
|
throw "Undefined layerconfig"
|
|
}
|
|
}
|
|
|
|
public static GenerateContent(
|
|
tags: UIEventSource<any>,
|
|
layerConfig: LayerConfig
|
|
): BaseUIElement {
|
|
return new Toggle(
|
|
new Combine([
|
|
Svg.delete_icon_svg().SetClass("w-8 h-8"),
|
|
Translations.t.delete.isDeleted,
|
|
]).SetClass("flex justify-center font-bold items-center"),
|
|
FeatureInfoBox.GenerateMainContent(tags, layerConfig),
|
|
tags.map((t) => t["_deleted"] == "yes")
|
|
)
|
|
}
|
|
private static GenerateMainContent(
|
|
tags: UIEventSource<any>,
|
|
layerConfig: LayerConfig
|
|
): BaseUIElement {
|
|
const t = Translations.t.general
|
|
|
|
const withQuestion = layerConfig.tagRenderings.filter(
|
|
(tr) => tr.question !== undefined
|
|
).length
|
|
|
|
const allRenderings: BaseUIElement[] = [
|
|
new VariableUiElement(
|
|
tags
|
|
.map((data) => data["_newly_created"])
|
|
.map((isCreated) => {
|
|
if (isCreated === undefined) {
|
|
return undefined
|
|
}
|
|
const createdDate = new Date(isCreated)
|
|
const secondsSinceCreation = (Date.now() - createdDate.getTime()) / 1000
|
|
if (secondsSinceCreation >= 60 * 5) {
|
|
return undefined
|
|
}
|
|
|
|
const els = []
|
|
const thanks = new Combine([
|
|
Svg.party_svg().SetClass(
|
|
"w-12 h-12 shrink-0 p-1 m-1 bg-white rounded-full block"
|
|
),
|
|
t.newlyCreated,
|
|
]).SetClass("flex w-full thanks content-center")
|
|
els.push(thanks)
|
|
if (withQuestion > 0) {
|
|
els.push(t.feelFreeToSkip)
|
|
}
|
|
|
|
return new Combine(els).SetClass("pb-4 mb-4 border-b block border-black")
|
|
})
|
|
),
|
|
]
|
|
|
|
return new Combine(allRenderings).SetClass("block")
|
|
}
|
|
}
|