Use <template #slotName> form instead of v-slot

Signed-off-by: Thomas Citharel <tcit@tcit.fr>

js/src/components/Account/ProfileOnboarding.vue

@@ -21,7 +21,7 @@
     <i18n-t
       keypath="This instance, {instanceName}, hosts your profile, so remember its name."
     >
-      <template v-slot:instanceName>
+      <template #instanceName>
         <b>{{
           t("{instanceName} ({domain})", {
             domain,

js/src/components/ErrorComponent.vue

@@ -35,10 +35,10 @@
             tag="span"
             keypath="{instanceName} is an instance of {mobilizon_link}, a free software built with the community."
           >
-            <template v-slot:instanceName>
+            <template #instanceName>
               <b>{{ config?.name }}</b>
             </template>
-            <template v-slot:mobilizon_link>
+            <template #mobilizon_link>
               <a href="https://joinmobilizon.org">{{ t("Mobilizon") }}</a>
             </template>
           </i18n-t>

js/src/components/Group/InvitationCard.vue

@@ -7,7 +7,7 @@
             tag="p"
             keypath="You have been invited by {invitedBy} to the following group:"
           >
-            <template v-slot:invitedBy>
+            <template #invitedBy>
               <b>{{ member?.invitedBy?.name }}</b>
             </template>
           </i18n-t>

js/src/components/Post/PostListItem.vue

@@ -42,7 +42,7 @@
       <p class="flex gap-1" v-if="isCurrentActorMember">
         <AccountEdit />
         <i18n-t keypath="Published by {name}">
-          <template v-slot:name>
+          <template #name>
             <b class="">{{ displayName(post.author) }}</b>
           </template>
         </i18n-t>

js/src/views/About/AboutInstance.vue

@@ -10,22 +10,22 @@
     >
       <div class="statistics flex-1 min-w-[20rem]">
         <i18n-t tag="p" keypath="Home to {number} users">
-          <template v-slot:number>
+          <template #number>
             <strong>{{ statistics.numberOfUsers }}</strong>
           </template>
         </i18n-t>
         <i18n-t tag="p" keypath="and {number} groups">
-          <template v-slot:number>
+          <template #number>
             <strong>{{ statistics.numberOfLocalGroups }}</strong>
           </template>
         </i18n-t>
         <i18n-t tag="p" keypath="Who published {number} events">
-          <template v-slot:number>
+          <template #number>
             <strong>{{ statistics.numberOfLocalEvents }}</strong>
           </template>
         </i18n-t>
         <i18n-t tag="p" keypath="And {number} comments">
-          <template v-slot:number>
+          <template #number>
             <strong>{{ statistics.numberOfLocalComments }}</strong>
           </template>
         </i18n-t>

js/src/views/About/Glossary.vue

@@ -54,7 +54,7 @@
           tag="dd"
           keypath="SSL and it's successor TLS are encryption technologies to secure data communications when using the service. You can recognize an encrypted connection in your browser's address line when the URL begins with {https} and the lock icon is displayed in your browser's address bar."
         >
-          <template v-slot:https><code>https://</code></template>
+          <template #https><code>https://</code></template>
         </i18n-t>
         <dt>{{ t("Cookies and Local storage") }}</dt>
         <dd>

js/src/views/Admin/GroupProfiles.vue

@@ -51,7 +51,7 @@
               icon="magnify"
             />
           </template>
-          <template v-slot:default="props">
+          <template #default="props">
             <router-link
               class="profile"
               :to="{
@@ -91,7 +91,7 @@
               icon="magnify"
             />
           </template>
-          <template v-slot:default="props">
+          <template #default="props">
             {{ props.row.domain }}
           </template>
         </o-table-column>

js/src/views/Admin/Profiles.vue

@@ -42,7 +42,7 @@
               icon="magnify"
             />
           </template>
-          <template v-slot:default="props">
+          <template #default="props">
             <router-link
               class="profile"
               :to="{
@@ -81,7 +81,7 @@
               icon="magnify"
             />
           </template>
-          <template v-slot:default="props">
+          <template #default="props">
             {{ props.row.domain }}
           </template>
         </o-table-column>

js/src/views/Admin/Users.vue

@@ -45,7 +45,7 @@
           {{ props.row.id }}
         </o-table-column>
         <o-table-column field="email" :label="$t('Email')">
-          <template v-slot:default="props">
+          <template #default="props">
             <router-link
               :to="{
                 name: RouteName.ADMIN_USER_PROFILE,

js/src/views/Event/Event.vue

@@ -399,7 +399,7 @@
         :close-button-aria-label="t('Close')"
       >
         <identity-picker v-model="identity">
-          <template v-slot:footer>
+          <template #footer>
             <footer class="modal-card-foot">
               <button
                 class="button"

js/src/views/Event/MyEvents.vue

@@ -147,12 +147,12 @@
               keypath="Do you wish to {create_event} or {explore_events}?"
               tag="p"
             >
-              <template v-slot:create_event>
+              <template #create_event>
                 <router-link :to="{ name: RouteName.CREATE_EVENT }">{{
                   t("create an event")
                 }}</router-link>
               </template>
-              <template v-slot:explore_events>
+              <template #explore_events>
                 <router-link :to="{ name: RouteName.SEARCH }">{{
                   t("explore the events")
                 }}</router-link>

js/src/views/Group/Group.vue

@@ -516,10 +516,9 @@
             <template #desc>
               <template v-if="isCurrentActorFollowing">
                 <i18n-t
-                  class="has-text-grey-dark"
                   keypath="You will receive notifications about this group's public activity depending on %{notification_settings}."
                 >
-                  <template v-slot:notification_settings>
+                  <template #notification_settings>
                     <router-link :to="{ name: RouteName.NOTIFICATIONS }">{{
                       t("your notification settings")
                     }}</router-link>

js/src/views/HomeView.vue

@@ -46,7 +46,7 @@
             tag="span"
             keypath="On {instance} and other federated instances"
           >
-            <template v-slot:instance>
+            <template #instance>
               <b>{{ config.name }}</b>
             </template>
           </i18n-t>
@@ -252,7 +252,7 @@
             tag="span"
             keypath="On {instance} and other federated instances"
           >
-            <template v-slot:instance>
+            <template #instance>
               <b>{{ config.name }}</b>
             </template>
           </i18n-t>

js/src/views/SearchView.vue

@@ -3,7 +3,7 @@
     <h1 class="">{{ $t("Explore") }}</h1>
     <section v-if="tag">
       <i18n-t keypath="Events tagged with {tag}">
-        <template v-slot:tag>
+        <template #tag>
           <b-tag variant="light">{{ $t("#{tag}", { tag }) }}</b-tag>
         </template>
       </i18n-t>

js/src/views/User/RegisterView.vue

@@ -12,10 +12,10 @@
         tag="p"
         keypath="{instanceName} is an instance of the {mobilizon} software."
       >
-        <template v-slot:instanceName>
+        <template #instanceName>
           <b>{{ config?.name }}</b>
         </template>
-        <template v-slot:mobilizon>
+        <template #mobilizon>
           <a href="https://joinmobilizon.org" target="_blank" class="out">{{
             t("Mobilizon")
           }}</a>
@@ -73,12 +73,12 @@
           <i18n-t
             keypath="Please read the {fullRules} published by {instance}'s administrators."
             tag="p"
-            ><template v-slot:fullRules>
+            ><template #fullRules>
               <router-link class="out" :to="{ name: RouteName.RULES }">{{
                 t("full rules")
               }}</router-link>
             </template>
-            <template v-slot:instance>
+            <template #instance>
               <b>{{ config?.name }}</b>
             </template>
           </i18n-t>
@@ -141,12 +141,12 @@
                 tag="span"
                 keypath="I agree to the {instanceRules} and {termsOfService}"
               >
-                <template v-slot:instanceRules>
+                <template #instanceRules>
                   <router-link class="out" :to="{ name: RouteName.RULES }">{{
                     t("instance rules")
                   }}</router-link>
                 </template>
-                <template v-slot:termsOfService>
+                <template #termsOfService>
                   <router-link class="out" :to="{ name: RouteName.TERMS }">{{
                     t("terms of service")
                   }}</router-link>