Joseph B. McQueen
3816880801
Auto-saving every Additional-Groups pick into favorites made the
list a running audit log of "every group I've ever touched" instead
of a curated set of go-to groups. Since most messages target a
different set of groups (one office one week, three campuses the
next), the auto-save polluted favorites for every user immediately.
Now:
- The Additional Groups picker is per-message only. Changing it no
longer fires /user/groups/add.
- A new "Save selection to favorites" button under the Additional
picker deliberately promotes whatever's currently selected there
into the user's favorites. Explicit action, no surprises.
- On save, the just-promoted groups are moved from the Additional
picker into the Favorites picker so this message's recipient set
survives untouched, but the UI is visually consolidated to one
place (avoids the "same group ticked in two pickers" confusion).
- The favorites VirtualSelect gets its options list rebuilt via
setOptions() so the just-added groups are immediately pickable
without a page reload; the existing selection is captured first
because setOptions can reset it.
- Hint text updated to describe the new intent on both pickers.
CSS: added .fieldActions for a right-aligned button row under a
picker (sits between the picker and its hint).
Backend untouched — /user/groups/{add,remove,list} were already
per-id and the semantics still fit.
Co-authored-by: Cursor <cursoragent@cursor.com>
111 lines
5.3 KiB
HTML
111 lines
5.3 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||
<title>CollabCentral</title>
|
||
<link id="appFavicon" rel="icon" type="image/x-icon" href="favicon.ico">
|
||
<link rel="stylesheet" href="css/app.css">
|
||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/easymde/dist/easymde.min.css">
|
||
<link rel="stylesheet" href="js/virtual-select.min.css">
|
||
<script src="js/virtual-select.min.js"></script>
|
||
<script src="https://cdn.jsdelivr.net/npm/easymde/dist/easymde.min.js"></script>
|
||
</head>
|
||
|
||
<body data-page="send" data-title-suffix="Send Message">
|
||
|
||
<header class="appHeader">
|
||
<div class="appHeader__inner">
|
||
<div class="appHeader__brand">
|
||
<div id="appAvatar" class="appHeader__avatar"></div>
|
||
<div id="appLabel" class="appHeader__label">Loading…</div>
|
||
</div>
|
||
<nav class="appHeader__nav">
|
||
<a href="./sendMessage.html" data-nav="send">Send Message</a>
|
||
<a href="./monitorJobs.html" data-nav="monitor">Monitor Jobs</a>
|
||
</nav>
|
||
<div class="appHeader__spacer"></div>
|
||
<div id="appUser" class="appHeader__user"></div>
|
||
</div>
|
||
</header>
|
||
|
||
<div id="unauthorizedPanel" class="panel hidden">
|
||
<h2>You don't have access to this bot</h2>
|
||
<p>Your account isn't on the authorized list for this bot. If you believe this is a mistake, contact the bot's administrator.</p>
|
||
</div>
|
||
|
||
<div id="formPanel" class="container hidden">
|
||
<div class="card">
|
||
<h1 class="pageTitle">Compose a message</h1>
|
||
<p class="pageSubtitle">Pick your recipients, write the message, and send now or schedule it for later.</p>
|
||
|
||
<form id="sendMessage" enctype="multipart/form-data">
|
||
<div class="field">
|
||
<label for="my-text-area">Message</label>
|
||
<textarea id="my-text-area"></textarea>
|
||
</div>
|
||
|
||
<div class="field">
|
||
<label for="uploadImage">Attach image (optional)</label>
|
||
<input type="file" id="uploadImage" accept="image/*" name="uploadImage" onchange="showImagePreview(event);">
|
||
<img id="file-ip-1-preview" alt="">
|
||
</div>
|
||
|
||
<div class="field">
|
||
<div class="fieldLabelRow">
|
||
<label for="favGroups">Favorite groups</label>
|
||
<span id="favGroupsStatus" class="fieldStatus" role="status" aria-live="polite"></span>
|
||
</div>
|
||
<select id="favGroups" multiple name="favGroups" placeholder="Favorite groups"
|
||
data-silent-initial-value-set="false"></select>
|
||
<div id="favGroupsManager" class="chipStrip hidden" aria-label="Manage favorite groups"></div>
|
||
<span class="hint">Pick the favorites you want for this message. Click the × on a chip to remove a favorite you no longer use.</span>
|
||
</div>
|
||
|
||
<div class="field">
|
||
<label for="newGroups">Additional groups</label>
|
||
<select id="newGroups" multiple name="newGroups" placeholder="Search all groups"
|
||
data-silent-initial-value-set="false"></select>
|
||
<div class="fieldActions">
|
||
<button type="button" id="saveFavoritesBtn" class="btn btn-secondary" onclick="saveSelectionToFavorites()">Save selection to favorites</button>
|
||
</div>
|
||
<span class="hint">Pick any additional org groups for this message. They stay one-off unless you save them.</span>
|
||
</div>
|
||
|
||
<div class="field">
|
||
<label for="uploadCSV">Upload CSV of recipients (optional)</label>
|
||
<input type="file" id="uploadCSV" name="uploadCSV" accept="text/csv">
|
||
<span class="hint">CSV of Webex person IDs or emails to add to the recipient list.</span>
|
||
</div>
|
||
|
||
<div class="field">
|
||
<label for="scheduledFor">Schedule for (leave blank to send immediately)</label>
|
||
<input type="datetime-local" id="scheduledFor" name="scheduledFor">
|
||
</div>
|
||
|
||
<div class="formActions">
|
||
<button id="cancel" type="button" class="btn btn-secondary" onclick="cancelMessage()">Cancel</button>
|
||
<button id="submit" type="submit" class="btn btn-primary">Review & send</button>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
|
||
<section class="modal hidden" aria-modal="true" role="dialog">
|
||
<button class="modal__close" onclick="continueEditing()" aria-label="Close">×</button>
|
||
<h3>Ready to send?</h3>
|
||
<p id="modalMessage">This message will be sent.</p>
|
||
<div class="modal__actions">
|
||
<button class="btn btn-danger" onclick="discardMessage()">Discard</button>
|
||
<button class="btn btn-secondary" onclick="continueEditing()">Keep editing</button>
|
||
<button class="btn btn-primary" onclick="submit()">Send</button>
|
||
</div>
|
||
</section>
|
||
<div class="overlay hidden"></div>
|
||
|
||
<script src="js/app.js"></script>
|
||
<script src="sendMessage.js"></script>
|
||
</body>
|
||
|
||
</html>
|