✨(frontend) update recording metadata alongside recording state changes

Following the previous commit, refactor the frontend to rely on room metadata to
track which recording is running and update the interface accordingly. This
implementation is not fully functional yet.

The limit-reached dialog triggering mechanism is currently broken and will be
fixed in upcoming commits. I also simplified the interface lifecycle, but some
edge cases are not yet handled—for example, transcription controls should be
disabled when a screen recording is started. This will be improved soon.

Controls were extracted into a reusable component using early returns. This
makes the logic easier to read, but slightly increases the overall complexity of
the recording side panel component.

Relying on literals to manage recording statuses is quite poor, feel free to
enhance this part.

src/frontend/src/locales/en/rooms.json

@@ -323,7 +323,8 @@
     "button": {
       "start": "Start transcribing the meeting",
       "stop": "Stop transcribing the meeting",
-      "saving": "Saving…"
+      "saving": "Saving…",
+      "starting": "Starting…"
     },
     "linkMore": "Learn more",
     "notAdminOrOwner": {
@@ -368,7 +369,8 @@
     "button": {
       "start": "Start recording the meeting",
       "stop": "Stop recording the meeting",
-      "saving": "Saving…"
+      "saving": "Saving…",
+      "starting": "Starting…"
     },
     "notAdminOrOwner": {
       "heading": "Restricted Access",
@@ -507,7 +509,7 @@
       "starting": "Transcription starting",
       "stopping": "Transcription stopping"
     },
-    "screenRecording": {
+    "screen_recording": {
       "started": "Recording in progress",
       "starting": "Starting recording",
       "stopping": "Stopping recording"