Fix meeting room header flash and share panel reopening.

Initialize REC/Locked state before Alpine paints, and restore the copy-link
share dropdown on desktop instead of trapping users in native share cancel.

Co-authored-by: Cursor <cursoragent@cursor.com>

resources/js/meet-room.js

@@ -1,7 +1,17 @@
 import Alpine from 'alpinejs';
 import { ConnectionState, Room, RoomEvent, Track } from 'livekit-client';
 
+function readMeetBootState() {
+    const el = document.getElementById('meet-config');
+
+    return {
+        isRecording: el?.dataset.recordingActive === '1',
+        isLocked: el?.dataset.locked === '1',
+    };
+}
+
 function meetRoom() {
+    const boot = readMeetBootState();
     // LiveKit Room must stay outside Alpine's reactive proxy — wrapping it breaks
     // structuredClone inside the SDK during connect and media setup.
     let room = null;
@@ -12,8 +22,8 @@ function meetRoom() {
         isMuted: true,
         isVideoOff: true,
         isScreenSharing: false,
-        isRecording: false,
-        isLocked: false,
+        isRecording: boot.isRecording,
+        isLocked: boot.isLocked,
         isHost: false,
         watermark: false,
         liveCaptions: false,
@@ -686,16 +696,21 @@ function meetRoom() {
         },
 
         async openShare() {
-            if (navigator.share && this.joinUrl) {
+            const useNativeShare = navigator.share
+                && this.joinUrl
+                && window.matchMedia('(max-width: 767px)').matches;
+
+            if (useNativeShare) {
                 try {
                     await navigator.share({
                         title: this.roomTitle || 'Ladill Meet',
                         text: 'Join my meeting on Ladill Meet',
                         url: this.joinUrl,
                     });
+
                     return;
                 } catch (e) {
-                    if (e?.name === 'AbortError') return;
+                    // User cancelled or native share failed — fall through to copy-link panel.
                 }
             }
 
@@ -703,6 +718,7 @@ function meetRoom() {
             this.shareCopied = false;
             this.participantsOpen = false;
             this.chatOpen = false;
+            this.featuresOpen = false;
         },
 
         async copyJoinLink() {

resources/views/meet/room/show.blade.php

@@ -79,14 +79,14 @@
                 <p class="text-xs text-slate-400" x-text="connectionStatus"></p>
             </div>
             <div class="flex shrink-0 items-center gap-2 text-xs text-slate-400">
-                <button @click="openShare()" type="button"
+                <button @click.stop="openShare()" data-share-trigger type="button"
                         class="inline-flex items-center gap-1.5 rounded-lg bg-slate-900 px-2.5 py-1.5 text-xs font-medium text-slate-200 transition-colors hover:bg-slate-800"
                         title="Share meeting link">
                     @include('meet.room.partials.meet-icon', ['icon' => 'share', 'class' => 'h-4 w-4'])
                     Share
                 </button>
-                <span x-show="isRecording" class="rounded bg-red-600 px-2 py-0.5 font-medium text-white">REC</span>
-                <span x-show="isLocked" class="rounded bg-amber-600 px-2 py-0.5 font-medium text-white">Locked</span>
+                <span x-show="isRecording" @unless($activeRecording) style="display: none" @endunless class="rounded bg-red-600 px-2 py-0.5 font-medium text-white">REC</span>
+                <span x-show="isLocked" @unless($session->is_locked) style="display: none" @endunless class="rounded bg-amber-600 px-2 py-0.5 font-medium text-white">Locked</span>
                 <button @click="toggleParticipants()" type="button"
                         class="inline-flex items-center gap-2 rounded-lg bg-slate-900 px-2 py-1 text-xs font-medium text-slate-200 transition-colors hover:bg-slate-800"
                         title="View participants">
@@ -105,7 +105,8 @@
             </div>
         </header>
 
-        <div x-show="shareOpen" x-cloak @click.outside="shareOpen = false"
+        <div x-show="shareOpen" x-cloak
+             @click.outside="if (! $event.target.closest('[data-share-trigger]')) shareOpen = false"
              class="absolute right-4 top-14 z-50 w-80 rounded-xl bg-slate-900 p-4 shadow-2xl">
             <div class="flex items-start justify-between gap-2">
                 <div>