feat(call_to_action): filter call to actions

This commit is contained in:
Elian Doran
2025-08-12 17:05:52 +03:00
parent 38d6ae87b6
commit 27b80b573f

View File

@@ -1,40 +1,48 @@
import { useMemo, useState } from "preact/hooks";
import { useEffect, useMemo, useState } from "preact/hooks";
import Button from "../react/Button";
import Modal from "../react/Modal";
import ReactBasicWidget from "../react/ReactBasicWidget";
import options from "../../services/options";
interface CallToAction {
title: string;
message: string;
enabled: () => boolean;
buttons: {
text: string;
}[];
}
function isNextTheme() {
return [ "next", "next-light", "next-dark" ].includes(options.get("theme"));
}
const CALL_TO_ACTIONS: CallToAction[] = [
{
title: "Background effects are now stable",
message: "On Windows devices, background effects are now fully stable. The background effects adds a touch of color to the user interface by blurring the background behind it. This technique is also used in other applications such as Windows Explorer.",
buttons: [
{ text: "Enable background effects" }
]
},
{
title: "TriliumNext theme is now stable",
message: "For a while now, we've been working on a new theme to give the application a more modern look.",
enabled: isNextTheme,
buttons: [
{ text: "Switch to the TriliumNext theme"}
]
},
{
title: "Background effects are now stable",
message: "On Windows devices, background effects are now fully stable. The background effects adds a touch of color to the user interface by blurring the background behind it. This technique is also used in other applications such as Windows Explorer.",
enabled: () => isNextTheme() && options.is("backgroundEffects"),
buttons: [
{ text: "Enable background effects" }
]
}
];
function CallToActionDialogComponent() {
function CallToActionDialogComponent({ activeCallToActions }: { activeCallToActions: CallToAction[] }) {
const [ activeIndex, setActiveIndex ] = useState(0);
const [ shown, setShown ] = useState(true);
const activeItem = CALL_TO_ACTIONS[activeIndex];
const activeItem = activeCallToActions[activeIndex];
function goToNext() {
if (activeIndex + 1 < CALL_TO_ACTIONS.length) {
if (activeIndex + 1 < activeCallToActions.length) {
setActiveIndex(activeIndex + 1);
} else {
setShown(false);
@@ -64,7 +72,8 @@ function CallToActionDialogComponent() {
export class CallToActionDialog extends ReactBasicWidget {
get component() {
return <CallToActionDialogComponent />
const filteredCallToActions = CALL_TO_ACTIONS.filter((callToAction) => callToAction.enabled());
return <CallToActionDialogComponent activeCallToActions={filteredCallToActions} />
}
}