dirk-cfx-react 1.1.91 → 1.1.93

package/dist/components/index.d.cts

@@ -1058,7 +1058,8 @@ type ThemeOverrideSectionProps = {
 declare function ThemeOverrideSection({ schemaKey, title, }: ThemeOverrideSectionProps): react_jsx_runtime.JSX.Element;
 
 type AccessOverrideValue = {
-    /** Job / gang / ACE group names allowed to access this resource. */
+    /** ACE groups / permissions allowed to access this resource. Checked
+     *  server-side via IsPlayerAceAllowed (e.g. group.admin). NOT jobs/gangs. */
     groups: string[];
     /** Persistent player ids (citizenid on qb/qbx, license on esx — what
      *  PlayerSelect yields). dirk_lib also matches raw FiveM identifiers. */
@@ -1080,18 +1081,13 @@ type AccessOverrideSectionProps = {
      * explanation with a fallback.
      */
     description?: string;
-    /**
-     * Restrict the group picker to "job" or "gang" only. Omit to allow any
-     * group (jobs + gangs grouped in the dropdown). Forwarded to GroupName.
-     */
-    groupType?: "job" | "gang";
     /**
      * When true, the player picker searches offline players (DB-backed) too.
      * Defaults to true so admins can grant access to players who aren't online.
      */
     includeOffline?: boolean;
 };
-declare function AccessOverrideSection({ schemaKey, title, description, groupType, includeOffline, }: AccessOverrideSectionProps): react_jsx_runtime.JSX.Element;
+declare function AccessOverrideSection({ schemaKey, title, description, includeOffline, }: AccessOverrideSectionProps): react_jsx_runtime.JSX.Element;
 
 type AnimPostFxSelectProps = Omit<SelectProps, "data" | "value" | "onChange"> & {
     /** Current effect name. Empty string = no effect selected. */

package/dist/components/index.d.ts

@@ -1058,7 +1058,8 @@ type ThemeOverrideSectionProps = {
 declare function ThemeOverrideSection({ schemaKey, title, }: ThemeOverrideSectionProps): react_jsx_runtime.JSX.Element;
 
 type AccessOverrideValue = {
-    /** Job / gang / ACE group names allowed to access this resource. */
+    /** ACE groups / permissions allowed to access this resource. Checked
+     *  server-side via IsPlayerAceAllowed (e.g. group.admin). NOT jobs/gangs. */
     groups: string[];
     /** Persistent player ids (citizenid on qb/qbx, license on esx — what
      *  PlayerSelect yields). dirk_lib also matches raw FiveM identifiers. */
@@ -1080,18 +1081,13 @@ type AccessOverrideSectionProps = {
      * explanation with a fallback.
      */
     description?: string;
-    /**
-     * Restrict the group picker to "job" or "gang" only. Omit to allow any
-     * group (jobs + gangs grouped in the dropdown). Forwarded to GroupName.
-     */
-    groupType?: "job" | "gang";
     /**
      * When true, the player picker searches offline players (DB-backed) too.
      * Defaults to true so admins can grant access to players who aren't online.
      */
     includeOffline?: boolean;
 };
-declare function AccessOverrideSection({ schemaKey, title, description, groupType, includeOffline, }: AccessOverrideSectionProps): react_jsx_runtime.JSX.Element;
+declare function AccessOverrideSection({ schemaKey, title, description, includeOffline, }: AccessOverrideSectionProps): react_jsx_runtime.JSX.Element;
 
 type AnimPostFxSelectProps = Omit<SelectProps, "data" | "value" | "onChange"> & {
     /** Current effect name. Empty string = no effect selected. */

package/dist/components/index.js

@@ -5,7 +5,7 @@ import { create, useStore, createStore } from 'zustand';
 import { z } from 'zod';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { motion, AnimatePresence, useMotionValue } from 'framer-motion';
-import { Info, X, AlertTriangle, Trash2, RefreshCw, ChevronDown, Check, Copy, MapPin, Crosshair, EyeOff, Eye, RotateCcw, FlaskConical, ChevronUp, Palette, ShieldCheck, Users, UserRound, Plus, DoorOpen, Minus, ArrowLeft, Undo2, Redo2, Save, History, XCircle, Code2, Search, Filter, User } from 'lucide-react';
+import { Info, X, AlertTriangle, Trash2, RefreshCw, ChevronDown, Check, Copy, MapPin, Crosshair, EyeOff, Eye, RotateCcw, FlaskConical, ChevronUp, Palette, ShieldCheck, Users, Plus, UserRound, DoorOpen, Minus, ArrowLeft, Undo2, Redo2, Save, History, XCircle, Code2, Search, Filter, User } from 'lucide-react';
 import clickSoundUrl from '../click_sound-PNCRRTM4.mp3';
 import hoverSoundUrl from '../hover_sound-NBUA222C.mp3';
 import { notifications } from '@mantine/notifications';
@@ -1258,11 +1258,11 @@ var colorNames = {
   Yellow: { r: 255, g: 255, b: 0 },
   YellowGreen: { r: 154, g: 205, b: 50 }
 };
-function colorWithAlpha(color, alpha17) {
+function colorWithAlpha(color, alpha18) {
   const lowerCasedColor = color.toLowerCase();
   if (colorNames[lowerCasedColor]) {
     const rgb = colorNames[lowerCasedColor];
-    return `rgba(${rgb.r}, ${rgb.g}, ${rgb.b}, ${alpha17})`;
+    return `rgba(${rgb.r}, ${rgb.g}, ${rgb.b}, ${alpha18})`;
   }
   if (/^#([A-Fa-f0-9]{6})$/.test(color)) {
     const hex = color.slice(1);
@@ -1270,12 +1270,12 @@ function colorWithAlpha(color, alpha17) {
     const r = bigint >> 16 & 255;
     const g = bigint >> 8 & 255;
     const b = bigint & 255;
-    return `rgba(${r}, ${g}, ${b}, ${alpha17})`;
+    return `rgba(${r}, ${g}, ${b}, ${alpha18})`;
   }
   if (/^rgb\((\d{1,3}), (\d{1,3}), (\d{1,3})\)$/.test(color)) {
     const result = color.match(/^rgb\((\d{1,3}), (\d{1,3}), (\d{1,3})\)$/);
     if (result) {
-      return `rgba(${result[1]}, ${result[2]}, ${result[3]}, ${alpha17})`;
+      return `rgba(${result[1]}, ${result[2]}, ${result[3]}, ${alpha18})`;
     }
   }
   return color;
@@ -4445,11 +4445,11 @@ function cloneConfig(value) {
   return JSON.parse(JSON.stringify(value));
 }
 function ServerOnlyFetcher() {
-  const { fetchConfig } = getScriptConfigInstance();
+  const { fetchServerOnly } = getScriptConfigInstance();
   const { reinitialize } = useFormActions();
   useEffect(() => {
     let cancelled = false;
-    fetchConfig().then((full) => {
+    fetchServerOnly().then((full) => {
       if (!cancelled && full) reinitialize(full);
     }).catch(() => {
     });
@@ -4473,7 +4473,7 @@ function ConfigPanel(props) {
         if (isSaving) return;
         setIsSaving(true);
         try {
-          const result = await updateConfig(form.values);
+          const result = await updateConfig(form.values, form.changedFields);
           if (result?.success) {
             form.reinitialize(cloneConfig(form.values));
             dirkQueryClient.invalidateQueries({ queryKey: ["scriptConfigHistory"] });
@@ -5900,6 +5900,7 @@ function formatLabel(p) {
   }
   return parts.join(" \xB7 ");
 }
+var COMMON_ACE_GROUPS = ["group.admin", "group.mod", "group.superadmin"];
 var t = (key, fallback) => {
   const v = locale(key);
   return v === key ? fallback : v;
@@ -5922,7 +5923,6 @@ function AccessOverrideSection({
   schemaKey = "access",
   title,
   description,
-  groupType,
   includeOffline = true
 }) {
   const mantineTheme = useMantineTheme();
@@ -5937,14 +5937,19 @@ function AccessOverrideSection({
   const [addingGroup, setAddingGroup] = useState(false);
   const [addingPlayer, setAddingPlayer] = useState(false);
   const commitGroup = (name) => {
-    if (!name) return;
-    set("groups", [...value.groups, name]);
+    const g = name.trim();
+    if (!g) return;
+    if (!value.groups.includes(g)) set("groups", [...value.groups, g]);
     setAddingGroup(false);
   };
   const setGroup = (index, name) => {
     const next = [...value.groups];
     next[index] = name;
-    set("groups", next.filter((g) => g !== ""));
+    set("groups", next);
+  };
+  const quickAddGroup = (name) => {
+    if (value.groups.includes(name)) return;
+    set("groups", [...value.groups, name]);
   };
   const removeGroup = (index) => set("groups", value.groups.filter((_, i) => i !== index));
   const commitIdentifier = (id) => {
@@ -5976,19 +5981,68 @@ function AccessOverrideSection({
         ),
         /* @__PURE__ */ jsx(Text, { ff: "Akrobat Bold", size: "xxs", c: "rgba(255,255,255,0.4)", children: description || t(
           "AccessOverrideDesc",
-          "Grant access to this resource's admin panel to specific groups and players, in addition to your global dirk_lib admins. Enforcement is server-side."
+          "Grant access to this resource's admin panel to specific ACE groups and players, in addition to your global dirk_lib admins. Enforcement is server-side."
         ) }),
-        /* @__PURE__ */ jsx(SectionLabel, { icon: Users, label: t("AccessGroups", "Groups") }),
+        /* @__PURE__ */ jsx(SectionLabel, { icon: Users, label: t("AccessGroups", "Admin groups (ACE)") }),
+        /* @__PURE__ */ jsx(Flex, { gap: "xs", wrap: "wrap", children: COMMON_ACE_GROUPS.map((g) => {
+          const added = value.groups.includes(g);
+          return /* @__PURE__ */ jsxs(
+            Flex,
+            {
+              align: "center",
+              gap: "xxs",
+              onClick: added ? void 0 : () => quickAddGroup(g),
+              role: "button",
+              tabIndex: added ? -1 : 0,
+              "aria-disabled": added,
+              onKeyDown: (e) => {
+                if (added) return;
+                if (e.key === "Enter" || e.key === " ") {
+                  e.preventDefault();
+                  quickAddGroup(g);
+                }
+              },
+              px: "xs",
+              py: "xxs",
+              style: {
+                cursor: added ? "default" : "pointer",
+                opacity: added ? 0.4 : 1,
+                background: alpha(color, 0.12),
+                border: `0.1vh solid ${alpha(color, 0.4)}`,
+                borderRadius: "0.4vh",
+                transition: "background 0.15s, border-color 0.15s"
+              },
+              onMouseEnter: (e) => {
+                if (added) return;
+                e.currentTarget.style.background = alpha(color, 0.22);
+              },
+              onMouseLeave: (e) => {
+                if (added) return;
+                e.currentTarget.style.background = alpha(color, 0.12);
+              },
+              children: [
+                !added && /* @__PURE__ */ jsx(Plus, { size: "1.2vh", color }),
+                /* @__PURE__ */ jsx(Text, { ff: "Akrobat Bold", size: "xxs", lts: "0.04em", c: color, children: g })
+              ]
+            },
+            g
+          );
+        }) }),
         /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: "xxs", children: [
-          value.groups.length === 0 && !addingGroup && /* @__PURE__ */ jsx(EmptyHint, { text: t("AccessNoGroups", "No groups added.") }),
+          value.groups.length === 0 && !addingGroup && /* @__PURE__ */ jsx(
+            EmptyHint,
+            {
+              text: t("AccessNoGroups", "No ACE groups added. e.g. group.admin")
+            }
+          ),
           value.groups.map((name, i) => /* @__PURE__ */ jsxs(Flex, { align: "center", gap: "xs", children: [
             /* @__PURE__ */ jsx(
-              GroupName,
+              TextInput,
               {
                 value: name,
-                onChange: (v) => setGroup(i, v),
-                type: groupType,
-                placeholder: t("AccessPickGroup", "Pick a group\u2026"),
+                onChange: (e) => setGroup(i, e.currentTarget.value),
+                placeholder: t("AccessGroupPlaceholder", "ACE group or permission, e.g. group.admin"),
+                size: "xs",
                 style: { flex: 1 }
               }
             ),
@@ -6005,30 +6059,15 @@ function AccessOverrideSection({
               }
             )
           ] }, i)),
-          addingGroup && /* @__PURE__ */ jsxs(Flex, { align: "center", gap: "xs", children: [
-            /* @__PURE__ */ jsx(
-              GroupName,
-              {
-                value: "",
-                onChange: (v) => commitGroup(v),
-                type: groupType,
-                placeholder: t("AccessPickGroup", "Pick a group\u2026"),
-                style: { flex: 1 }
-              }
-            ),
-            /* @__PURE__ */ jsx(
-              ActionIcon,
-              {
-                variant: "subtle",
-                color: "red",
-                size: "md",
-                onClick: () => setAddingGroup(false),
-                title: t("Remove", "Remove"),
-                "aria-label": t("Remove", "Remove"),
-                children: /* @__PURE__ */ jsx(Trash2, { size: "1.4vh" })
-              }
-            )
-          ] })
+          addingGroup && /* @__PURE__ */ jsx(
+            AceGroupAddRow,
+            {
+              placeholder: t("AccessGroupPlaceholder", "ACE group or permission, e.g. group.admin"),
+              onCommit: commitGroup,
+              onCancel: () => setAddingGroup(false),
+              removeLabel: t("Remove", "Remove")
+            }
+          )
         ] }),
         !addingGroup && /* @__PURE__ */ jsx(AddRowButton, { label: t("AccessAddGroup", "Add group"), onClick: () => setAddingGroup(true) }),
         /* @__PURE__ */ jsx(SectionLabel, { icon: UserRound, label: t("AccessPlayers", "Players") }),
@@ -6128,6 +6167,53 @@ function AddRowButton({ label, onClick }) {
     }
   );
 }
+function AceGroupAddRow({
+  placeholder,
+  onCommit,
+  onCancel,
+  removeLabel
+}) {
+  const [draft, setDraft] = useState("");
+  const commit = () => {
+    if (draft.trim()) onCommit(draft);
+    else onCancel();
+  };
+  return /* @__PURE__ */ jsxs(Flex, { align: "center", gap: "xs", children: [
+    /* @__PURE__ */ jsx(
+      TextInput,
+      {
+        value: draft,
+        onChange: (e) => setDraft(e.currentTarget.value),
+        onKeyDown: (e) => {
+          if (e.key === "Enter") {
+            e.preventDefault();
+            commit();
+          } else if (e.key === "Escape") {
+            e.preventDefault();
+            onCancel();
+          }
+        },
+        onBlur: commit,
+        placeholder,
+        size: "xs",
+        autoFocus: true,
+        style: { flex: 1 }
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      ActionIcon,
+      {
+        variant: "subtle",
+        color: "red",
+        size: "md",
+        onClick: onCancel,
+        title: removeLabel,
+        "aria-label": removeLabel,
+        children: /* @__PURE__ */ jsx(Trash2, { size: "1.4vh" })
+      }
+    )
+  ] });
+}
 
 // src/utils/gtaAnimPostFx.ts
 var GTA_ANIM_POST_FX_GROUP_ORDER = [