mirror of
https://github.com/hansjone/dsh-im-ops.git
synced 2026-10-09 00:33:20 +08:00
Polish access-grant UI: no sticky typeahead overlay, flatter group cards (4.9.1-ops.8).
Suggestions only open while focused and hide exact matches; nested group admins/members drop extra frames; pending and actions show group names. Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
parent
a4508a7caa
commit
e8e58924ca
6 changed files with 196 additions and 47 deletions
118
lib/client.js
118
lib/client.js
|
|
@ -571,7 +571,7 @@ var React24 = __toESM(require("react"), 1);
|
|||
// package.json
|
||||
var package_default = {
|
||||
name: "dsh-im-ops",
|
||||
version: "4.9.1-ops.7",
|
||||
version: "4.9.1-ops.8",
|
||||
description: "Ops fork of dsh-im (all channels kept). Based on @xmanrui/dsh-im@4.9.1 \u2014 access/session policies owned here.",
|
||||
keywords: [
|
||||
"deepseek-harness",
|
||||
|
|
@ -852,6 +852,14 @@ var EN = Object.freeze({
|
|||
"\u673A\u5668\u4EBA\u8BBE\u7F6E\u9875\u7B7E": "Bot settings tabs",
|
||||
"\u6295\u9012\u8BBE\u7F6E": "Delivery settings",
|
||||
"\u8BBF\u95EE\u8BBE\u7F6E": "Access settings",
|
||||
"\u7FA4\u804A \xB7 ": "Group \xB7 ",
|
||||
"\u3002\u8BB0\u5F97\u70B9\u4FDD\u5B58\u3002": ". Remember to save.",
|
||||
"\u5DF2\u52A0\u5165\u7FA4\u6388\u6743\uFF1A": "Added group access for: ",
|
||||
"\u52A0\u5165\u7FA4\uFF1A": "Add to group: ",
|
||||
"\u5DF2\u5728\u7FA4\uFF1A": "Already in group: ",
|
||||
"\u586B\u5199\u4FBF\u4E8E\u8BC6\u522B\u7684\u7FA4\u540D\u79F0": "Enter a readable group name",
|
||||
"\u7FA4\u540D\u79F0": "Group name",
|
||||
"\u672A\u77E5\u7FA4": "Unknown group",
|
||||
"\u65E0\u6CD5\u8BFB\u53D6\u8BBF\u95EE\u6388\u6743\uFF0C\u8BF7\u8FD4\u56DE\u5237\u65B0\u540E\u91CD\u8BD5\u3002": "Could not load the access grant. Go back, refresh, and try again.",
|
||||
"\u6B63\u5728\u8BFB\u53D6\u5206\u7EA7\u8BBF\u95EE\u8BBE\u7F6E\u2026": "Loading graded access settings\u2026",
|
||||
"\u52A0\u672C\u7FA4": "Add to group",
|
||||
|
|
@ -12580,6 +12588,17 @@ function contactLabel(contact) {
|
|||
const phone = contact.phone || "\u5F85\u8865\u7535\u8BDD";
|
||||
return `${name2} \xB7 ${phone}`;
|
||||
}
|
||||
function groupDisplayName(groupJid, groups) {
|
||||
const title = groups?.[groupJid]?.title;
|
||||
if (typeof title === "string" && title.trim()) return title.trim();
|
||||
const raw = String(groupJid ?? "");
|
||||
const id5 = raw.replace(/@g\.us$/i, "");
|
||||
if (id5.length > 14) return `${id5.slice(0, 10)}\u2026@g.us`;
|
||||
return raw || "\u672A\u77E5\u7FA4";
|
||||
}
|
||||
function digitsOnly(value) {
|
||||
return String(value ?? "").replace(/[^\d]/g, "");
|
||||
}
|
||||
function PhoneTypeahead({
|
||||
value,
|
||||
onChange,
|
||||
|
|
@ -12589,15 +12608,25 @@ function PhoneTypeahead({
|
|||
requirePhone = true
|
||||
}) {
|
||||
const [query, setQuery] = React21.useState(value || "");
|
||||
const [open, setOpen] = React21.useState(false);
|
||||
const blurTimer = React21.useRef(null);
|
||||
React21.useEffect(() => {
|
||||
setQuery(value || "");
|
||||
}, [value]);
|
||||
React21.useEffect(() => () => {
|
||||
if (blurTimer.current) window.clearTimeout(blurTimer.current);
|
||||
}, []);
|
||||
const q = query.trim().toLowerCase();
|
||||
const queryDigits = digitsOnly(query);
|
||||
const suggestions = (contacts ?? []).filter((contact) => {
|
||||
if (requirePhone && !contact.phone) return false;
|
||||
if (contact.phone && contact.phone === queryDigits && contact.phone === digitsOnly(value)) {
|
||||
return false;
|
||||
}
|
||||
if (!q) return Boolean(contact.phone);
|
||||
return (contact.phone ?? "").includes(q.replace(/[^\d]/g, "")) || (contact.pushName ?? "").toLowerCase().includes(q);
|
||||
return (contact.phone ?? "").includes(queryDigits) || (contact.pushName ?? "").toLowerCase().includes(q);
|
||||
}).slice(0, 8);
|
||||
const showSuggestions = open && !disabled && suggestions.length > 0;
|
||||
return h2(
|
||||
"div",
|
||||
{ className: "dim-accessTypeahead" },
|
||||
|
|
@ -12609,29 +12638,40 @@ function PhoneTypeahead({
|
|||
autoCapitalize: "none",
|
||||
autoCorrect: "off",
|
||||
spellCheck: false,
|
||||
autoComplete: "off",
|
||||
onFocus: () => {
|
||||
if (blurTimer.current) window.clearTimeout(blurTimer.current);
|
||||
setOpen(true);
|
||||
},
|
||||
onBlur: () => {
|
||||
blurTimer.current = window.setTimeout(() => setOpen(false), 120);
|
||||
},
|
||||
onChange: (event) => {
|
||||
setQuery(event.target.value);
|
||||
onChange(event.target.value);
|
||||
setOpen(true);
|
||||
}
|
||||
}),
|
||||
suggestions.length === 0 ? null : h2(
|
||||
showSuggestions ? h2(
|
||||
"ul",
|
||||
{ className: "dim-accessSuggestList" },
|
||||
{ className: "dim-accessSuggestList", role: "listbox" },
|
||||
suggestions.map((contact) => h2(
|
||||
"li",
|
||||
{ key: `${contact.phone}-${contact.lids?.[0] ?? ""}` },
|
||||
h2("button", {
|
||||
type: "button",
|
||||
className: "dim-deliveryButton",
|
||||
className: "dim-accessSuggestItem",
|
||||
disabled: disabled || requirePhone && !contact.phone,
|
||||
onMouseDown: (event) => event.preventDefault(),
|
||||
onClick: () => {
|
||||
if (!contact.phone) return;
|
||||
setQuery(contact.phone);
|
||||
onChange(contact.phone);
|
||||
setOpen(false);
|
||||
}
|
||||
}, contactLabel(contact))
|
||||
))
|
||||
)
|
||||
) : null
|
||||
);
|
||||
}
|
||||
function MemberRows({
|
||||
|
|
@ -12639,12 +12679,16 @@ function MemberRows({
|
|||
members,
|
||||
contacts,
|
||||
disabled,
|
||||
onChange
|
||||
onChange,
|
||||
nested = false
|
||||
}) {
|
||||
return h2(
|
||||
"fieldset",
|
||||
{ className: "dim-accessScene", disabled },
|
||||
h2("legend", null, title),
|
||||
nested ? "div" : "fieldset",
|
||||
{
|
||||
className: nested ? "dim-accessSubblock" : "dim-accessScene",
|
||||
...nested ? {} : { disabled }
|
||||
},
|
||||
nested ? h2("h4", { className: "dim-accessSubblockTitle" }, title) : h2("legend", null, title),
|
||||
h2("ul", { className: "dim-accessUserList" }, members.map((member, index) => h2(
|
||||
"li",
|
||||
{ key: `member-${index}`, className: "dim-accessUserRow" },
|
||||
|
|
@ -12695,13 +12739,17 @@ function AdminPhones({
|
|||
contacts,
|
||||
disabled,
|
||||
lockedPhone,
|
||||
onChange
|
||||
onChange,
|
||||
nested = false
|
||||
}) {
|
||||
return h2(
|
||||
"fieldset",
|
||||
{ className: "dim-accessScene", disabled },
|
||||
h2("legend", null, title),
|
||||
help ? h2("p", { className: "dim-accessUsersEmpty" }, help) : null,
|
||||
nested ? "div" : "fieldset",
|
||||
{
|
||||
className: nested ? "dim-accessSubblock" : "dim-accessScene",
|
||||
...nested ? {} : { disabled }
|
||||
},
|
||||
nested ? h2("h4", { className: "dim-accessSubblockTitle" }, title) : h2("legend", null, title),
|
||||
help ? h2("p", { className: "dim-accessHint" }, help) : null,
|
||||
h2("ul", { className: "dim-accessUserList" }, phones.map((phone, index) => {
|
||||
const locked = lockedPhone && phone === lockedPhone;
|
||||
return h2(
|
||||
|
|
@ -12914,7 +12962,7 @@ function AccessGrantSettingsPage({ channel: channel4, account, rpcCall, onSaved
|
|||
h2(
|
||||
"div",
|
||||
{ className: "dim-accessField" },
|
||||
h2("span", null, entry.kind === "group" ? ["\u7FA4\u804A", " ", entry.groupJid].join("") : "\u79C1\u804A"),
|
||||
h2("span", null, ...entry.kind === "group" ? ["\u7FA4\u804A \xB7 ", groupDisplayName(entry.groupJid, draft.groups)] : ["\u79C1\u804A"]),
|
||||
h2("strong", null, entry.pushName || entry.phone || entry.lid || entry.id),
|
||||
entry.unresolved ? h2("span", null, "\uFF08\u7535\u8BDD\u672A\u89E3\u6790\uFF0C\u8BF7\u5148\u5728\u8054\u7CFB\u4EBA\u4E2D\u786E\u8BA4\uFF09") : null,
|
||||
entry.requestText ? h2("p", null, entry.requestText.slice(0, 120)) : null
|
||||
|
|
@ -12948,15 +12996,21 @@ function AccessGrantSettingsPage({ channel: channel4, account, rpcCall, onSaved
|
|||
const group = draft.groups[groupJid] ?? { title: "", admins: [], members: [] };
|
||||
return h2(
|
||||
"div",
|
||||
{ key: groupJid, className: "dim-accessScene", "data-scene": "group-grant" },
|
||||
h2("h3", null, group.title || groupJid),
|
||||
{ key: groupJid, className: "dim-accessGroupCard" },
|
||||
h2(
|
||||
"div",
|
||||
{ className: "dim-accessGroupHeading" },
|
||||
h2("h3", null, groupDisplayName(groupJid, draft.groups)),
|
||||
h2("code", { className: "dim-accessGroupJid" }, groupJid)
|
||||
),
|
||||
h2(
|
||||
"label",
|
||||
{ className: "dim-accessField" },
|
||||
h2("span", null, "\u7FA4\u5907\u6CE8\u540D"),
|
||||
h2("span", null, "\u7FA4\u540D\u79F0"),
|
||||
h2("input", {
|
||||
value: group.title ?? "",
|
||||
maxLength: 128,
|
||||
placeholder: "\u586B\u5199\u4FBF\u4E8E\u8BC6\u522B\u7684\u7FA4\u540D\u79F0",
|
||||
onChange: (event) => setDraft((current) => ({
|
||||
...current,
|
||||
groups: {
|
||||
|
|
@ -12973,6 +13027,7 @@ function AccessGrantSettingsPage({ channel: channel4, account, rpcCall, onSaved
|
|||
contacts,
|
||||
disabled: saving,
|
||||
lockedPhone: null,
|
||||
nested: true,
|
||||
onChange: (admins) => setDraft((current) => ({
|
||||
...current,
|
||||
groups: {
|
||||
|
|
@ -12986,6 +13041,7 @@ function AccessGrantSettingsPage({ channel: channel4, account, rpcCall, onSaved
|
|||
members: group.members ?? [],
|
||||
contacts,
|
||||
disabled: saving,
|
||||
nested: true,
|
||||
onChange: (members) => setDraft((current) => ({
|
||||
...current,
|
||||
groups: {
|
||||
|
|
@ -13078,6 +13134,7 @@ function AccessGrantSettingsPage({ channel: channel4, account, rpcCall, onSaved
|
|||
}, alreadyDirect ? "\u5DF2\u5728\u79C1\u804A" : "\u52A0\u79C1\u804A") : null,
|
||||
...groupTargets.map((groupJid) => {
|
||||
const group = draft.groups[groupJid] ?? { admins: [], members: [] };
|
||||
const name2 = groupDisplayName(groupJid, draft.groups);
|
||||
const already = group.admins.includes(phone) || group.members.some((m) => m.phone === phone);
|
||||
return h2("button", {
|
||||
key: `add-${groupJid}`,
|
||||
|
|
@ -13104,9 +13161,12 @@ function AccessGrantSettingsPage({ channel: channel4, account, rpcCall, onSaved
|
|||
}
|
||||
};
|
||||
});
|
||||
setFeedback({ tone: "success", message: "\u5DF2\u52A0\u5165\u672C\u7FA4\u6388\u6743\uFF0C\u8BB0\u5F97\u70B9\u4FDD\u5B58\u3002" });
|
||||
setFeedback({
|
||||
tone: "success",
|
||||
message: ["\u5DF2\u52A0\u5165\u7FA4\u6388\u6743\uFF1A", name2, "\u3002\u8BB0\u5F97\u70B9\u4FDD\u5B58\u3002"].join("")
|
||||
});
|
||||
}
|
||||
}, already ? "\u5DF2\u5728\u672C\u7FA4" : "\u52A0\u672C\u7FA4");
|
||||
}, [already ? "\u5DF2\u5728\u7FA4\uFF1A" : "\u52A0\u5165\u7FA4\uFF1A", name2].join(""));
|
||||
})
|
||||
);
|
||||
}))
|
||||
|
|
@ -14520,12 +14580,22 @@ var CSS11 = String.raw`
|
|||
.dim-accessFeedback[data-tone="success"] { color: var(--dsw-alias-state-success-primary, #20a162); }
|
||||
.dim-accessFeedback[data-tone="error"] { color: var(--dsw-alias-state-error-primary, #d54941); }
|
||||
.dim-accessActions { display: flex; justify-content: flex-end; }
|
||||
.dim-accessTypeahead { position: relative; min-width: 0; display: grid; gap: 6px; }
|
||||
.dim-accessTypeahead { position: relative; z-index: 1; min-width: 0; display: grid; gap: 0; }
|
||||
.dim-accessTypeahead:focus-within { z-index: 6; }
|
||||
.dim-accessTypeahead > input { width: 100%; min-width: 0; height: 36px; padding: 0 9px; border: 1px solid var(--dsw-alias-border-l2, #dfe1e5); border-radius: 7px; color: var(--dsw-alias-label-primary, #1f2329); background: var(--dsw-alias-bg-layer-1, #fff); font: inherit; font-size: 12px; }
|
||||
.dim-accessTypeahead > input:focus { outline: 2px solid color-mix(in srgb, var(--dsw-alias-state-business-primary, #3370ff) 28%, transparent); border-color: var(--dsw-alias-state-business-primary, #3370ff); }
|
||||
.dim-accessSuggestList { position: absolute; z-index: 4; top: calc(100% + 4px); left: 0; right: 0; margin: 0; padding: 6px; list-style: none; display: grid; gap: 4px; max-height: 220px; overflow: auto; border: 1px solid var(--dsw-alias-border-l2, #dfe1e5); border-radius: 9px; background: var(--dsw-alias-bg-layer-1, #fff); box-shadow: 0 8px 24px color-mix(in srgb, #1f2329 12%, transparent); }
|
||||
.dim-accessSuggestList { position: absolute; z-index: 7; top: calc(100% + 4px); left: 0; right: 0; margin: 0; padding: 4px; list-style: none; display: grid; gap: 2px; max-height: 180px; overflow: auto; border: 1px solid var(--dsw-alias-border-l2, #dfe1e5); border-radius: 8px; background: var(--dsw-alias-bg-layer-1, #fff); box-shadow: 0 10px 28px color-mix(in srgb, #1f2329 16%, transparent); }
|
||||
.dim-accessSuggestList li { min-width: 0; }
|
||||
.dim-accessSuggestList .dim-deliveryButton { width: 100%; justify-content: flex-start; text-align: left; white-space: normal; }
|
||||
.dim-accessSuggestItem { width: 100%; min-height: 32px; padding: 6px 9px; border: 0; border-radius: 6px; background: transparent; color: var(--dsw-alias-label-primary, #1f2329); font: inherit; font-size: 12px; text-align: left; cursor: pointer; }
|
||||
.dim-accessSuggestItem:hover, .dim-accessSuggestItem:focus-visible { background: var(--dsw-alias-bg-module-platform, #f7f8fa); }
|
||||
.dim-accessSubblock { min-width: 0; display: grid; gap: 8px; margin-top: 12px; padding-top: 12px; border-top: 1px dashed var(--dsw-alias-border-l1, #eef0f3); }
|
||||
.dim-accessSubblockTitle { margin: 0; color: var(--dsw-alias-label-primary, #1f2329); font-size: 13px; line-height: 20px; font-weight: 620; }
|
||||
.dim-accessHint { margin: 0; color: var(--dsw-alias-label-tertiary, #8f959e); font-size: 11px; line-height: 17px; }
|
||||
.dim-accessGroupCard { min-width: 0; display: grid; gap: 12px; margin-top: 12px; padding: 14px; border: 1px solid var(--dsw-alias-border-l1, #eef0f3); border-radius: 10px; background: var(--dsw-alias-bg-module-platform, #f7f8fa); }
|
||||
.dim-accessGroupHeading { min-width: 0; display: grid; gap: 2px; }
|
||||
.dim-accessGroupHeading h3 { margin: 0; color: var(--dsw-alias-label-primary, #1f2329); font-size: 14px; line-height: 21px; font-weight: 650; }
|
||||
.dim-accessGroupJid { color: var(--dsw-alias-label-tertiary, #8f959e); font-size: 11px; line-height: 16px; overflow-wrap: anywhere; }
|
||||
.dim-accessUserRow { position: relative; z-index: 0; overflow: visible; }
|
||||
.dim-panel .dim-botCard .dim-cardFooter { margin-top: 0; }
|
||||
.dim-panel .ddt-headingCopy { display: none; }
|
||||
.dim-panel .ddt-qrFrame, .dim-panel .ddt-countdown { width: min(270px, 100%); }
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
Loading…
Add table
Add a link
Reference in a new issue