itube-specs 0.0.785 → 0.0.787

package/composables/fetch/use-fetch-categories-by-letter.ts

@@ -5,20 +5,29 @@ import type { ICategoryCard } from '../../types';
 export const useFetchCategoriesByLetter = async (
     apiMethod: (...args: any[]) => Promise<Array<ICategoryCard>>
 ) => {
+    const route = useRoute();
     const key = AsyncData.CategoriesByLetter;
     const lang = useLang() as Language;
     const slug = useSlug();
     const stateKey = computed(() => `data-${key}-${slug.value}-${lang}`);
 
-    const { data, status, error } = await useAsyncData<Array<ICategoryCard>>(
-        key,
+    const { data, status, error, refresh } = await useAsyncData<Array<ICategoryCard>>(
+        stateKey.value,
         () => useApiFetcher<Array<ICategoryCard>>(
             stateKey.value,
             apiMethod,
             lang,
             slug.value,
-        )()
+        )(),
     );
 
+    // Рефетч при смене route-параметра в рамках ЭТОГО же роута (напр. категория→категория по
+    // ссылке): setup не перезапускается, поэтому нужен watch. Сверяемся с route.name — иначе при
+    // уходе на другой [slug]-роут (slug общий) watch дёрнул бы этот эндпоинт с чужим слагом.
+    const routeName = route.name;
+    watch(stateKey, () => {
+        if (route.name === routeName) refresh();
+    });
+
     return { data, status, error };
 };

package/composables/fetch/use-fetch-categories-by-name.ts

@@ -5,20 +5,29 @@ import type { ICardInfo } from '../../types';
 export const useFetchCategoriesByName = async (
   apiMethod: (...args: any[]) => Promise<ICardInfo>
 ) => {
+    const route = useRoute();
     const key = AsyncData.CategoriesByName;
     const lang = useLang() as Language;
     const slug = useSlug();
     const stateKey = computed(() => `data-${key}-${slug.value}-${lang}`);
 
-    const { data, status, error } = await useAsyncData<ICardInfo>(
-        key,
+    const { data, status, error, refresh } = await useAsyncData<ICardInfo>(
+        stateKey.value,
         () => useApiFetcher<ICardInfo>(
             stateKey.value,
             apiMethod,
             lang,
             slug.value,
-        )()
+        )(),
     );
 
+    // Рефетч при смене route-параметра в рамках ЭТОГО же роута (напр. категория→категория по
+    // ссылке): setup не перезапускается, поэтому нужен watch. Сверяемся с route.name — иначе при
+    // уходе на другой [slug]-роут (slug общий) watch дёрнул бы этот эндпоинт с чужим слагом.
+    const routeName = route.name;
+    watch(stateKey, () => {
+        if (route.name === routeName) refresh();
+    });
+
     return { data, status, error };
 };

package/composables/fetch/use-fetch-categories-by-phrase.ts

