GroupsPage was sourcing modal candidates from useClients(), which is server-paginated at 25 rows — so "Add clients to group" only ever offered the first page, "Remove" missed members past page 1, and SubLinks silently skipped emails whose record wasn't in the cached page. Pull the unpaginated list via /panel/api/clients/list when any of the three modals open.
Surface ~400 hardcoded English labels, tooltips, placeholders, dt/divider
text, modal okText/cancelText, and Spin loading from the panel pages
(clients/groups/inbounds/nodes/settings/xray/sub/index) into
web/translation/en-US.json under existing pages.<page>.* namespaces, with
JSX swapped to t(...). Brand and protocol identifiers (TLS, MTU, SNI,
NordVPN, Cloudflare WARP, etc.) stay literal.
Sync all 12 non-English locales (ar-EG, es-ES, fa-IR, id-ID, ja-JP,
pt-BR, ru-RU, tr-TR, uk-UA, vi-VN, zh-CN, zh-TW) to match en-US's
structure and translate the 521 new key paths per locale. Every locale
file now has 1539 lines, mirroring en-US ordering.
Also remove a dead duplicate "info": "Info" key under pages.inbounds
that collided with the new pages.inbounds.info.* object.
Backend: bulk attach/detach errors in web/service/client.go now route
through logger.Warningf (so they appear under /panel/api/server/logs/)
instead of only living on the response payload.
A bundle of small UI fixes that surfaced together while reviewing the
panel.
Routing rules — stale Edit after drag:
- Dragging a rule and then clicking its Edit button used to open the
modal with the *previous* rule's content. Root cause: desktopColumns
was memoized with [t, isMobile, rows.length] (rows.length doesn't
change on reorder), so the cached render function kept handing AntD
the openEdit closure that captured the pre-drag rules array. Fix is
a rulesRef updated each render and read inside openEdit, so even the
cached closure sees the live array.
- Mobile rule cards on the same page were hard to tell apart: bumped
the inter-card gap, slightly stronger border, soft shadow, and a
small centered divider line between adjacent cards.
Mobile drawer (dark / ultra):
- The AntD Menu inside the mobile drawer was rendering with its own
darkItemBg (#15161a / #050507) while the drawer body used the
lighter colorBgElevated, producing visible two-tone seams. Force
the drawer-content / drawer-body to the same dark color that the
desktop sider uses, and make the menus transparent so they inherit.
Row menus — visual grouping:
- Groups page row menu: moved Rename above the divider so the
ordering reads safe → divider → destructive (Remove from group,
Delete clients, Delete group only) instead of mixing the two
groups.
- Inbounds page row menu: inserted a divider before delAllClients /
delete so the destructive items sit visually separated from the
earlier safe actions.
Dropdown affordances:
- Non-danger dropdown items had no perceivable hover state (default
colorBgTextHover is too subtle, especially under the light theme).
Apply the same primary-tint pattern the sider/drawer menu uses: 14%
primary background and primary color on label + icon.
- ant-dropdown-menu-item-divider now uses var(--ant-color-border)
(and an explicit rgba in dark) so the separator is actually visible
in the light theme.
Clients toolbar — narrow-desktop wrap:
- Between 769px and 920px, the bulk-action bar (Attach / Detach /
Add to group / Ungroup / more + Delete) wrapped to two rows with
Delete stranded alone on the right. In that range, switch the
toolbar buttons to icon-only, tighten gap to 6px and inline padding
to 8px so everything stays on one line.
This bundles a set of group-related improvements that built up across
one session and only make sense together.
Terminology / API surface:
- Rename "assign group" → "add to group" everywhere: i18n keys,
callback names (bulkAddToGroup), component + file names
(BulkAddToGroupModal, AddClientsToGroupModal), Go controller/struct
names (bulkAddToGroup, AddToGroup), OpenAPI summaries. Nothing keeps
the word "assign" anymore.
- Move group routes under /panel/api/clients/groups/* (was
/bulkAssignGroup at the clients root).
- Split add and remove into two endpoints: /groups/bulkAdd now rejects
empty group; new /groups/bulkRemove clears the label for the given
emails. The old "submit empty to clear" UX is gone — Ungroup is its
own action.
UI affordances on Clients page:
- Promote Group + Ungroup to visible bar buttons next to Attach +
Detach. Group reuses BulkAddToGroupModal; Ungroup pops a danger
confirm and calls bulkRemoveFromGroup.
- Custom UngroupIcon (TagsOutlined with a diagonal strike) for the
Ungroup button so the pairing reads at a glance.
- Hide the Group column when no clients have a group label yet —
removes a column of em-dashes on fresh installs.
UI on Groups page:
- New per-row Add clients… / Remove clients… actions backed by
GroupAddClientsModal and GroupRemoveClientsModal: rich client picker
(email / comment / current group / enable) with search and
preserveSelectedRowKeys, mirroring the inbounds Attach modal UX.
Controller split:
- Move all /groups/* routes, handlers, and request bodies out of
web/controller/client.go into a dedicated web/controller/group.go
(GroupController with leaner clientService + xrayService
dependencies). URLs are byte-identical because the new controller
registers on the same parent gin.RouterGroup; api_docs_test.go gets
a group.go → /panel/api/clients basePath entry so its route
extraction keeps working.
Invalidation dedup:
- Removing a client from a group on the Groups page used to refetch
/clients/groups and /clients/onlines three times: once from the
mutation's onSuccess, once from a redundant invalidate() in the
page's onSubmit, once from the WebSocket invalidate broadcast that
the backend fires after every mutation. The manual invalidate() is
gone, and a small invalidationTracker module lets websocketBridge
skip WS-driven invalidates that arrive within 1.5s of a local
invalidate — bringing the refetch count down to one. The WS path
still works for changes made by another tab or user.
Persistent client groups
- New ClientGroup model + client_groups table that holds empty
(placeholder) groups so a user can define a label before any client
references it. ListGroups merges these with the distinct group_name
values already stored on clients and reports {name, clientCount}.
- ClientRecord gains group_name column; the model.Client wire shape
gains a matching `group` JSON field that survives the
inbound.settings → SyncInbound round-trip.
- Rename/Delete on a group mutates client_groups (rename row / delete
row) AND propagates to all matching clients in ClientRecord and in
every owning inbound's settings JSON, all in one transaction.
Bulk operations
- AssignGroup(emails, group) updates clients.group_name + patches each
affected inbound's settings JSON in one read-modify-write per inbound.
Empty group clears the label. Auto-creates the client_groups row when
the user assigns to a brand-new name.
- BulkResetTraffic(emails) loops the existing single-reset path so the
caller can zero traffic across a whole selection or a whole group.
- EmailsByGroup(name) returns just the email list (used by the groups
page to fan a single bulk action over every member).
Endpoints (all under /panel/api/clients)
- GET /groups — summaries with counts
- GET /groups/:name/emails — emails in a group
- POST /groups/create — empty placeholder group
- POST /groups/rename — rename (table + clients + JSON)
- POST /groups/delete — drop label everywhere (clients survive)
- POST /bulkAssignGroup — assign N selected clients
- POST /bulkResetTraffic — reset traffic on a list
Clients page UX
- New Group column (Actions → Client → Group → Inbounds → …) with a
click-to-filter chip.
- FilterDrawer gains a multi-select Group filter whose options come
from the new ClientPageResponse.groups field (sourced from ListGroups
so empty/placeholder groups are pickable too).
- Single-client and bulk-add forms gain a Group AutoComplete pre-loaded
with all known group names.
- New toolbar buttons when selection > 0: "Group ({n})" opens
BulkAssignGroupModal, "Sub links ({n})" opens SubLinksModal.
Sub-links export modal (new SubLinksModal.tsx)
- Table of selected clients with their subscription URL (and JSON URL
when subJsonEnable is on), per-row copy, Copy all, and Download as
sub-links-<timestamp>.txt. Warns when subscription is disabled or
none of the selected clients have a subId.
Dedicated Groups page (new pages/groups/GroupsPage.tsx)
- /groups route + sidebar entry (TagsOutlined icon) + page title key.
- Card-based layout matching Clients/Inbounds/Nodes — summary card with
Total/Grouped/Empty stats, main card with Add Group button + table.
- Per-row More dropdown (icon-first column on the left): Sub links,
Adjust (days+traffic), Reset traffic, Rename, Delete clients in
group, Delete group (keep clients). Empty groups disable the
client-targeted actions.
- Reuses SubLinksModal and ClientBulkAdjustModal — emails for the
group are fetched on demand from GET /groups/:name/emails.
Other polish
- /groups + groups-page selectors added to page-shell.css and
page-cards.css so the new page inherits the same background, padding,
card borders, hover shadow, and summary-card padding.
- .card-toolbar gains a small vertical padding so the larger toolbar
buttons (now default size, matching Inbounds) don't crowd the top of
the card-head on Clients and Groups pages.
MHSanaei