dawlad-paperclip-direction 0.3.2 → 0.3.3

package/dist/manifest.js

@@ -11,7 +11,7 @@ var route = (routeKey, method, path) => ({
 var manifest = {
   id: "dawlad.direction",
   apiVersion: 1,
-  version: "0.3.2",
+  version: "0.3.3",
   displayName: "Direction",
   description: "Horizon, campaigns, milestones and one queue of decisions: where Dawlad is heading and what's in the way.",
   author: "Aly Solamon",

package/dist/ui/index.js

@@ -184,6 +184,11 @@ html:has([data-dx-page="decisions"]) ol[data-slot="breadcrumb-list"]:has(a[href$
 .dx-props-g { display: grid; grid-template-columns: 96px minmax(0, 1fr); row-gap: 12px; column-gap: 12px; font-size: 13.5px; align-items: center; padding-bottom: 10px; border-bottom: 1px solid var(--dx-line); }
 .dx-props-g .k { color: var(--dx-muted); }
 .dx-props-g .v { min-width: 0; overflow-wrap: anywhere; }
+.dx-pv { border: 1px solid transparent; background: transparent; color: var(--dx-fg); font: inherit; font-size: 13.5px; padding: 3px 6px; margin-left: -7px; border-radius: 6px; max-width: 100%; cursor: pointer; color-scheme: inherit; }
+.dx-pv:hover, .dx-pv:focus { border-color: var(--dx-line); background: var(--dx-soft); outline: none; }
+.dx-pv option { background: var(--dx-card); color: var(--dx-fg); }
+.dx-pv.num { width: 72px; cursor: text; }
+.dx-busy { opacity: .55; pointer-events: none; }
 .dx-plist { display: grid; gap: 2px; }
 .dx-plist .r { display: flex; align-items: center; gap: 10px; width: 100%; text-align: left; border: 0; background: transparent; color: var(--dx-fg); padding: 7px 6px; border-radius: 6px; cursor: pointer; font-size: 13.5px; }
 .dx-plist .r:hover, .dx-plist .r:focus-visible { background: var(--dx-soft2); outline: none; }
@@ -2353,7 +2358,7 @@ function CampaignPage({ companyId, goalId, tab, m, query }) {
       tab === "connected" && /* @__PURE__ */ jsx7(ConnectedTab, { d: data, extra }),
       tab === "activity" && /* @__PURE__ */ jsx7(ActivityTab, { d: data })
     ] }),
-    pane ? /* @__PURE__ */ jsx7(CampaignPane, { d: data, extra, onClose: () => setPane(false) }) : /* @__PURE__ */ jsxs7("aside", { className: "dx-pane-rail", children: [
+    pane ? /* @__PURE__ */ jsx7(CampaignPane, { d: data, extra, m, companyId, refresh, onClose: () => setPane(false) }) : /* @__PURE__ */ jsxs7("aside", { className: "dx-pane-rail", children: [
       /* @__PURE__ */ jsx7("button", { className: "dx-icon", "aria-label": "Show the properties panel", title: "Properties and everything linked", onClick: () => setPane(true), children: Ico.doc }),
       /* @__PURE__ */ jsx7("span", { className: "dx-pane-rail-t", onClick: () => setPane(true), children: "Properties" })
     ] })
@@ -2784,7 +2789,7 @@ function useHostConnected(companyId, d) {
   }, [key]);
   return out;
 }
-function CampaignPane({ d, extra, onClose }) {
+function CampaignPane({ d, extra, m, companyId, refresh, onClose }) {
   const go = useGo("direction");
   const groups = [
     {
@@ -2894,44 +2899,120 @@ function CampaignPane({ d, extra, onClose }) {
       /* @__PURE__ */ jsx7("span", { style: { flex: 1 } }),
       /* @__PURE__ */ jsx7("button", { className: "dx-icon", "aria-label": "Hide the panel", title: "Hide the panel", onClick: onClose, children: Ico.x })
     ] }),
-    /* @__PURE__ */ jsx7("div", { className: "dx-pane-body", children: active === "props" ? /* @__PURE__ */ jsx7(CampaignProps, { d, groups, onOpen: pick }) : cur ? /* @__PURE__ */ jsx7(ConnList, { g: cur, onItem: openItem }) : /* @__PURE__ */ jsxs7("div", { className: "dx-pane-empty", children: [
+    /* @__PURE__ */ jsx7("div", { className: "dx-pane-body", children: active === "props" ? /* @__PURE__ */ jsx7(CampaignProps, { d, m, companyId, refresh, groups, onOpen: pick }) : cur ? /* @__PURE__ */ jsx7(ConnList, { g: cur, onItem: openItem }) : /* @__PURE__ */ jsxs7("div", { className: "dx-pane-empty", children: [
       /* @__PURE__ */ jsx7("b", { children: "Nothing is open." }),
       /* @__PURE__ */ jsx7("span", { className: "dx-muted dx-small", children: "Use + to open the properties or anything linked to this campaign." })
     ] }) })
   ] });
 }
-function CampaignProps({ d, groups, onOpen }) {
+function useAgents(companyId) {
+  const [list, setList] = useState6([]);
+  useEffect3(() => {
+    let live = true;
+    fetch(`/api/companies/${companyId}/agents`, { credentials: "same-origin" }).then((r) => r.ok ? r.json() : []).then((a) => {
+      if (live) setList((Array.isArray(a) ? a : []).filter((x) => x.status !== "terminated").map((x) => ({ id: x.id, name: x.name, title: x.title ?? null })));
+    }).catch(() => {
+    });
+    return () => {
+      live = false;
+    };
+  }, [companyId]);
+  return list;
+}
+function CampaignProps({ d, m, companyId, refresh, groups, onOpen }) {
   const c = d.campaign;
-  const row = (k, v) => /* @__PURE__ */ jsxs7(Fragment4, { children: [
+  const set = usePluginAction("set-campaign");
+  const agents = useAgents(companyId);
+  const [busy, setBusy] = useState6(null);
+  const [err, setErr] = useState6(null);
+  const [mins, setMins] = useState6(c.alyMinutes != null ? String(c.alyMinutes) : "");
+  useEffect3(() => setMins(c.alyMinutes != null ? String(c.alyMinutes) : ""), [c.alyMinutes]);
+  const save = async (field, patch) => {
+    setBusy(field);
+    setErr(null);
+    try {
+      await set({ companyId, goalId: c.goalId, ...patch });
+      refresh();
+    } catch (e) {
+      setErr(e.message);
+    } finally {
+      setBusy(null);
+    }
+  };
+  const row = (k, v, field) => /* @__PURE__ */ jsxs7(Fragment4, { children: [
     /* @__PURE__ */ jsx7("span", { className: "k", children: k }),
-    /* @__PURE__ */ jsx7("span", { className: "v", children: v })
+    /* @__PURE__ */ jsx7("span", { className: `v${busy === field ? " dx-busy" : ""}`, children: v })
   ] });
+  const lead = c.owner.kind === "agent" ? c.owner.id ?? "" : "";
   return /* @__PURE__ */ jsxs7("div", { className: "dx-props", children: [
     /* @__PURE__ */ jsx7("div", { className: "dx-props-h", children: "Direction" }),
     /* @__PURE__ */ jsxs7("div", { className: "dx-props-g", children: [
-      row("Lead", /* @__PURE__ */ jsxs7("span", { className: "dx-row", children: [
-        /* @__PURE__ */ jsx7(Avatar, { who: c.owner }),
-        c.owner.name,
-        c.owner.title ? /* @__PURE__ */ jsxs7("span", { className: "dx-muted", children: [
-          "\xB7 ",
-          c.owner.title
-        ] }) : null
-      ] })),
-      row("Team", c.team?.name ?? /* @__PURE__ */ jsx7("span", { className: "dx-faint", children: "no team" })),
-      row("Serves", c.partName ?? /* @__PURE__ */ jsx7("span", { className: "dx-faint", children: "not placed" })),
-      row("Rank", /* @__PURE__ */ jsxs7("span", { className: "dx-row", children: [
-        c.rankLabel ? /* @__PURE__ */ jsx7("span", { className: "dx-pill solid", children: c.rankLabel }) : null,
-        /* @__PURE__ */ jsx7("span", { className: "dx-muted", children: c.state })
-      ] })),
+      row("Lead", /* @__PURE__ */ jsxs7("select", { className: "dx-pv", "aria-label": "Lead", value: lead, onChange: (e) => save("lead", { leadAgentId: e.target.value || null }), children: [
+        /* @__PURE__ */ jsx7("option", { value: "", children: "No lead" }),
+        agents.map((a) => /* @__PURE__ */ jsxs7("option", { value: a.id, children: [
+          a.name,
+          a.title ? ` \xB7 ${a.title}` : ""
+        ] }, a.id))
+      ] }), "lead"),
+      row("Team", /* @__PURE__ */ jsxs7("select", { className: "dx-pv", "aria-label": "Team", value: c.team?.goalId ?? "", onChange: (e) => e.target.value && save("team", { teamGoalId: e.target.value }), children: [
+        !c.team && /* @__PURE__ */ jsx7("option", { value: "", children: "No team" }),
+        m.teams.map((t) => /* @__PURE__ */ jsx7("option", { value: t.goalId, children: t.name }, t.goalId))
+      ] }), "team"),
+      row("Serves", /* @__PURE__ */ jsxs7("select", { className: "dx-pv", "aria-label": "Serves", value: c.partId ?? "", onChange: (e) => save("part", { partId: e.target.value || null }), children: [
+        /* @__PURE__ */ jsx7("option", { value: "", children: "Not placed" }),
+        m.horizon.parts.map((p) => /* @__PURE__ */ jsx7("option", { value: p.id, children: p.name }, p.id))
+      ] }), "part"),
+      row("Order", /* @__PURE__ */ jsxs7("span", { className: "dx-row", style: { gap: 4 }, children: [
+        /* @__PURE__ */ jsxs7("select", { className: "dx-pv", "aria-label": "Order", value: c.rankLabel ?? "", onChange: (e) => save("rank", { rankLabel: e.target.value || null }), children: [
+          /* @__PURE__ */ jsx7("option", { value: "", children: "Not ranked" }),
+          /* @__PURE__ */ jsx7("option", { value: "Now", children: "Now" }),
+          /* @__PURE__ */ jsx7("option", { value: "Next", children: "Next" }),
+          /* @__PURE__ */ jsx7("option", { value: "Later", children: "Later" })
+        ] }),
+        /* @__PURE__ */ jsxs7("select", { className: "dx-pv", "aria-label": "Focus or parked", value: c.state, onChange: (e) => save("rank", { state: e.target.value }), children: [
+          /* @__PURE__ */ jsx7("option", { value: "focus", children: "focus" }),
+          /* @__PURE__ */ jsx7("option", { value: "parked", children: "parked" })
+        ] })
+      ] }), "rank"),
       row("Health", /* @__PURE__ */ jsx7(HealthPill, { h: c.health }))
     ] }),
     /* @__PURE__ */ jsx7("div", { className: "dx-props-h", children: "Dates" }),
     /* @__PURE__ */ jsxs7("div", { className: "dx-props-g", children: [
-      row("Start", c.plannedStart ? fmt(c.plannedStart) : /* @__PURE__ */ jsx7("span", { className: "dx-faint", children: "not set" })),
-      row("Finish", fmt(c.forecastFinish ?? c.plannedFinish)),
+      row("Start", /* @__PURE__ */ jsx7("input", { className: "dx-pv", type: "date", "aria-label": "Start", value: c.plannedStart ?? "", onChange: (e) => save("start", { plannedStart: e.target.value || null }) }), "start"),
+      row("Finish", /* @__PURE__ */ jsxs7("span", { className: "dx-row", style: { gap: 6, flexWrap: "wrap" }, children: [
+        /* @__PURE__ */ jsx7("input", { className: "dx-pv", type: "date", "aria-label": "Planned finish", value: c.plannedFinish ?? "", onChange: (e) => save("finish", { plannedFinish: e.target.value || null }) }),
+        c.forecastFinish && c.forecastFinish !== c.plannedFinish && /* @__PURE__ */ jsxs7("span", { className: "dx-muted dx-xs", children: [
+          "forecast ",
+          fmt(c.forecastFinish)
+        ] })
+      ] }), "finish"),
       row("Plan was", /* @__PURE__ */ jsx7("span", { className: "dx-muted", children: fmt(c.planFinish ?? c.plannedFinish) })),
-      row("Review", c.reviewDate ? fmt(c.reviewDate) : /* @__PURE__ */ jsx7("span", { className: "dx-faint", children: "not set" })),
-      row("Your time", c.alyMinutes != null ? `${c.alyMinutes} min a week` : /* @__PURE__ */ jsx7("span", { className: "dx-faint", children: "not set" }))
+      row("Review", /* @__PURE__ */ jsx7("input", { className: "dx-pv", type: "date", "aria-label": "Review date", value: c.reviewDate ?? "", onChange: (e) => save("review", { reviewDate: e.target.value || null }) }), "review"),
+      row("Your time", /* @__PURE__ */ jsxs7("span", { className: "dx-row", style: { gap: 6 }, children: [
+        /* @__PURE__ */ jsx7(
+          "input",
+          {
+            className: "dx-pv num",
+            type: "number",
+            min: 0,
+            step: 5,
+            "aria-label": "Your minutes a week",
+            placeholder: "not set",
+            value: mins,
+            onChange: (e) => setMins(e.target.value),
+            onBlur: () => {
+              const v = mins.trim() === "" ? null : Number(mins);
+              if (v !== c.alyMinutes) save("mins", { alyMinutes: v });
+            },
+            onKeyDown: (e) => e.key === "Enter" && e.target.blur()
+          }
+        ),
+        /* @__PURE__ */ jsx7("span", { className: "dx-muted dx-small", children: "min a week" })
+      ] }), "mins")
+    ] }),
+    err && /* @__PURE__ */ jsxs7("div", { className: "dx-err dx-small", children: [
+      "Couldn't save: ",
+      err
     ] }),
     /* @__PURE__ */ jsx7("div", { className: "dx-props-h", children: "Linked" }),
     /* @__PURE__ */ jsx7("div", { className: "dx-plist", children: groups.map((g) => /* @__PURE__ */ jsxs7("button", { className: "r", onClick: () => onOpen(g.kind), children: [

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dawlad-paperclip-direction",
-  "version": "0.3.2",
+  "version": "0.3.3",
   "type": "module",
   "description": "Paperclip plugin: Horizon, campaigns and milestones (Direction page) for Da Applied AI Lab.",
   "paperclipPlugin": {