Exporter les membres d'un salon dans un fichier csv

cypress/e2e/export-room-members/export-room-members.spec.ts

@@ -0,0 +1,46 @@
+/// <reference types="cypress" />
+
+import RoomUtils from "../../utils/room-utils";
+import RandomUtils from "../../utils/random-utils";
+import { normalize } from "../../../yarn-linked-dependencies/matrix-js-sdk/src/utils";
+
+describe("Export room members feature", () => {
+    const homeserverUrl = Cypress.env("E2E_TEST_USER_HOMESERVER_URL");
+    const homeserverShort = Cypress.env("E2E_TEST_USER_HOMESERVER_SHORT");
+    const email = Cypress.env("E2E_TEST_USER_EMAIL");
+    const password = Cypress.env("E2E_TEST_USER_PASSWORD");
+    const today = new Date().toISOString().slice(0, 10).replace(/-/g, "");
+    // This will fail if email has special characters.
+    const userId = "@" + email.replace("@", "-") + ":" + homeserverShort;
+
+    beforeEach(() => {
+        cy.loginUser(homeserverUrl, email, password);
+    });
+
+    afterEach(() => {});
+
+    it("should display the tooltip on button hover", () => {
+        const roomName = "test/" + today + "/export_room_members/" + RandomUtils.generateRandom(4);
+        RoomUtils.createPublicRoom(roomName).then((roomId) => {
+            RoomUtils.openPeopleMenu(roomName);
+            cy.get('[data-testid="tc_exportRoomMembersButton"]')
+                .trigger("mouseover")
+                .get(".tc_exportRoomMembersTooltip"); // tooltip should show
+            cy.leaveRoom(roomId);
+        });
+    });
+
+    it("downloads the file when button is clicked", () => {
+        const roomName = "test/" + today + "/export_room_members/" + RandomUtils.generateRandom(4);
+        const normalizedRoomName = normalize(roomName);
+        RoomUtils.createPublicRoom(roomName).then((roomId) => {
+            RoomUtils.openPeopleMenu(roomName);
+            cy.get('[data-testid="tc_exportRoomMembersButton"]')
+                .click()
+                .then(() => {
+                    cy.readFile("cypress/downloads/membres_de_" + normalizedRoomName + ".txt").should("eq", userId);
+                });
+            cy.leaveRoom(roomId);
+        });
+    });
+});

cypress/utils/room-utils.ts

@@ -1,21 +1,32 @@
 import Chainable = Cypress.Chainable;
 import TchapCreateRoom from "../../src/tchap/lib/createTchapRoom";
 import { TchapRoomType } from "../../src/tchap/@types/tchap";
+
 export default class RoomUtils {
     public static createPublicRoom(roomName: string): Chainable<string> {
-        return cy.createRoom(TchapCreateRoom.roomCreateOptions(roomName, TchapRoomType.Forum).createOpts);
+        return cy.createRoom(TchapCreateRoom.roomCreateOptions(roomName, TchapRoomType.Forum, false).createOpts);
     }
     public static createPrivateRoom(roomName: string): Chainable<string> {
-        return cy.createRoom(TchapCreateRoom.roomCreateOptions(roomName, TchapRoomType.Private).createOpts);
+        return cy.createRoom(TchapCreateRoom.roomCreateOptions(roomName, TchapRoomType.Private, false).createOpts);
     }
     public static createPrivateWithExternalRoom(roomName: string): Chainable<string> {
-        return cy.createRoom(TchapCreateRoom.roomCreateOptions(roomName, TchapRoomType.External).createOpts);
+        return cy.createRoom(TchapCreateRoom.roomCreateOptions(roomName, TchapRoomType.External, false).createOpts);
+    }
+    public static openRoom(roomName: string): Chainable<JQuery<HTMLElement>> {
+        return cy.get('[aria-label="' + roomName + '"]').click();
     }
     public static openRoomAccessSettings(roomName: string): Chainable<JQuery<HTMLElement>> {
-        //open room
-        cy.get('[aria-label="' + roomName + '"]').click();
+        cy.get('[aria-label="' + roomName + '"]').click(); //open room
         cy.get(".mx_RoomHeader_chevron").click();
         cy.get('[aria-label="Paramètres"] > .mx_IconizedContextMenu_label').click();
         return cy.get('[data-testid="settings-tab-ROOM_SECURITY_TAB"] > .mx_TabbedView_tabLabel_text').click();
     }
+    public static openRoomInformation(roomName: string): Chainable<JQuery<HTMLElement>> {
+        cy.get('[aria-label="' + roomName + '"]').click(); //open room
+        return cy.get('[aria-label="Information du salon"]').click();
+    }
+    public static openPeopleMenu(roomName: string): Chainable<JQuery<HTMLElement>> {
+        this.openRoomInformation(roomName);
+        return cy.get(".mx_RoomSummaryCard_icon_people").click();
+    }
 }

