aboutsummaryrefslogtreecommitdiffstats
path: root/apps/web/components/dashboard/rules/RuleEngineEventSelector.tsx
diff options
context:
space:
mode:
authorMohamed Bassem <me@mbassem.com>2025-04-27 00:02:20 +0100
committerGitHub <noreply@github.com>2025-04-27 00:02:20 +0100
commit136f126296af65f50da598d084d1485c0e40437a (patch)
tree2725c7932ebbcb9b48b5af98eb9b72329a400260 /apps/web/components/dashboard/rules/RuleEngineEventSelector.tsx
parentca47be7fe7be128f459c37614a04902a873fe289 (diff)
downloadkarakeep-136f126296af65f50da598d084d1485c0e40437a.tar.zst
feat: Implement generic rule engine (#1318)
* Add schema for the new rule engine * Add rule engine backend logic * Implement the worker logic and event firing * Implement the UI changesfor the rule engine * Ensure that when a referenced list or tag are deleted, the corresponding event/action is * Dont show smart lists in rule engine events * Add privacy validations for attached tag and list ids * Move the rules logic into a models
Diffstat (limited to 'apps/web/components/dashboard/rules/RuleEngineEventSelector.tsx')
-rw-r--r--apps/web/components/dashboard/rules/RuleEngineEventSelector.tsx107
1 files changed, 107 insertions, 0 deletions
diff --git a/apps/web/components/dashboard/rules/RuleEngineEventSelector.tsx b/apps/web/components/dashboard/rules/RuleEngineEventSelector.tsx
new file mode 100644
index 00000000..ae37945e
--- /dev/null
+++ b/apps/web/components/dashboard/rules/RuleEngineEventSelector.tsx
@@ -0,0 +1,107 @@
+import { Card, CardContent } from "@/components/ui/card";
+import {
+ Select,
+ SelectContent,
+ SelectItem,
+ SelectTrigger,
+ SelectValue,
+} from "@/components/ui/select";
+import { useTranslation } from "react-i18next";
+
+import type { RuleEngineEvent } from "@karakeep/shared/types/rules";
+
+import { BookmarkListSelector } from "../lists/BookmarkListSelector";
+import { TagAutocomplete } from "../tags/TagAutocomplete";
+
+interface EventSelectorProps {
+ value: RuleEngineEvent;
+ onChange: (event: RuleEngineEvent) => void;
+}
+
+export function EventSelector({ value, onChange }: EventSelectorProps) {
+ const { t } = useTranslation();
+ const handleTypeChange = (type: RuleEngineEvent["type"]) => {
+ switch (type) {
+ case "bookmarkAdded":
+ onChange({ type: "bookmarkAdded" });
+ break;
+ case "tagAdded":
+ onChange({ type: "tagAdded", tagId: "" });
+ break;
+ case "tagRemoved":
+ onChange({ type: "tagRemoved", tagId: "" });
+ break;
+ case "addedToList":
+ onChange({ type: "addedToList", listId: "" });
+ break;
+ case "removedFromList":
+ onChange({ type: "removedFromList", listId: "" });
+ break;
+ case "favourited":
+ onChange({ type: "favourited" });
+ break;
+ case "archived":
+ onChange({ type: "archived" });
+ break;
+ default: {
+ const _exhaustiveCheck: never = type;
+ return null;
+ }
+ }
+ };
+
+ return (
+ <Card>
+ <CardContent className="p-4">
+ <div className="flex gap-4">
+ <Select value={value.type} onValueChange={handleTypeChange}>
+ <SelectTrigger id="event-type">
+ <SelectValue placeholder="Select event type" />
+ </SelectTrigger>
+ <SelectContent>
+ <SelectItem value="bookmarkAdded">
+ {t("settings.rules.events_types.bookmark_added")}
+ </SelectItem>
+ <SelectItem value="tagAdded">
+ {t("settings.rules.events_types.tag_added")}
+ </SelectItem>
+ <SelectItem value="tagRemoved">
+ {t("settings.rules.events_types.tag_removed")}
+ </SelectItem>
+ <SelectItem value="addedToList">
+ {t("settings.rules.events_types.added_to_list")}
+ </SelectItem>
+ <SelectItem value="removedFromList">
+ {t("settings.rules.events_types.removed_from_list")}
+ </SelectItem>
+ <SelectItem value="favourited">
+ {t("settings.rules.events_types.favourited")}
+ </SelectItem>
+ <SelectItem value="archived">
+ {t("settings.rules.events_types.archived")}
+ </SelectItem>
+ </SelectContent>
+ </Select>
+
+ {/* Additional fields based on event type */}
+ {(value.type === "tagAdded" || value.type === "tagRemoved") && (
+ <TagAutocomplete
+ className="w-full"
+ tagId={value.tagId}
+ onChange={(t) => onChange({ type: value.type, tagId: t ?? "" })}
+ />
+ )}
+
+ {(value.type === "addedToList" ||
+ value.type === "removedFromList") && (
+ <BookmarkListSelector
+ listTypes={["manual"]}
+ value={value.listId}
+ onChange={(l) => onChange({ type: value.type, listId: l })}
+ />
+ )}
+ </div>
+ </CardContent>
+ </Card>
+ );
+}