Convert shared secret component into wrapper

aleksis/apps/maka/frontend/components/Empty.vue

+<script setup>
+import SharedSecret from "./SharedSecret.vue";
+</script>
+
 <template>
-  <div class="d-flex justify-center align-center flex-column text-center">
-    <h1 class="text-h2">maka</h1>
-  </div>
+  <shared-secret>
+    <div class="d-flex justify-center align-center flex-column text-center">
+      <h1 class="text-h2">maka</h1>
+    </div>
+  </shared-secret>
 </template>
 
 <script>

aleksis/apps/maka/frontend/components/SharedSecret.vue

 <template>
-    <div class="d-flex justify-center align-center flex-column text-center">
+  <div>
+    <slot v-if="sharedSecretStatus" />
+    <div class="d-flex justify-center align-center flex-column text-center" v-else>
       <h1 class="text-h5">{{ $t("maka.shared_secret.enter") }}</h1>
       <v-text-field v-model="sharedSecret" :loading="loading" type="password">
         <template #append>
           <v-btn
             :disabled="loading"
             icon
-            @click="sendSharedSecret"
+            @click="submitSharedSecret"
           >
             <v-icon color="primary">
               mdi-send-outline
@@ -14,9 +16,9 @@
           </v-btn>
         </template>
       </v-text-field>
-      <div>{{ "shared secret correct: " + sharedSecretStatus }}</div>
     </div>
-  </template>
+  </div>
+</template>
   
   <script>
   import { gqlSubmitSharedSecret, gqlSharedSecretStatus } from "./sharedSecret.graphql";
@@ -26,13 +28,12 @@
     data() {
       return {
         sharedSecret: "",
-        submitSharedSecretStatus: false,
         sharedSecretStatus: false,
         loading: false,
       };
     },
     methods: {
-      sendSharedSecret() {
+      submitSharedSecret() {
         this.loading = true;
         this.$apollo.mutate({
           mutation: gqlSubmitSharedSecret,

aleksis/apps/maka/frontend/index.js

@@ -21,16 +21,5 @@ export default {
         permission: "",
       },
     },
-    {
-      path: "check_shared_secret",
-      component: () => import("./components/SharedSecret.vue"),
-      name: "maka.checkSharedSecret",
-      meta: {
-        inMenu: true,
-        titleKey: "maka.shared_secret.title",
-        icon: "",
-        permission: "",
-      },
-    },
   ],
 }