Stabilise React useId values in DOM snapshots in element-web (#33579)

* Stabilise React useId values in DOM snapshots - app/web

* Stabilise React useId values in DOM snapshots - shared components

* Update additional snapshots

* Added comments and changed replace pattern to 'react-use-id-N'

apps/web/test/unit-tests/components/views/rooms/RoomHeader/__snapshots__/RoomHeader-test.tsx.snap

@@ -56,7 +56,7 @@ exports[`RoomHeader dm does not show the face pile for DMs 1`] = `
         style="--cpd-icon-button-size: 100%;"
       >
         <svg
-          aria-labelledby="_r_14k_"
+          aria-labelledby="react-use-id-1"
           fill="currentColor"
           height="1em"
           viewBox="0 0 24 24"
@@ -83,7 +83,7 @@ exports[`RoomHeader dm does not show the face pile for DMs 1`] = `
         style="--cpd-icon-button-size: 100%;"
       >
         <svg
-          aria-labelledby="_r_14p_"
+          aria-labelledby="react-use-id-2"
           fill="currentColor"
           height="1em"
           viewBox="0 0 24 24"
@@ -98,7 +98,7 @@ exports[`RoomHeader dm does not show the face pile for DMs 1`] = `
     </button>
     <button
       aria-label="Threads"
-      aria-labelledby="_r_14u_"
+      aria-labelledby="react-use-id-3"
       class="_icon-button_1215g_8"
       data-kind="primary"
       role="button"
@@ -125,7 +125,7 @@ exports[`RoomHeader dm does not show the face pile for DMs 1`] = `
     </button>
     <button
       aria-label="Room info"
-      aria-labelledby="_r_153_"
+      aria-labelledby="react-use-id-4"
       class="_icon-button_1215g_8"
       data-kind="primary"
       role="button"

apps/web/test/unit-tests/components/views/rooms/RoomHeader/__snapshots__/VideoRoomChatButton-test.tsx.snap

@@ -3,7 +3,7 @@
 exports[`<VideoRoomChatButton /> renders button with an unread marker when room is unread 1`] = `
 <button
   aria-label="Chat"
-  aria-labelledby="_r_6_"
+  aria-labelledby="react-use-id-1"
   class="_icon-button_1215g_8"
   data-indicator="default"
   data-kind="primary"