Page MenuHomePhorge
Files F32580669

D10745.1767397944.diff
No OneTemporary
Actions

Size
1 KB
Referenced Files
None
Subscribers
None

D10745.1767397944.diff
View Options

diff --git a/web/settings/relationship/add-users-list.css b/web/settings/relationship/add-users-list.css
--- a/web/settings/relationship/add-users-list.css
+++ b/web/settings/relationship/add-users-list.css
@@ -59,3 +59,13 @@
padding-left: 6px;
font-style: italic;
}
+
+.listHeaderContainer {
+ display: flex;
+ justify-content: space-between;
+ margin: 16px 8px 8px;
+}
+
+.selectionText {
+ color: var(--text-background-secondary-default);
+}
diff --git a/web/settings/relationship/add-users-list.react.js b/web/settings/relationship/add-users-list.react.js
--- a/web/settings/relationship/add-users-list.react.js
+++ b/web/settings/relationship/add-users-list.react.js
@@ -121,6 +121,20 @@
[sortedUsersWithENSNames, toggleUser, pendingUsersToAdd],
);
+ const listHeader = React.useMemo(() => {
+ let selectionText = 'Select users';
+ if (pendingUsersToAdd.size > 0) {
+ selectionText = `${pendingUsersToAdd.size} selected`;
+ }
+
+ return (
+ <div className={css.listHeaderContainer}>
+ <div className={css.selectionText}>{selectionText}</div>
+ {/* {TODO: Add clear all button here} */}
+ </div>
+ );
+ }, [pendingUsersToAdd.size]);
+
let errors;
if (errorMessage) {
errors = <div className={css.error}>{errorMessage}</div>;
@@ -128,6 +142,7 @@
return (
<div className={css.container}>
+ {listHeader}
<div className={css.userRowsContainer}>{userRows}</div>
{errors}
</div>

File Metadata

Mime Type
text/plain
Expires
Fri, Jan 2, 11:52 PM (17 h, 17 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
5884260
Default Alt Text
D10745.1767397944.diff (1 KB)

Event Timeline