patches/export-room-members/matrix-react-sdk+3.71.1.patch

@@ -0,0 +1,86 @@
+diff --git a/node_modules/matrix-react-sdk/src/components/views/rooms/MemberList.tsx b/node_modules/matrix-react-sdk/src/components/views/rooms/MemberList.tsx
+index 44dba2e..370224e 100644
+--- a/node_modules/matrix-react-sdk/src/components/views/rooms/MemberList.tsx
++++ b/node_modules/matrix-react-sdk/src/components/views/rooms/MemberList.tsx
+@@ -39,6 +39,7 @@ import TruncatedList from "../elements/TruncatedList";
+ import Spinner from "../elements/Spinner";
+ import SearchBox from "../../structures/SearchBox";
+ import AccessibleButton, { ButtonEvent } from "../elements/AccessibleButton";
++import AccessibleTooltipButton from "../elements/AccessibleTooltipButton"; // TCHAP
+ import EntityTile from "./EntityTile";
+ import MemberTile from "./MemberTile";
+ import BaseAvatar from "../avatars/BaseAvatar";
+@@ -46,6 +47,8 @@ import { shouldShowComponent } from "../../../customisations/helpers/UIComponent
+ import { UIComponent } from "../../../settings/UIFeature";
+ import PosthogTrackers from "../../../PosthogTrackers";
+ import { SDKContext } from "../../../contexts/SDKContext";
++import { FileDownloader } from "../../../utils/FileDownloader"; // TCHAP
++import "../../../../../../res/css/views/rooms/TchapMemberListExport.pcss"; // TCHAP
+
+ const INITIAL_LOAD_NUM_MEMBERS = 30;
+ const INITIAL_LOAD_NUM_INVITED = 5;
+@@ -73,6 +76,7 @@ export default class MemberList extends React.Component<IProps, IState> {
+
+     public static contextType = SDKContext;
+     public context!: React.ContextType<typeof SDKContext>;
++    private downloader = new FileDownloader(); // TCHAP
+
+     public constructor(props: IProps, context: React.ContextType<typeof SDKContext>) {
+         super(props);
+@@ -368,6 +372,23 @@ export default class MemberList extends React.Component<IProps, IState> {
+             );
+         }
+
++        /* TCHAP */
++        let exportMembersButton;
++        if (room?.getMyMembership() === "join" && !room.isSpaceRoom() && this.getChildCountJoined() > 0) {
++            exportMembersButton = (
++                <AccessibleTooltipButton
++                    data-testid="tc_exportRoomMembersButton"
++                    className="tc_MemberList_export mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary_outline"
++                    onClick={this.onExportButtonClick}
++                    tooltip={_t("Download the list of all this room's members, in a text file. Useful for adding them all to another room.")}
++                    tooltipClassName="tc_exportRoomMembersTooltip"
++                >
++                    <span>{_t("Export room members")}</span>
++                </AccessibleTooltipButton>
++            );
++        }
++        /* end TCHAP */
++
+         let invitedHeader;
+         let invitedSection;
+         if (this.getChildCountInvited() > 0) {
+@@ -409,6 +430,7 @@ export default class MemberList extends React.Component<IProps, IState> {
+                     <React.Fragment>
+                         {scopeHeader}
+                         {inviteButton}
++                        {exportMembersButton /* TCHAP */}
+                     </React.Fragment>
+                 }
+                 footer={footer}
+@@ -443,4 +465,24 @@ export default class MemberList extends React.Component<IProps, IState> {
+             roomId: this.props.roomId,
+         });
+     };
++
++    /* TCHAP */
++    private onExportButtonClick = (ev: ButtonEvent): void => {
++        const members = this.state.filteredJoinedMembers.map(roomMember => roomMember.userId);
++        const blob = new Blob([members.join()], { type : 'plain/text' })
++
++        const cli = MatrixClientPeg.get();
++        const room = cli.getRoom(this.props.roomId);
++        const filename = _t('members_of_%(roomName)s.txt', {
++            roomName: room.normalizedName,
++        });
++
++        this.downloader.download({
++            blob: blob,
++            name: filename,
++        });
++
++        return;
++    };
++    /* end TCHAP */
+ }

