@ottttto/dsh-scheduled-send 0.3.1 → 0.3.2

package/lib/client.js

@@ -499,6 +499,7 @@ function createClientPluginBody(React) {
     const core = props.panelCore;
     const [open, setOpen] = React.useState(false);
     const [tick, setTick] = React.useState(0);
+    const [hover, setHover] = React.useState(false);
     const mobile = isMobile();
 
     // keep the badge alive even while the panel is closed: poll the FULL
@@ -524,11 +525,13 @@ function createClientPluginBody(React) {
 
     const isDark = typeof window !== "undefined" && window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches;
     const entryBtn = {
-      cursor: "pointer", display: "inline-flex", alignItems: "center", gap: 6,
-      border: "none", background: "transparent", color: "inherit",
-      fontSize: 12, fontWeight: 600, padding: "4px 8px", borderRadius: 8, whiteSpace: "nowrap",
+      cursor: "pointer", display: "flex", alignItems: "center", gap: 8,
+      width: "100%", boxSizing: "border-box", textAlign: "left",
+      border: "none", background: hover ? "rgba(128,128,128,.16)" : "transparent", color: "inherit",
+      fontSize: 12, fontWeight: 600, padding: "6px 10px", borderRadius: 8, whiteSpace: "nowrap",
       ...(mobile ? { minHeight: TOUCH_MIN } : {}),
     };
+    const iconBox = { display: "inline-flex", width: 16, justifyContent: "center", flexShrink: 0 };
     const badge = (n) => h("span", {
       key: "b", "data-badge": n,
       style: {
@@ -623,14 +626,18 @@ function createClientPluginBody(React) {
         ])
       : null;
 
-    return h("div", { "data-plugin": "dsh-scheduled-send-sidebar", style: { display: "inline-flex", alignItems: "center" } }, [
+    return h("div", { "data-plugin": "dsh-scheduled-send-sidebar", style: { width: "100%" } }, [
+      null,
       h("button", {
         key: "btn", type: "button",
+        onMouseEnter: () => setHover(true),
+        onMouseLeave: () => setHover(false),
         onClick: () => { setOpen(!open); setTick((n) => n + 1); },
         title: "定时任务", "aria-label": "定时任务", style: entryBtn,
       }, [
-        h("span", { key: "l" }, "⏰ 定时任务"),
-        all.length ? badge(all.length) : null,
+        h("span", { key: "i", style: iconBox }, "⏰"),
+        h("span", { key: "l" }, "定时任务"),
+        all.length ? h("span", { key: "bs", style: { marginLeft: "auto", display: "inline-flex" } }, badge(all.length)) : null,
       ]),
       footer,
     ]);
@@ -690,6 +697,9 @@ function createClientPluginBody(React) {
 
     const inject = ["slots", "sessions"]; // sessions: sidebar panel jump (0.3.0)
     function apply(ctx) {
+      // due-time delivery: refresh the sidebar panel the moment a task fires
+      ctx.on?.('guard/scheduled-due', () => { void panelCore.refresh(); });
+      ctx.on?.('guard/scheduled-dropped', () => { void panelCore.refresh(); });
       ctx.inject(inject, (scope) => {
         // 0.3.0 session navigation, sourced from the sessions service:
         //  - open(id) selects a session as current (unknown ids throw → false)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ottttto/dsh-scheduled-send",
-  "version": "0.3.1",
+  "version": "0.3.2",
   "description": "DSH plugin: scheduled sending (⏰ composer button, dock list of pending tasks, sidebar 定时任务 panel with cross-session cancel, due-time delivery as a normal user bubble)",
   "type": "module",
   "main": "./src/index.js",

package/src/client-view.js

@@ -235,6 +235,7 @@ function createClientPluginBody(React) {
     const core = props.panelCore;
     const [open, setOpen] = React.useState(false);
     const [tick, setTick] = React.useState(0);
+    const [hover, setHover] = React.useState(false);
     const mobile = isMobile();
 
     // keep the badge alive even while the panel is closed: poll the FULL
@@ -260,11 +261,13 @@ function createClientPluginBody(React) {
 
     const isDark = typeof window !== "undefined" && window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches;
     const entryBtn = {
-      cursor: "pointer", display: "inline-flex", alignItems: "center", gap: 6,
-      border: "none", background: "transparent", color: "inherit",
-      fontSize: 12, fontWeight: 600, padding: "4px 8px", borderRadius: 8, whiteSpace: "nowrap",
+      cursor: "pointer", display: "flex", alignItems: "center", gap: 8,
+      width: "100%", boxSizing: "border-box", textAlign: "left",
+      border: "none", background: hover ? "rgba(128,128,128,.16)" : "transparent", color: "inherit",
+      fontSize: 12, fontWeight: 600, padding: "6px 10px", borderRadius: 8, whiteSpace: "nowrap",
       ...(mobile ? { minHeight: TOUCH_MIN } : {}),
     };
+    const iconBox = { display: "inline-flex", width: 16, justifyContent: "center", flexShrink: 0 };
     const badge = (n) => h("span", {
       key: "b", "data-badge": n,
       style: {
@@ -359,14 +362,18 @@ function createClientPluginBody(React) {
         ])
       : null;
 
-    return h("div", { "data-plugin": "dsh-scheduled-send-sidebar", style: { display: "inline-flex", alignItems: "center" } }, [
+    return h("div", { "data-plugin": "dsh-scheduled-send-sidebar", style: { width: "100%" } }, [
+      null,
       h("button", {
         key: "btn", type: "button",
+        onMouseEnter: () => setHover(true),
+        onMouseLeave: () => setHover(false),
         onClick: () => { setOpen(!open); setTick((n) => n + 1); },
         title: "定时任务", "aria-label": "定时任务", style: entryBtn,
       }, [
-        h("span", { key: "l" }, "⏰ 定时任务"),
-        all.length ? badge(all.length) : null,
+        h("span", { key: "i", style: iconBox }, "⏰"),
+        h("span", { key: "l" }, "定时任务"),
+        all.length ? h("span", { key: "bs", style: { marginLeft: "auto", display: "inline-flex" } }, badge(all.length)) : null,
       ]),
       footer,
     ]);
@@ -426,6 +433,9 @@ function createClientPluginBody(React) {
 
     const inject = ["slots", "sessions"]; // sessions: sidebar panel jump (0.3.0)
     function apply(ctx) {
+      // due-time delivery: refresh the sidebar panel the moment a task fires
+      ctx.on?.('guard/scheduled-due', () => { void panelCore.refresh(); });
+      ctx.on?.('guard/scheduled-dropped', () => { void panelCore.refresh(); });
       ctx.inject(inject, (scope) => {
         // 0.3.0 session navigation, sourced from the sessions service:
         //  - open(id) selects a session as current (unknown ids throw → false)