@@ -5,13 +5,14 @@ import type { IChipsItem } from '../../types';
 export const useFetchCategoriesByPhrase = async (
     apiMethod: (...args: any[]) => Promise<Array<IChipsItem>>
 ) => {
+    const route = useRoute();
     const key = AsyncData.CategoriesByPhrase;
     const lang = useLang() as Language;
     const slug = useSlug();
     const stateKey = computed(() => `data-${key}-${slug.value}-${lang}`);
 
-    const { data, status, error } = await useAsyncData<Array<IChipsItem>>(
-        key,
+    const { data, status, error, refresh } = await useAsyncData<Array<IChipsItem>>(
+        stateKey.value,
         () => useApiFetcher<Array<IChipsItem>>(
             stateKey.value,
             apiMethod,
@@ -20,8 +21,16 @@ export const useFetchCategoriesByPhrase = async (
             1,
             1,
             100
-        )()
+        )(),
     );
 
+    // Рефетч при смене route-параметра в рамках ЭТОГО же роута (напр. категория→категория по
+    // ссылке): setup не перезапускается, поэтому нужен watch. Сверяемся с route.name — иначе при
+    // уходе на другой [slug]-роут (slug общий) watch дёрнул бы этот эндпоинт с чужим слагом.
+    const routeName = route.name;
+    watch(stateKey, () => {
+        if (route.name === routeName) refresh();
+    });
+
     return { data, status, error };
 };

package/composables/fetch/use-fetch-categories-related.ts

@@ -5,20 +5,29 @@ import type { IRelatedPhrases } from '../../types';
 export const useFetchCategoriesRelated = async (
   apiMethod: (...args: any[]) => Promise<IRelatedPhrases>
 ) => {
+    const route = useRoute();
   const lang = useLang() as Language;
   const slug = useSlug();
   const key = AsyncData.CategoriesRelated;
   const stateKey = computed(() => `data-${key}-${slug.value}-${lang}`);
 
-  const { data, status, error } = await useAsyncData<IRelatedPhrases>(
-    key,
-    () => useApiFetcher<IRelatedPhrases>(
+  const { data, status, error, refresh } = await useAsyncData<IRelatedPhrases>(
+        stateKey.value,
+        () => useApiFetcher<IRelatedPhrases>(
         stateKey.value,
         apiMethod,
         lang,
         slug.value,
-    )()
-  );
+    )(),
+    );
+
+    // Рефетч при смене route-параметра в рамках ЭТОГО же роута (напр. категория→категория по
+    // ссылке): setup не перезапускается, поэтому нужен watch. Сверяемся с route.name — иначе при
+    // уходе на другой [slug]-роут (slug общий) watch дёрнул бы этот эндпоинт с чужим слагом.
+    const routeName = route.name;
+    watch(stateKey, () => {
+        if (route.name === routeName) refresh();
+    });
 
   return { data, status, error };
 };

package/composables/fetch/use-fetch-channels-by-model.ts

@@ -5,13 +5,14 @@ import type { IChannelCard, PaginatedResponse } from '../../types';
 export const useFetchChannelsByModel = async (
     apiMethod: (...args: any[]) => Promise<PaginatedResponse<IChannelCard>>
 ) => {
+    const route = useRoute();
     const lang = useLang() as Language;
     const slug = useSlug();
     const key = AsyncData.ChannelsByModel;
     const stateKey = computed(() => `data-${key}-${slug.value}-${lang}`);
 
-    const { data, status, error } = await useAsyncData<PaginatedResponse<IChannelCard>>(
-        key,
+    const { data, status, error, refresh } = await useAsyncData<PaginatedResponse<IChannelCard>>(
+        stateKey.value,
         () => useApiFetcher<PaginatedResponse<IChannelCard>>(
             stateKey.value,
             apiMethod,
@@ -23,5 +24,13 @@ export const useFetchChannelsByModel = async (
         )(),
     );
 
+    // Рефетч при смене route-параметра в рамках ЭТОГО же роута (напр. категория→категория по
+    // ссылке): setup не перезапускается, поэтому нужен watch. Сверяемся с route.name — иначе при
+    // уходе на другой [slug]-роут (slug общий) watch дёрнул бы этот эндпоинт с чужим слагом.
+    const routeName = route.name;
+    watch(stateKey, () => {
+        if (route.name === routeName) refresh();
+    });
+
     return { data, status, error };
 };

package/composables/fetch/use-fetch-channels-by-name.ts

@@ -5,20 +5,29 @@ import type { ICardInfo } from '../../types';
 export const useFetchChannelsByName = async (
     apiMethod: (...args: any[]) => Promise<ICardInfo>
 ) => {
+    const route = useRoute();
     const lang = useLang() as Language;
     const slug = useSlug('channel');
     const key = AsyncData.ChannelByName;
     const stateKey = computed(() => `data-${key}-${slug.value}-${lang}`);
 
-    const { data, status, error } = await useAsyncData<ICardInfo>(
-        key,
+    const { data, status, error, refresh } = await useAsyncData<ICardInfo>(
+        stateKey.value,
         () => useApiFetcher<ICardInfo>(
             stateKey.value,
             apiMethod,
             lang,
             slug.value,
-        )()
+        )(),
     );
 
+    // Рефетч при смене route-параметра в рамках ЭТОГО же роута (напр. категория→категория по
+    // ссылке): setup не перезапускается, поэтому нужен watch. Сверяемся с route.name — иначе при
+    // уходе на другой [slug]-роут (slug общий) watch дёрнул бы этот эндпоинт с чужим слагом.
+    const routeName = route.name;
+    watch(stateKey, () => {
+        if (route.name === routeName) refresh();
+    });
+
     return { data, status, error };
 };

package/composables/fetch/use-fetch-channels-by-network-name.ts

@@ -14,8 +14,8 @@ export const useFetchChannelsByNetworkName = async (
     const key = AsyncData.ChannelsByNetworkName;
     const stateKey = computed(() => `data-${key}-${slug.value}-${lang}`);
 
-    const { data, status, error } = await useAsyncData<PaginatedResponse<IChannelCard>>(
-        key,
+    const { data, status, error, refresh } = await useAsyncData<PaginatedResponse<IChannelCard>>(
+        stateKey.value,
         () => useApiFetcher<PaginatedResponse<IChannelCard>>(
             stateKey.value,
             apiMethod,
@@ -26,15 +26,15 @@ export const useFetchChannelsByNetworkName = async (
             },
             slug.value,
         )(),
-        {
-            watch: [
-                () => {
-                    const currentQuery = route.query;
-                    return JSON.stringify(currentQuery);
-                },
-            ],
-        }
     );
 
+    // Рефетч при смене route-параметра в рамках ЭТОГО же роута (напр. категория→категория по
+    // ссылке): setup не перезапускается, поэтому нужен watch. Сверяемся с route.name — иначе при
+    // уходе на другой [slug]-роут (slug общий) watch дёрнул бы этот эндпоинт с чужим слагом.
+    const routeName = route.name;
+    watch(stateKey, () => {
+        if (route.name === routeName) refresh();
+    });
+
     return { data, status, error };
 };

package/composables/fetch/use-fetch-model-by-name.ts

@@ -5,20 +5,29 @@ import type { ICardInfo } from '../../types';
 export const useFetchModelByName = async (
     apiMethod: (...args: any[]) => Promise<ICardInfo>
 ) => {
+    const route = useRoute();
     const lang = useLang() as Language;
     const slug = useSlug();
     const key = AsyncData.ModelsByName;
     const stateKey = computed(() => `data-${key}-${slug.value}-${lang}`);
 
-    const { data, status, error } = await useAsyncData<ICardInfo>(
-        key,
+    const { data, status, error, refresh } = await useAsyncData<ICardInfo>(
+        stateKey.value,
         () => useApiFetcher<ICardInfo>(
             stateKey.value,
             apiMethod,
             lang,
             slug.value,
-        )()
+        )(),
     );
 
+    // Рефетч при смене route-параметра в рамках ЭТОГО же роута (напр. категория→категория по
+    // ссылке): setup не перезапускается, поэтому нужен watch. Сверяемся с route.name — иначе при
+    // уходе на другой [slug]-роут (slug общий) watch дёрнул бы этот эндпоинт с чужим слагом.
+    const routeName = route.name;
+    watch(stateKey, () => {
+        if (route.name === routeName) refresh();
+    });
+
     return { data, status, error };
 };

package/composables/fetch/use-fetch-models-by-phrases.ts

@@ -14,8 +14,8 @@ export const useFetchModelsByPhrases = async (
     const key = AsyncData.ModelsByPhrases;
     const stateKey = computed(() => `data-${key}-${slug.value}-${JSON.stringify(route.query)}-${lang}`);
 
-    const { data, status, error } = await useAsyncData<PaginatedResponse<IModelCard>>(
-        key,
+    const { data, status, error, refresh } = await useAsyncData<PaginatedResponse<IModelCard>>(
+        stateKey.value,
         () => useApiFetcher<PaginatedResponse<IModelCard>>(
             stateKey.value,
             apiMethod,
@@ -26,17 +26,15 @@ export const useFetchModelsByPhrases = async (
             lang,
             slug.value,
         )(),
-        {
-            watch: [
-                () => {
-                    if (route.query) {
-                        const currentQuery = route.query;
-                        return JSON.stringify(currentQuery);
-                    }
-                },
-            ],
-        }
     );
 
+    // Рефетч при смене route-параметра в рамках ЭТОГО же роута (напр. категория→категория по
+    // ссылке): setup не перезапускается, поэтому нужен watch. Сверяемся с route.name — иначе при
+    // уходе на другой [slug]-роут (slug общий) watch дёрнул бы этот эндпоинт с чужим слагом.
+    const routeName = route.name;
+    watch(stateKey, () => {
+        if (route.name === routeName) refresh();
+    });
+
     return { data, status, error };
 };

package/composables/fetch/use-fetch-playlists-by-id.ts

@@ -10,7 +10,7 @@ export const useFetchPlaylistsById = async (apiMethod: (...args: any[]) => Promi
     const lang = useLang() as Language;
 
     const { data, status, error, refresh } = await useAsyncData<IPlaylistData>(
-        key,
+        stateKey.value,
         () => useApiFetcher<IPlaylistData>(
             stateKey.value,
             apiMethod,
@@ -19,5 +19,13 @@ export const useFetchPlaylistsById = async (apiMethod: (...args: any[]) => Promi
         )(),
     );
 
+    // Рефетч при смене route-параметра в рамках ЭТОГО же роута (напр. категория→категория по
+    // ссылке): setup не перезапускается, поэтому нужен watch. Сверяемся с route.name — иначе при
+    // уходе на другой [slug]-роут (slug общий) watch дёрнул бы этот эндпоинт с чужим слагом.
+    const routeName = route.name;
+    watch(stateKey, () => {
+        if (route.name === routeName) refresh();
+    });
+
     return { data, status, error, refresh };
 };

package/composables/fetch/use-fetch-playlists-get-videos-by-id.ts

@@ -14,8 +14,8 @@ export const useFetchPlaylistsGetVideosById = async (
     const stateKey = computed(() => `data-${key}-${id.value}`);
     const lang = useLang() as Language;
 
-    const { data, status, error } = await useAsyncData<PaginatedResponse<IVideoCard>>(
-        key,
+    const { data, status, error, refresh } = await useAsyncData<PaginatedResponse<IVideoCard>>(
+        stateKey.value,
         () => useApiFetcherNoCache<PaginatedResponse<IVideoCard>>(
             stateKey.value,
             apiMethod,
@@ -30,6 +30,14 @@ export const useFetchPlaylistsGetVideosById = async (
         )(),
     );
 
+    // Рефетч при смене route-параметра в рамках ЭТОГО же роута (напр. категория→категория по
+    // ссылке): setup не перезапускается, поэтому нужен watch. Сверяемся с route.name — иначе при
+    // уходе на другой [slug]-роут (slug общий) watch дёрнул бы этот эндпоинт с чужим слагом.
+    const routeName = route.name;
+    watch(stateKey, () => {
+        if (route.name === routeName) refresh();
+    });
+
     return {
         error,
         status,

package/composables/fetch/use-fetch-popular-tags-by-channel-name.ts

@@ -5,20 +5,29 @@ import type { IPopularTags } from '../../types';
 export const useFetchPopularTagsByChannelName = async (
   apiMethod: (...args: any[]) => Promise<IPopularTags[]>
 ) => {
+    const route = useRoute();
   const lang = useLang() as Language;
   const slug = useSlug('channel');
   const key = AsyncData.PopularTagsByChannel;
   const stateKey = computed(() => `data-${key}-${slug.value}-${lang}`);
 
-  const { data, status, error } = await useAsyncData<IPopularTags[]>(
-    key,
-    () => useApiFetcher<IPopularTags[]>(
+  const { data, status, error, refresh } = await useAsyncData<IPopularTags[]>(
+        stateKey.value,
+        () => useApiFetcher<IPopularTags[]>(
         stateKey.value,
         apiMethod,
         lang,
         slug.value,
-    )()
-  );
+    )(),
+    );
+
+    // Рефетч при смене route-параметра в рамках ЭТОГО же роута (напр. категория→категория по
+    // ссылке): setup не перезапускается, поэтому нужен watch. Сверяемся с route.name — иначе при
+    // уходе на другой [slug]-роут (slug общий) watch дёрнул бы этот эндпоинт с чужим слагом.
+    const routeName = route.name;
+    watch(stateKey, () => {
+        if (route.name === routeName) refresh();
+    });
 
   return { data, status, error };
 };

package/composables/fetch/use-fetch-popular-tags-by-model-name.ts

@@ -5,20 +5,29 @@ import type { IPopularTags } from '../../types';
 export const useFetchPopularTagsByModelName = async (
   apiMethod: (...args: any[]) => Promise<IPopularTags[]>
 ) => {
+    const route = useRoute();
   const lang = useLang() as Language;
   const slug = useSlug();
   const key = AsyncData.PopularTagsByModel;
   const stateKey = computed(() => `data-${key}-${slug.value}-${lang}`);
 
-  const { data, status, error } = await useAsyncData<IPopularTags[]>(
-    key,
-    () => useApiFetcher<IPopularTags[]>(
+  const { data, status, error, refresh } = await useAsyncData<IPopularTags[]>(
+        stateKey.value,
+        () => useApiFetcher<IPopularTags[]>(
         stateKey.value,
         apiMethod,
         lang,
         slug.value,
-    )()
-  );
+    )(),
+    );
+
+    // Рефетч при смене route-параметра в рамках ЭТОГО же роута (напр. категория→категория по
+    // ссылке): setup не перезапускается, поэтому нужен watch. Сверяемся с route.name — иначе при
+    // уходе на другой [slug]-роут (slug общий) watch дёрнул бы этот эндпоинт с чужим слагом.
+    const routeName = route.name;
+    watch(stateKey, () => {
+        if (route.name === routeName) refresh();
+    });
 
   return { data, status, error };
 };

package/composables/fetch/use-fetch-related-videos.ts

@@ -14,8 +14,8 @@ export const useFetchRelatedVideos = async (
     const key = AsyncData.RelatedVideos;
     const stateKey = computed(() => `data-${key}-${slug.value}-${JSON.stringify(route.query)}-${lang}`);
 
-    const { data, status, error } = await useAsyncData<PaginatedResponse<IVideoCard>>(
-        key,
+    const { data, status, error, refresh } = await useAsyncData<PaginatedResponse<IVideoCard>>(
+        stateKey.value,
         () => {
             if (!slug.value) return Promise.resolve(null as unknown as PaginatedResponse<IVideoCard>);
 
@@ -30,10 +30,15 @@ export const useFetchRelatedVideos = async (
                 slug.value
             )();
         },
-        {
-            watch: [() => route.query.page],
-        }
     );
 
+    // Рефетч при смене route-параметра в рамках ЭТОГО же роута (напр. категория→категория по
+    // ссылке): setup не перезапускается, поэтому нужен watch. Сверяемся с route.name — иначе при
+    // уходе на другой [slug]-роут (slug общий) watch дёрнул бы этот эндпоинт с чужим слагом.
+    const routeName = route.name;
+    watch(stateKey, () => {
+        if (route.name === routeName) refresh();
+    });
+
     return { data, status, error };
 };

package/composables/fetch/use-fetch-video-referer-phrases.ts

@@ -3,13 +3,14 @@ import { AsyncData } from '../../runtime';
 
 export const useFetchVideoRefererPhrases = async (
     apiMethod: (...args: any[]) => Promise<string[]>) => {
+    const route = useRoute();
     const lang = useLang() as Language;
     const slug = useSlug();
     const key = AsyncData.RefererPhrases;
     const stateKey = computed(() => `data-${key}-${slug.value}-${lang}`);
 
-    const { data, status, error } = await useAsyncData<string[]>(
-        key,
+    const { data, status, error, refresh } = await useAsyncData<string[]>(
+        stateKey.value,
         () => useApiFetcher<string[]>(
             stateKey.value,
             apiMethod,
@@ -38,5 +39,13 @@ export const useFetchVideoRefererPhrases = async (
     //   }
     // }
 
+    // Рефетч при смене route-параметра в рамках ЭТОГО же роута (напр. категория→категория по
+    // ссылке): setup не перезапускается, поэтому нужен watch. Сверяемся с route.name — иначе при
+    // уходе на другой [slug]-роут (slug общий) watch дёрнул бы этот эндпоинт с чужим слагом.
+    const routeName = route.name;
+    watch(stateKey, () => {
+        if (route.name === routeName) refresh();
+    });
+
     return { data, status, error };
 };

package/composables/fetch/use-fetch-videos-by-categories.ts

@@ -16,8 +16,14 @@ export const useFetchVideosByCategories = async (
     const stateKey = computed(() => `data-${key}-${slug.value}-${JSON.stringify(route.query)}-${lang}`);
     const filters = computed(() => useGetVideosFilterRequest(route, selectDurationItems, selectAddedItems));
 
-    const { data, status, error } = await useAsyncData<PaginatedResponse<IVideoCard>>(
-        key,
+    // Ключ уникален на slug+query+lang (не константа AsyncData.VideosByCategory): иначе все
+    // категории делят один кэш-слот useAsyncData и при приходе на /categories/<slug>, когда
+    // слот уже заполнен другой категорией, отдаётся её кэш вместо свежего фетча (ролики «не
+    // подсасываются»). watch — только на query (page/sort/фильтры): следить за slug НЕЛЬЗЯ,
+    // т.к. route.params.slug общий для всех [slug]-роутов и при уходе на /videos/<id> и т.п.
+    // watch дёрнул бы этот эндпоинт с чужим слагом.
+    const { data, status, error, refresh } = await useAsyncData<PaginatedResponse<IVideoCard>>(
+        stateKey.value,
         () => useApiFetcher<PaginatedResponse<IVideoCard>>(
             stateKey.value,
             apiMethod,
@@ -30,15 +36,15 @@ export const useFetchVideosByCategories = async (
             slug.value,
             getSelectedQuery(route, sortItemsDefault) || '-popularity'
         )(),
-        {
-            watch: [() => {
-                if (route.query) {
-                    const currentQuery = route.query;
-                    return JSON.stringify(currentQuery);
-                }
-            }],
-        }
     );
 
+    // Рефетч при смене route-параметра в рамках ЭТОГО же роута (напр. категория→категория по
+    // ссылке): setup не перезапускается, поэтому нужен watch. Сверяемся с route.name — иначе при
+    // уходе на другой [slug]-роут (slug общий) watch дёрнул бы этот эндпоинт с чужим слагом.
+    const routeName = route.name;
+    watch(stateKey, () => {
+        if (route.name === routeName) refresh();
+    });
+
     return { data, status, error };
 };

package/composables/fetch/use-fetch-videos-by-channel.ts

@@ -14,8 +14,8 @@ export const useFetchVideosByChannel = async (apiMethod: (...args: any[]) => Pro
     const key = AsyncData.VideosByChannel;
     const stateKey = computed(() => `data-${key}-${slug.value}-${JSON.stringify(route.query)}-${lang}`);
 
-    const { data, status, error } = await useAsyncData<PaginatedResponse<IVideoCard>>(
-        key,
+    const { data, status, error, refresh } = await useAsyncData<PaginatedResponse<IVideoCard>>(
+        stateKey.value,
         () => useApiFetcher<PaginatedResponse<IVideoCard>>(
             stateKey.value,
             apiMethod,
@@ -28,17 +28,15 @@ export const useFetchVideosByChannel = async (apiMethod: (...args: any[]) => Pro
             lang,
             getSelectedQuery(route, sortItemsDefault) || '-popularity'
         )(),
-        {
-            watch: [
-                () => {
-                    if (route.query) {
-                        const currentQuery = route.query;
-                        return JSON.stringify(currentQuery);
-                    }
-                },
-            ],
-        }
     );
 
+    // Рефетч при смене route-параметра в рамках ЭТОГО же роута (напр. категория→категория по
+    // ссылке): setup не перезапускается, поэтому нужен watch. Сверяемся с route.name — иначе при
+    // уходе на другой [slug]-роут (slug общий) watch дёрнул бы этот эндпоинт с чужим слагом.
+    const routeName = route.name;
+    watch(stateKey, () => {
+        if (route.name === routeName) refresh();
+    });
+
     return { data, status, error };
 };

package/composables/fetch/use-fetch-videos-by-model-and-channel.ts

@@ -19,8 +19,8 @@ export const useFetchVideosByModelAndChannel = async (apiMethod: (...args: any[]
     const key = AsyncData.VideosByModelAndChannel;
     const stateKey = computed(() => `data-${key}-${slug.value}-${channel.value}-${JSON.stringify(route.query)}-${lang}`);
 
-    const { data, status, error } = await useAsyncData<PaginatedResponse<IVideoCard>>(
-        key,
+    const { data, status, error, refresh } = await useAsyncData<PaginatedResponse<IVideoCard>>(
+        stateKey.value,
         () => useApiFetcher<PaginatedResponse<IVideoCard>>(
             stateKey.value,
             apiMethod,
@@ -34,17 +34,15 @@ export const useFetchVideosByModelAndChannel = async (apiMethod: (...args: any[]
             lang,
             getSelectedQuery(route, sortItemsDefault) || '-popularity'
         )(),
-        {
-            watch: [
-                () => {
-                    if (route.query) {
-                        const currentQuery = route.query;
-                        return JSON.stringify(currentQuery);
-                    }
-                },
-            ],
-        }
     );
 
+    // Рефетч при смене route-параметра в рамках ЭТОГО же роута (напр. категория→категория по
+    // ссылке): setup не перезапускается, поэтому нужен watch. Сверяемся с route.name — иначе при
+    // уходе на другой [slug]-роут (slug общий) watch дёрнул бы этот эндпоинт с чужим слагом.
+    const routeName = route.name;
+    watch(stateKey, () => {
+        if (route.name === routeName) refresh();
+    });
+
     return { data, status, error };
 };

package/composables/fetch/use-fetch-videos-by-model-and-tag.ts

@@ -19,8 +19,8 @@ export const useFetchVideosByModelAndTag = async (apiMethod: (...args: any[]) =>
     const key = AsyncData.VideosByModelAndTag;
     const stateKey = computed(() => `data-${key}-${slug.value}-${tag.value}-${JSON.stringify(route.query)}-${lang}`);
 
-    const { data, status, error } = await useAsyncData<PaginatedResponse<IVideoCard>>(
-        key,
+    const { data, status, error, refresh } = await useAsyncData<PaginatedResponse<IVideoCard>>(
+        stateKey.value,
         () => useApiFetcher<PaginatedResponse<IVideoCard>>(
             stateKey.value,
             apiMethod,
@@ -34,17 +34,15 @@ export const useFetchVideosByModelAndTag = async (apiMethod: (...args: any[]) =>
             lang,
             getSelectedQuery(route, sortItemsDefault) || '-popularity'
         )(),
-        {
-            watch: [
-                () => {
-                    if (route.query) {
-                        const currentQuery = route.query;
-                        return JSON.stringify(currentQuery);
-                    }
-                },
-            ],
-        }
     );
 
+    // Рефетч при смене route-параметра в рамках ЭТОГО же роута (напр. категория→категория по
+    // ссылке): setup не перезапускается, поэтому нужен watch. Сверяемся с route.name — иначе при
+    // уходе на другой [slug]-роут (slug общий) watch дёрнул бы этот эндпоинт с чужим слагом.
+    const routeName = route.name;
+    watch(stateKey, () => {
+        if (route.name === routeName) refresh();
+    });
+
     return { data, status, error };
 };

package/composables/fetch/use-fetch-videos-by-model.ts

@@ -14,8 +14,8 @@ export const useFetchVideosByModel = async (apiMethod: (...args: any[]) => Promi
     const key = AsyncData.ModelsVideos;
     const stateKey = computed(() => `data-${key}-${slug.value}-${JSON.stringify(route.query)}-${lang}`);
 
-    const { data, status, error } = await useAsyncData<PaginatedResponse<IVideoCard>>(
-        key,
+    const { data, status, error, refresh } = await useAsyncData<PaginatedResponse<IVideoCard>>(
+        stateKey.value,
         () => useApiFetcher<PaginatedResponse<IVideoCard>>(
             stateKey.value,
             apiMethod,
@@ -28,17 +28,15 @@ export const useFetchVideosByModel = async (apiMethod: (...args: any[]) => Promi
             lang,
             getSelectedQuery(route, sortItemsDefault) || '-popularity'
         )(),
-        {
-            watch: [
-                () => {
-                    if (route.query) {
-                        const currentQuery = route.query;
-                        return JSON.stringify(currentQuery);
-                    }
-                },
-            ],
-        }
     );
 
+    // Рефетч при смене route-параметра в рамках ЭТОГО же роута (напр. категория→категория по
+    // ссылке): setup не перезапускается, поэтому нужен watch. Сверяемся с route.name — иначе при
+    // уходе на другой [slug]-роут (slug общий) watch дёрнул бы этот эндпоинт с чужим слагом.
+    const routeName = route.name;
+    watch(stateKey, () => {
+        if (route.name === routeName) refresh();
+    });
+
     return { data, status, error };
 };

package/composables/fetch/use-fetch-videos-by-tag.ts

@@ -14,8 +14,8 @@ export const useFetchVideosByTag = async (apiMethod: (...args: any[]) => Promise
     const key = AsyncData.VideosByTag;
     const stateKey = computed(() => `data-${key}-${slug.value}-${JSON.stringify(route.query)}-${lang}`);
 
-    const { data, status, error } = await useAsyncData<PaginatedResponse<IVideoCard>>(
-        key,
+    const { data, status, error, refresh } = await useAsyncData<PaginatedResponse<IVideoCard>>(
+        stateKey.value,
         () => useApiFetcher<PaginatedResponse<IVideoCard>>(
             stateKey.value,
             apiMethod,
@@ -28,17 +28,15 @@ export const useFetchVideosByTag = async (apiMethod: (...args: any[]) => Promise
             lang,
             getSelectedQuery(route, sortItemsDefault) || '-popularity'
         )(),
-        {
-            watch: [
-                () => {
-                    if (route.query) {
-                        const currentQuery = route.query;
-                        return JSON.stringify(currentQuery);
-                    }
-                },
-            ],
-        }
     );
 
+    // Рефетч при смене route-параметра в рамках ЭТОГО же роута (напр. категория→категория по
+    // ссылке): setup не перезапускается, поэтому нужен watch. Сверяемся с route.name — иначе при
+    // уходе на другой [slug]-роут (slug общий) watch дёрнул бы этот эндпоинт с чужим слагом.
+    const routeName = route.name;
+    watch(stateKey, () => {
+        if (route.name === routeName) refresh();
+    });
+
     return { data, status, error };
 };

package/composables/fetch/use-fetch-videos-search-by-niche.ts

@@ -12,8 +12,8 @@ export const useFetchVideosSearchByNiche = async (apiMethod: (...args: any[]) =>
     const key = AsyncData.VideosBySearch;
     const stateKey = computed(() => `data-${key}-${slug.value}-${JSON.stringify(route.query)}-${lang}`);
 
-    const { data, status, error } = await useAsyncData<PaginatedResponse<IVideoCard>>(
-        key,
+    const { data, status, error, refresh } = await useAsyncData<PaginatedResponse<IVideoCard>>(
+        stateKey.value,
         () => useApiFetcher<PaginatedResponse<IVideoCard>>(
             stateKey.value,
             apiMethod,
@@ -24,17 +24,15 @@ export const useFetchVideosSearchByNiche = async (apiMethod: (...args: any[]) =>
             lang,
             slug.value,
         )(),
-        {
-            watch: [
-                () => {
-                    if (route.query) {
-                        const currentQuery = route.query;
-                        return JSON.stringify(currentQuery);
-                    }
-                },
-            ],
-        }
     );
 
+    // Рефетч при смене route-параметра в рамках ЭТОГО же роута (напр. категория→категория по
+    // ссылке): setup не перезапускается, поэтому нужен watch. Сверяемся с route.name — иначе при
+    // уходе на другой [slug]-роут (slug общий) watch дёрнул бы этот эндпоинт с чужим слагом.
+    const routeName = route.name;
+    watch(stateKey, () => {
+        if (route.name === routeName) refresh();
+    });
+
     return { data, status, error };
 };

package/composables/fetch/use-fetch-videos.ts

@@ -16,8 +16,11 @@ export const useFetchVideos = async (
     const key = AsyncData.Videos;
     const stateKey = computed(() => `data-${key}-${JSON.stringify(route.query)}-${lang}`);
 
+    // Ключ уникален на query+lang (не константа AsyncData.Videos): иначе главная делит один
+    // кэш-слот между разными query (page/sort/фильтры) и при возврате на неё отдаётся кэш от
+    // другого состояния вместо свежего фетча (мигает «нет данных»/пустой грид).
     const { data, status, error } = await useAsyncData<PaginatedResponse<IVideoCard>>(
-        key,
+        stateKey.value,
         () => useApiFetcher<PaginatedResponse<IVideoCard>>(
             stateKey.value,
             apiMethod,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "itube-specs",
   "type": "module",
-  "version": "0.0.785",
+  "version": "0.0.787",
   "main": "./nuxt.config.ts",
   "types": "./types/index.d.ts",
   "scripts": {