Fix: [Client][Watch] 視聴画面でボタンからのザッピングができなくなっていた問題を修正

視聴画面内でのルーティング遷移でも View Transition API が発動してボタンが押せなくなっていたのが原因らしい
ついでにスマホでツイートボタンが正常に無効化されていなかった問題も修正した

client/src/components/Watch/Panel/Twitter.vue

@@ -121,9 +121,9 @@
                     </div>
                 </div>
                 <button v-ripple class="tweet-button"
-                    :disabled="is_logged_in_twitter === false || tweet_letter_remain_count < 0 ||
-                        ((tweet_text.trim() === '' || tweet_letter_remain_count === 140) && tweet_captures.length === 0)"
-                    @click="sendTweet()" @touchstart="sendTweet()">
+                    :disabled="is_tweet_button_disabled"
+                    @click="(is_tweet_button_disabled === false) && sendTweet()"
+                    @touchstart="(is_tweet_button_disabled === false) && sendTweet()">
                     <Icon icon="fa-brands:twitter" height="16px" />
                     <span class="ml-1">ツイート</span>
                 </button>
@@ -290,6 +290,12 @@ export default defineComponent({
     },
     computed: {
         ...mapStores(useChannelsStore, usePlayerStore, useSettingsStore, useUserStore),
+
+        // ツイートボタンが無効かどうか
+        is_tweet_button_disabled(): boolean {
+            return this.is_logged_in_twitter === false || this.tweet_letter_remain_count < 0 ||
+                ((this.tweet_text.trim() === '' || this.tweet_letter_remain_count === 140) && this.tweet_captures.length === 0);
+        },
     },
     watch: {
 

client/src/router/index.ts

@@ -125,7 +125,13 @@ const router = createRouter({
 // ルーティングの変更時に View Transitions API を適用する
 // ref: https://developer.mozilla.org/ja/docs/Web/API/View_Transitions_API
 router.beforeResolve((to, from, next) => {
-    if (document.startViewTransition) {
+    // View Transition API を適用しないルートの prefix
+    // to と from の両方のパスがこの prefix で始まる場合は View Transition API を適用しない
+    const no_transition_routes = [
+        '/tv/watch/',
+        '/videos/watch/',
+    ];
+    if (document.startViewTransition && !no_transition_routes.some((route) => to.path.startsWith(route) && from.path.startsWith(route))) {
         document.startViewTransition(() => {
             next();
         });