Create useRoomName hook (#11346)

* Create useRoomName hook

Mark RoomName component as deprecated

* Pass out-of-band data to relevant RoomHeader component

* Mark LegacyRoomHeader as deprecated

* Fix incorrect search&replace in _RoomHeader.pcss

* lintfix

* Fix i18n

* Discard use of useCallback

* Change export of useRoomName

* fix ts issue

* lints

test/components/views/rooms/__snapshots__/RoomHeader-test.tsx.snap

@@ -3,11 +3,21 @@
 exports[`Roomeader renders with no props 1`] = `
 <DocumentFragment>
   <header
-    class="mx_LegacyRoomHeader light-panel"
+    class="mx_RoomHeader light-panel"
   >
     <div
-      class="mx_LegacyRoomHeader_wrapper"
-    />
+      class="mx_RoomHeader_wrapper"
+    >
+      <div
+        aria-level="1"
+        class="mx_RoomHeader_name"
+        dir="auto"
+        role="heading"
+        title="Join Room"
+      >
+        Join Room
+      </div>
+    </div>
   </header>
 </DocumentFragment>
 `;