fix client only directives

Author: MrSunshyne

packages/frontendmu-astro/src/components/MeetupSingle.astro

@@ -126,7 +126,7 @@ let currentAlbum = fetchAlbumDetails(props.getCurrentEvent.album);
 
       <RsvpToMeetup
         transition:persist
-        client:only
+        client:only="vue"
         meetupId={props.routeId}
         meetupDetails={props.getCurrentEvent}
       />
@@ -303,7 +303,7 @@ let currentAlbum = fetchAlbumDetails(props.getCurrentEvent.album);
 
       <div class="contain">
         <RsvpAttendeeList
-          client:only
+          client:only="vue"
           seatCapacity={props.getCurrentEvent.seats_available}
           meetupId={props.routeId}
         />

packages/frontendmu-astro/src/components/NewHeader.astro

@@ -7,8 +7,8 @@ import MainMenu from "./MegaMenu.astro";
 
 <MainMenu transition:persist>
   <RandomColor slot="dock-right" />
-  <ToggleTheme slot="dock-right" client:only />
-  <LoggedUser slot="dock-right" client:only />
+  <ToggleTheme slot="dock-right" client:only="vue" />
+  <LoggedUser slot="dock-right" client:only="vue" />
 </MainMenu>
 <div id="sticky-observer" class="bg-transparent z-0 h-4 w-full top-32 relative">
 </div>

packages/frontendmu-astro/src/components/auth/RsvpToMeetup.vue

@@ -222,7 +222,8 @@ const currentEventRsvpDetail = arrayOfEventRsvpDetail && arrayOfEventRsvpDetail[
                 <Suspense>
                     <template v-if="isAttendingCurrentEvent && isAttendee">
                         <div class="grid place-items-center">
-                            <AttendeeQRCode client:only v-if="!isVerified" :meetup-id="meetupId" :user-id="user!.id" />
+                            <AttendeeQRCode client:only="vue" v-if="!isVerified" :meetup-id="meetupId"
+                                :user-id="user!.id" />
                             <div class="text-lg py-4 uppercase font-medium text-white px-4">
                                 Scan to verify {{ user?.full_name }}
                             </div>

packages/frontendmu-astro/src/data/meetups-raw.json

@@ -22,6 +22,6 @@ const props = Astro.props;
 
       <slot />
     </Backdrop>
-    <ToastMessage client:only />
+    <ToastMessage client:only="vue" />
   </body>
 </html>

packages/frontendmu-astro/src/data/speakers-raw.json

@@ -41,6 +41,6 @@ const {
 
       <Footer />
     </Backdrop>
-    <ToastMessage client:only />
+    <ToastMessage client:only="vue" />
   </body>
 </html>

packages/frontendmu-astro/src/layouts/LayoutCustom.astro

@@ -27,6 +27,6 @@ const props = Astro.props;
 
       <Footer />
     </Backdrop>
-    <ToastMessage client:only />
+    <ToastMessage client:only="vue" />
   </body>
 </html>

packages/frontendmu-astro/src/layouts/LayoutHome.astro

@@ -7,5 +7,5 @@ const props = Astro.params;
 ---
 
 <LayoutHome pageType="home">
-    <AdminVerifyAttendee client:only />
+    <AdminVerifyAttendee client:only="vue" />
 </LayoutHome>

packages/frontendmu-astro/src/layouts/LayoutSingleMeetup.astro

@@ -14,8 +14,8 @@ import Bran from "../components/auth/Bran.vue";
 
 <LayoutHome pageType="home">
   <HomeHero />
-  <!-- <Hodor client:only />
-  <Bran client:only /> -->
+  <!-- <Hodor client:only="vue" />
+  <Bran client:only="vue" /> -->
 
   <HomeFeaturedSpeakers />
 

packages/frontendmu-astro/src/pages/admin/verify.astro

@@ -9,7 +9,7 @@ import LayoutHome from "../layouts/LayoutCustom.astro";
     <div
       class="flex min-h-full flex-1 flex-col justify-center py-12 sm:px-6 lg:px-8"
     >
-      <LoginForm client:only />
+      <LoginForm client:only="vue" />
     </div>
   </div>
 </LayoutHome>

packages/frontendmu-astro/src/pages/index.astro

@@ -6,7 +6,7 @@ import RefreshToken from "@components/auth/RefreshToken.vue";
 <Layout>
   <div class="mx-auto w-full grid items-center text-center">
     <div class="flex flex-col justify-around">
-      <RefreshToken client:only />
+      <RefreshToken client:only="vue" />
     </div>
   </div>
 </Layout>

packages/frontendmu-astro/src/pages/login.astro

@@ -4,5 +4,5 @@ import MyProfile from "../../components/auth/MyProfile.vue";
 ---
 
 <LayoutSpeaker title={"Your Profile"}>
-  <MyProfile client:only />
+  <MyProfile client:only="vue" />
 </LayoutSpeaker>