Add ignore user confirmation dialog (#6116)

Signed-off-by: Robin Townsend <robin@robin.town>

src/components/views/right_panel/UserInfo.tsx

@@ -353,25 +353,42 @@ export const UserOptionsSection: React.FC<{
         });
     };
 
+    const unignore = useCallback(() => {
+        const ignoredUsers = cli.getIgnoredUsers();
+        const index = ignoredUsers.indexOf(member.userId);
+        if (index !== -1) ignoredUsers.splice(index, 1);
+        cli.setIgnoredUsers(ignoredUsers);
+    }, [cli, member]);
+
+    const ignore = useCallback(async () => {
+        const { finished } = Modal.createDialog(QuestionDialog, {
+            title: _t("Ignore %(user)s", { user: member.name }),
+            description: (
+                <div>
+                    {_t(
+                        "All messages and invites from this user will be hidden. " +
+                            "Are you sure you want to ignore them?",
+                    )}
+                </div>
+            ),
+            button: _t("Ignore"),
+        });
+        const [confirmed] = await finished;
+
+        if (confirmed) {
+            const ignoredUsers = cli.getIgnoredUsers();
+            ignoredUsers.push(member.userId);
+            cli.setIgnoredUsers(ignoredUsers);
+        }
+    }, [cli, member]);
+
     // Only allow the user to ignore the user if its not ourselves
     // same goes for jumping to read receipt
     if (!isMe) {
-        const onIgnoreToggle = (): void => {
-            const ignoredUsers = cli.getIgnoredUsers();
-            if (isIgnored) {
-                const index = ignoredUsers.indexOf(member.userId);
-                if (index !== -1) ignoredUsers.splice(index, 1);
-            } else {
-                ignoredUsers.push(member.userId);
-            }
-
-            cli.setIgnoredUsers(ignoredUsers);
-        };
-
         ignoreButton = (
             <AccessibleButton
+                onClick={isIgnored ? unignore : ignore}
                 kind="link"
-                onClick={onIgnoreToggle}
                 className={classNames("mx_UserInfo_field", { mx_UserInfo_destructive: !isIgnored })}
             >
                 {isIgnored ? _t("Unignore") : _t("Ignore")}

src/i18n/strings/en_EN.json

@@ -2235,6 +2235,8 @@
     "%(count)s sessions|one": "%(count)s session",
     "Hide sessions": "Hide sessions",
     "Message": "Message",
+    "Ignore %(user)s": "Ignore %(user)s",
+    "All messages and invites from this user will be hidden. Are you sure you want to ignore them?": "All messages and invites from this user will be hidden. Are you sure you want to ignore them?",
     "Jump to read receipt": "Jump to read receipt",
     "Mention": "Mention",
     "Share Link to User": "Share Link to User",