patches/patches.json

@@ -222,5 +222,12 @@
             "src/components/structures/RoomSearchView.tsx",
             "src/components/structures/RoomStatusBar.tsx"
         ]
+    },
+    "export-room-members": {
+        "github-issue": "https://github.com/tchapgouv/tchap-web-v4/issues/593",
+        "package": "matrix-react-sdk",
+        "files": [
+            "src/components/views/rooms/MemberList.tsx"
+        ]
     }
 }

res/css/views/rooms/TchapMemberListExport.pcss

@@ -0,0 +1,31 @@
+/**
+* Copyright DINUM 2023
+*/
+
+.mx_AccessibleButton.mx_AccessibleButton_hasKind.tc_MemberList_export {
+  /* Copy the style from mx_MemberList_invite button just above. For some reason it doesn't follow the standard style. */
+  display: flex;
+  justify-content: center;
+  margin: 5px 9px 9px;
+  padding: 0px;
+  border-radius: 4px;
+  font-weight: 600;
+}
+
+.tc_MemberList_export span {
+  padding: 8px 0;
+  display: inline-flex;
+
+  &::before {
+    content: "";
+    display: inline-block;
+    background-color: var(--accent);
+    mask-image: url("../../../img/tchap/user-export.svg");
+    mask-position: center;
+    mask-repeat: no-repeat;
+    mask-size: 20px;
+    width: 20px;
+    height: 20px;
+    margin-right: 5px;
+  }
+}

src/tchap/i18n/strings/tchap_translations.json

@@ -935,6 +935,18 @@
     "fr": "Veuillez ne continuer que si vous êtes certain d’avoir perdu tous vos autres appareils et votre Code de Récupération.",
     "en": "Please only proceed if you're sure you've lost all of your other devices and your Recovery Code."
   },
+  "Export room members": {
+    "fr": "Exporter les membres du salon",
+    "en": "Export room members"
+  },
+  "Download the list of all this room's members, in a text file. Useful for adding them all to another room.": {
+    "fr": "Récupérer la liste des membres de ce salon, dans un fichier texte. Utile pour inviter toutes ces personnes à un autre salon.",
+    "en": "Download the list of all this room's members, in a text file. Useful for adding them all to another room."
+  },
+  "members_of_%(roomName)s.txt": {
+    "fr": "membres_de_%(roomName)s.txt",
+    "en": "members_of_%(roomName)s.txt"
+  },
   "Destroy cross-signing keys?": {
     "fr": "Réinitialiser les clés de signature croisée ?",
     "en": "Reset cross-signing keys?"