remove disconnect button if the user is host

audon-fe/.eslintrc.cjs

@@ -1,14 +1,14 @@
 /* eslint-env node */
-require('@rushstack/eslint-patch/modern-module-resolution')
+require("@rushstack/eslint-patch/modern-module-resolution");
 
 module.exports = {
   root: true,
-  'extends': [
+  extends: [
-    'plugin:vue/vue3-essential',
+    "plugin:vue/vue3-essential",
-    'eslint:recommended',
+    "eslint:recommended",
-    '@vue/eslint-config-prettier'
+    "@vue/eslint-config-prettier",
   ],
   parserOptions: {
-    ecmaVersion: 'latest'
+    ecmaVersion: "latest",
-  }
+  },
-}
+};

audon-fe/.gitignore

@@ -13,7 +13,7 @@ dist
 dist-ssr
 coverage
 *.local
-/index.html
+index.html
 
 /cypress/videos/
 /cypress/screenshots/

audon-fe/src/App.vue

@@ -3,6 +3,10 @@ import { RouterView, RouterLink } from "vue-router";
 import locales from "./locales";
 
 export default {
+  components: {
+    RouterView,
+    RouterLink,
+  },
   setup() {
     return {
       locales,

audon-fe/src/components/Participant.vue

@@ -8,15 +8,19 @@ export default {
     data: Object,
     muted: Boolean,
   },
-  data () {
+  data() {
     return {
       mdiMicrophone,
-      mdiMicrophoneOff
+      mdiMicrophoneOff,
-    }
+    };
   },
   computed: {
     canSpeak() {
-      return this.type === "host" || this.type === "cohost" || this.type === "speaker";
+      return (
+        this.type === "host" ||
+        this.type === "cohost" ||
+        this.type === "speaker"
+      );
     },
     badgeProps() {
       switch (this.type) {
@@ -33,8 +37,8 @@ export default {
         case "speaker":
           return {
             content: "Speaker",
-            colour: ""
+            colour: "",
-          }
+          };
         default:
           return {
             content: "",
@@ -44,8 +48,8 @@ export default {
     },
   },
   methods: {
-    webfinger
+    webfinger,
-  }
+  },
 };
 </script>
 
@@ -69,8 +73,13 @@ export default {
       <v-img :src="data?.avatar"></v-img>
     </v-avatar>
     <h4 :class="canSpeak ? 'mt-1' : 'mt-2'">
-      <v-icon v-if="canSpeak" :icon="muted ? mdiMicrophoneOff : mdiMicrophone"></v-icon>
+      <v-icon
-      <a :href="data?.url" class="plain" target="_blank">{{ data?.displayName ?? webfinger(data) }}</a>
+        v-if="canSpeak"
+        :icon="muted ? mdiMicrophoneOff : mdiMicrophone"
+      ></v-icon>
+      <a :href="data?.url" class="plain" target="_blank">{{
+        data?.displayName ?? webfinger(data)
+      }}</a>
     </h4>
   </v-col>
 </template>

audon-fe/src/locales/en.yaml

@@ -19,7 +19,7 @@ connecting: "Connecting"
 server: "Your Mastodon instance"
 addressRequired: "Enter your instance address"
 createNewRoom: "Create a New Room"
-editRoom: "Edit the Room"
+editRoom: "Room Edit"
 comingFuture: "Coming with future update!"
 form:
   title: "Title"

audon-fe/src/stores/counter.js

@@ -1,12 +1,12 @@
-import { ref, computed } from 'vue'
+import { ref, computed } from "vue";
-import { defineStore } from 'pinia'
+import { defineStore } from "pinia";
 
-export const useCounterStore = defineStore('counter', () => {
+export const useCounterStore = defineStore("counter", () => {
-  const count = ref(0)
+  const count = ref(0);
-  const doubleCount = computed(() => count.value * 2)
+  const doubleCount = computed(() => count.value * 2);
   function increment() {
-    count.value++
+    count.value++;
   }
 
-  return { count, doubleCount, increment }
+  return { count, doubleCount, increment };
-})
+});

audon-fe/src/stores/mastodon.js

@@ -32,7 +32,7 @@ export const useMastodonStore = defineStore("mastodon", {
       const client = await login({
         url: this.oauth.url,
         accessToken: this.oauth.token,
-        disableVersionCheck: true
+        disableVersionCheck: true,
       });
       this.client = client;
       this.userinfo = await client.accounts.verifyCredentials();

audon-fe/src/stores/view.js

@@ -3,7 +3,7 @@ import { defineStore } from "pinia";
 export const useViewStore = defineStore("view", {
   state() {
     return {
-      mainArea: null
+      mainArea: null,
-    }
+    };
-  }
+  },
-})
+});

audon-fe/src/views/HomeView.vue

@@ -37,12 +37,8 @@ export default {
 <template>
   <main>
     <div class="text-right">
-      <v-btn
+      <v-btn variant="outlined" color="red" @click="onLogout">
-        variant="outlined"
+        {{ $t("logout") }}
-        color="red"
-        @click="onLogout"
-      >
-      {{ $t("logout") }}
       </v-btn>
     </div>
     <div class="text-center my-10">
@@ -57,7 +53,9 @@ export default {
         {{ donStore.userinfo?.displayName }}
       </h2>
       <div>
-        <a :href="donStore.userinfo?.url" class="plain">{{ donStore.myWebfinger }}</a>
+        <a :href="donStore.userinfo?.url" class="plain">{{
+          donStore.myWebfinger
+        }}</a>
       </div>
     </div>
     <v-row class="text-center" justify="center">
@@ -65,7 +63,9 @@ export default {
         <v-text-field v-mode="query"></v-text-field>
       </v-col> -->
       <v-col cols="12">
-        <v-btn block :to="{ name: 'create' }" color="indigo">{{ $t("createNewRoom") }}</v-btn>
+        <v-btn block :to="{ name: 'create' }" color="indigo">{{
+          $t("createNewRoom")
+        }}</v-btn>
       </v-col>
     </v-row>
   </main>

audon-fe/src/views/LoginView.vue

@@ -38,13 +38,13 @@ export default {
       return messages;
     },
     aboutLink() {
-      const base = new URL("https://codeberg.org/nmkj/audon/wiki/");
+      const base = new URL("https://codeberg.org/nmkj/audon/wiki");
       switch (this.$i18n.locale) {
         case "ja":
-          base.pathname.concat("ja");
+          base.pathname = base.pathname.concat("/ja");
           break;
       }
-      base.pathname.concat("Home");
+      base.pathname = base.pathname.concat("/Home");
       return base.toString();
     },
   },
@@ -109,6 +109,6 @@ export default {
     }}</v-btn>
   </v-form>
   <div class="w-100 text-right">
-    <a :href="aboutLink" class="plain" target="_blank">{{ $t("about") }}</a>
+    <a :href="aboutLink" target="_blank">{{ $t("about") }}</a>
   </div>
 </template>

audon-fe/src/views/NotFoundView.vue

@@ -1,5 +1,4 @@
-<script>
+<script></script>
-</script>
 
 <template>
   <v-alert type="error">Page not found</v-alert>

audon-fe/src/views/RoomView.vue

@@ -63,7 +63,6 @@ export default {
       mdiMicrophone,
       mdiMicrophoneOff,
       mdiMicrophoneQuestion,
-      mdiDoorClosed,
       mdiVolumeOff,
       mdiClose,
       mdiCheck,
@@ -163,14 +162,15 @@ export default {
               break;
             case 403:
               alert(this.$t("loginRequired"));
+              break;
             case 410:
               alert(this.$t("errors.alreadyClosed"));
-            default:
+              break;
-              this.$router.push({
-                name: "login",
-                query: { l: `/r/${this.roomID}` },
-              });
           }
+          this.$router.push({
+            name: "login",
+            query: { l: `/r/${this.roomID}` },
+          });
         } finally {
           this.loading = false;
         }
@@ -777,29 +777,13 @@ export default {
           <code>{{ timeElapsed }}</code>
         </v-chip>
         <div v-if="iamHost" class="flex-shrink-0">
-          <v-menu>
+          <v-btn
-            <template v-slot:activator="{ props }">
+            size="small"
-              <v-btn
+            variant="text"
-                size="small"
+            color="white"
-                variant="text"
+            :icon="mdiPencil"
-                color="white"
+            @click="showEditDialog = true"
-                :icon="mdiDotsVertical"
+          ></v-btn>
-                v-bind="props"
-              ></v-btn>
-            </template>
-            <v-list>
-              <v-list-item
-                :title="$t('edit')"
-                :prepend-icon="mdiPencil"
-                @click="showEditDialog = true"
-              ></v-list-item>
-              <v-list-item
-                :title="$t('leaveRoom')"
-                :prepend-icon="mdiLogout"
-                @click="roomClient.disconnect()"
-              ></v-list-item>
-            </v-list>
-          </v-menu>
         </div>
       </v-card-title>
       <div
@@ -866,13 +850,15 @@ export default {
           variant="flat"
           @click="onToggleMute"
         ></v-btn>
-        <v-btn v-if="iamHost"
+        <v-btn
-          :icon="mdiDoorClosed"
+          v-if="iamHost"
+          :icon="mdiLogout"
           color="red"
           @click="onRoomClose"
           variant="flat"
         ></v-btn>
-        <v-btn v-else
+        <v-btn
+          v-else
           :icon="mdiLogout"
           color="red"
           @click="roomClient.disconnect()"
@@ -900,5 +886,4 @@ export default {
   </main>
 </template>
 
-<style scoped>
+<style scoped></style>
-</style>