itube-specs 0.0.944 → 0.0.946

package/README.md

@@ -64,6 +64,9 @@ npm run lint:css:fix # Stylelint --fix
 npm run check:themes # сверяет наборы имён токенов во всех темах
 npm run check:styles # компилирует стили каждого SFC каждой темой (~1.5s)
 npm run check:breakpoints # сверяет JS-зеркало брейкпоинтов с $brkpnts в SCSS
+npm run i18n:check   # отчёт по общим переводам (не гейт)
+npm run i18n:sheet:export # общие локали → i18n/i18n.csv для переводчика
+npm run i18n:sheet:import # i18n/i18n.csv → общие локали
 npm run test         # vitest однократно
 npm run patch        # npm version patch — бамп версии перед публикацией
 ```
@@ -90,6 +93,7 @@ runtime/       # runtime-значения и хелперы (barrel index.ts)
   utils/       # чистые хелперы, cleaners/, converters/
 types/         # .d.ts типы (barrel index.d.ts — с расширением .d.ts в реэкспортах)
 lib/           # продуктовые статические данные (barrel index.ts): scheme/*, *-items, *-scheme
+i18n/locales/  # общие переводы, по файлу на локаль (см. «Переводы»)
 config/        # build-time конфиг для приложения (barrel index.ts): themes, css-breakpoints
 middleware/    # глобальные: auth.global, normalize.global, age.global
 plugins/       # SSR/клиент: country/countries/mobile (SSR), services.client, sentry.client, adv
@@ -156,6 +160,78 @@ assets/scss/themes/dark/_theme.scss
 
 ---
 
+## Переводы
+
+Ключи разделены на два набора, как темы: общая часть здесь, пер-сайтовая в приложении.
+
+| | |
+|---|---|
+| Слой, `i18n/locales/*.json` | обвязка интерфейса, одинаковая на всех сайтах: навигация, сортировки и фильтры, кнопки-глаголы, пагинация, плеер, авторизация, снекбары, формы репорта и контактов, ошибки, плюрали, длительности, единицы, атрибуты модели |
+| Приложение, `i18n/locales/*.json` | только пер-сайтовое: SEO (`meta.*`, `h1_*`, `*_footer_text`, карты `*_footer_links`), нишевая лексика и брендовые формулировки, плюс точечные оверрайды общих ключей |
+
+Граница проходит по **значению, а не по имени ключа**: `all_categories` («Alphabetical A-Z») — общий,
+`main_categories` («All Gay Porn Categories (A-Z)») — сайтовый, хотя имена похожи.
+
+### Как склеивается
+
+`@nuxtjs/i18n` мержит локали слоёв сам, вручную ничего подключать не надо. Файл слоя попадает в `files`
+локали раньше проектного, значит грузится первым, а проектный ложится поверх. Мерж глубокий, поэтому
+приложение может перекрыть **один ключ внутри общей группы**, не переобъявляя всю группу.
+
+Направление одно: приложение всегда сильнее. Слой не может «дожать» значение — если сайт держит свой ключ,
+победит он.
+
+Коды локалей выводятся из имён файлов здесь (`zh-CN.json` → `zh`), поэтому набор файлов слоя —
+канонический. Код, которого нет в `LOCALES` приложения, всё равно доедет до него лишней локалью, так что
+наборы должны совпадать.
+
+### Куда добавлять новый ключ
+
+- Строка видна на всех сайтах → сюда, в **начало** `i18n/locales/en-US.json` («выше — новее»), дальше
+  обычный цикл: коммит → `npm run patch` → пуш → мерж и публикация → в приложении `npm run spec`.
+- Строка про нишу, бренд или SEO → в приложение, слой не трогаем.
+
+⚠️ **Не копировать общий ключ в приложение «чтобы был».** Дубль с тем же значением ничего не меняет, но
+замораживает перевод: правки в слое до этого сайта уже никогда не доедут. `i18n:check` в приложении зовёт
+такое мёртвым оверрайдом и показывает списком.
+
+### CSV-мост (работа с переводчиком)
+
+Переводы никогда не правятся руками по локалям — только через CSV. Скрипты живут здесь
+(`scripts/i18n-sheet.mjs`, `scripts/i18n-check.mjs`), берут пути от cwd и публикуются в пакете, поэтому
+один и тот же код обслуживает оба набора: здесь `npm run i18n:*` работает с общими ключами, в приложении
+те же команды зовут копию из `node_modules/itube-specs/scripts/` и работают с его собственными. У каждого
+набора свой `i18n/i18n.csv` (в git не хранится, пересобирается экспортом).
+
+1. `npm run i18n:sheet:export` — собирает CSV: колонка `key`, дальше по колонке на локаль, `en` первой.
+   Новые ключи (заполнен только `en`) поднимаются наверх файла — переводчику сразу видно TODO.
+2. Переводчик правит в Excel / Numbers / Google Sheets и сохраняет обратно **в CSV** (`.numbers`/`.xlsx`
+   не читаются). Разделитель определяется сам — `,`, `;` или таб, редакторы пишут по-разному.
+3. `npm run i18n:sheet:import` — раскладывает значения назад. Каждый файл пересобирается в своём порядке
+   ключей (минимальный diff), непереведённый ключ остаётся **отсутствующим**, а не подменяется английским,
+   чтобы отчёт продолжал его показывать.
+4. `npm run i18n:check` — отчёт, не гейт: рассинхрон с эталоном `en-US`, мёртвые оверрайды, а в приложении
+   ещё и SEO keyword-ссылки.
+
+Удаление ключей едет от `en-US`: импорт выкидывает лист, которого больше нет в эталоне, так что устаревший
+CSV не воскресит удалённый ключ.
+
+Важное следствие двух наборов: непереведённый **общий** ключ чинится в CSV слоя — в CSV приложения он не
+появится вовсе. Отчёт приложения такие ключи показывает отдельным блоком «не переведено в слое» и не
+считает их своим рассинхроном.
+
+### Что мимо CSV
+
+`*_footer_links` в приложении — это карты «keyword → URL категории», а не строки: сам ключ локализован
+(en: `twinks`, ru: `твинки`), наборы по локалям разные by design. Они исключены из CSV и из сверки ключей,
+курирует их разработчик/SEO прямо в JSON. Проверяется другое: каждый keyword должен встречаться в парном
+`*_footer_text`, иначе ссылка не отрендерится — это и гоняет `i18n:check` в приложении.
+
+Правила плюрализации (`i18n/plurals.ts`) и `numberFormats` остаются в приложении, хотя сами строки
+`plural.*` общие: правила задаются на уровне локали, а не ключа.
+
+---
+
 ## Импорты
 
 Внутри слоя — **относительные пути** (`../../runtime`, `../types`, `../../services/api/...`), никогда не

package/assets/scss/base/_global.scss

@@ -34,6 +34,21 @@ body {
   -moz-osx-font-smoothing: grayscale;
 }
 
+// В корейском слова разделены пробелами, но браузер по умолчанию всё равно рвёт строку
+// посреди слова — keep-all запрещает разрыв между слогами, break-word остаётся страховкой
+// от переполнения на длинных ссылках. Китайский и японский трогать не надо: там перенос
+// между любыми двумя знаками — норма языка (clreq, JLReq), а не дефект.
+html[lang^='ko'] body {
+  word-break: keep-all;
+  overflow-wrap: break-word;
+}
+
+// Японский умеет лучше: Chromium разбивает строку по границам фраз собственным словарём.
+// Где значение не поддержано, оно игнорируется и остаётся штатный японский перенос.
+html[lang^='ja'] body {
+  word-break: auto-phrase;
+}
+
 main {
   background-color: $main-bg;
 }

package/components/card/channel-mini.vue

@@ -24,7 +24,7 @@
             name="video-camera"
             size="14"
           />
-          {{ card.videosCount }}
+          {{ $n(card.videosCount, 'compact') }}
         </span>
         <span
           v-if="featureFlags.FeatureFollowEnabled"

package/components/card/model-mini.vue

@@ -31,7 +31,7 @@
             name="video-camera"
             size="14"
           />
-          {{ card.videosCount }}
+          {{ $n(card.videosCount, 'compact') }}
         </span>
         <span
           v-if="card.age"

package/components/card/playlist-mini.vue

@@ -28,7 +28,7 @@
           name="video-camera"
           size="16"
         />
-        {{ card.videosCount }}
+        {{ $n(card.videosCount, 'compact') }}
       </span>
     </div>
   </div>

package/components/card/round.vue

@@ -34,7 +34,7 @@
         name="cam"
         size="12"
       />
-      <span class="card-round__count-text">{{ card.videosCount }}</span>
+      <span class="card-round__count-text">{{ $n(card.videosCount, 'compact') }}</span>
     </p>
   </NuxtLink>
 </template>

package/components/card/video/actions.vue

@@ -4,6 +4,7 @@
     <button
       v-if="showFavorites && favorite"
       :aria-label="t('video_actions.remove_aria', { title: card.title, name: t('favorites') })"
+      :title="t('video_actions.remove_favorites')"
       class="card-video-actions__btn --active"
       type="button"
       aria-pressed="true"
@@ -19,6 +20,7 @@
       :aria-label="later
         ? t('video_actions.remove_aria', { title: card.title, name: t('video_submenu.watch_later') })
         : t('video_actions.add_aria', { title: card.title, name: t('video_submenu.watch_later') })"
+      :title="later ? t('video_actions.remove_watch_later') : t('video_actions.add_watch_later')"
       :aria-pressed="later"
       :class="['card-video-actions__btn', '--watch-later', { '--active': later }]"
       type="button"

package/components/filter/btn.vue

@@ -3,7 +3,7 @@
   <UiBtn
     :size="size"
     :theme="theme"
-    :title="t('filter')"
+    :title="label"
     class="filter-btn"
     aria-label="Filter"
     @click="emit('update:modelValue', true)"
@@ -12,11 +12,10 @@
       name="adjustments-horizontal"
       size="16"
     />
-    <span class="_from-sm">{{ t('filter') }}
-    </span>
+    <span class="_from-sm">{{ label }}</span>
     <span
       v-if="count > 0"
-      class="filter-btn__count"
+      class="filter-btn__count _to-sm"
     >{{ mobileCount }}</span>
   </UiBtn>
 </template>
@@ -38,6 +37,8 @@ const emit = defineEmits<{
 const { t } = useI18n();
 
 const mobileCount = computed(() => props.count > 9 ? '9+' : props.count);
+
+const label = computed(() => props.count > 0 ? t('plural.filter', props.count) : t('filter'));
 </script>
 
 <style lang="scss">

package/components/filter/popup.vue

@@ -83,7 +83,7 @@
             class="filter-popup__summary-arrow"
           />
           <span class="filter-popup__summary-title">{{ group.title }}</span>
-          <span class="filter-popup__summary-count">{{ t('filter_popup.fields', { count: group.count ?? group.fields.length }) }}</span>
+          <span class="filter-popup__summary-count">{{ t('plural.filter', group.count ?? group.fields.length) }}</span>
           <span
             v-if="group.description"
             class="filter-popup__summary-description"

package/components/info/main.vue

@@ -29,7 +29,7 @@
           <UiCount
             class="info-main__count"
             icon="video-camera"
-          >{{ videosCount || card.videosCount }}</UiCount>
+          >{{ $n(videosCount || card.videosCount, 'compact') }}</UiCount>
           <UiBtn
             theme="muted"
             size="s"

package/components/library/feed.vue

@@ -159,7 +159,7 @@ const emit = defineEmits<{
   (eventName: 'toggle-follow', item: ILibraryFeedItem): void,
 }>();
 
-const { t } = useI18n();
+const { t, n } = useI18n();
 
 const avatarError = ref(false);
 
@@ -173,7 +173,7 @@ const initials = computed(() => props.item.title
   .join('')
   .toUpperCase());
 
-const videosText = computed(() => t('plural.videos', props.item.videosCount));
+const videosText = computed(() => t('plural.videos', { n: n(props.item.videosCount, 'compact') }, props.item.videosCount));
 
 const parametersText = computed(() => (props.item.parameters ?? []).filter(Boolean).join(' · '));
 

package/components/player/follow.vue

@@ -14,7 +14,7 @@
     />
     <div class="player-follow__wrapper">
       <p class="player-follow__title">{{ card.name }}</p>
-      <p class="player-follow__count">{{ $t('plural.videos', Number(card.videosCount)) }}</p>
+      <p class="player-follow__count">{{ $t('plural.videos', { n: $n(card.videosCount, 'compact') }, card.videosCount) }}</p>
     </div>
     <UiBtn
       v-if="featureFlags.FeatureFollowEnabled"

package/components/playlist/add.vue

@@ -52,7 +52,7 @@
                     name="video-camera"
                     size="14"
                   />
-                  {{ item.videosCount }}
+                  {{ $n(item.videosCount, 'compact') }}
                 </span>
               </div>
               <button

package/components/playlist/edit.vue

@@ -16,7 +16,7 @@
       <strong>{{ selectedPlaylist?.name }}</strong>
     </i18n-t>
     <p class="playlist-edit__confirm-note">
-      {{ $t('playlist.confirm_delete_note', { videos: $t('plural.videos', selectedPlaylist?.videosCount ?? 0) }) }}
+      {{ $t('playlist.confirm_delete_note', { videos: $t('plural.videos', { n: $n(selectedPlaylist?.videosCount ?? 0, 'compact') }, selectedPlaylist?.videosCount ?? 0) }) }}
     </p>
   </UiConfirm>
 

package/components/search/item.vue

@@ -24,7 +24,7 @@
     <span
       v-if="item.videosCount"
       class="search-item__count"
-    >{{ item.videosCount }}</span>
+    >{{ $n(item.videosCount, 'compact') }}</span>
   </NuxtLink>
 </template>
 

package/components/ui/section-title.vue

@@ -25,7 +25,7 @@
       v-if="count || icon"
       :icon="icon"
       class="ui-section-title__count"
-    >{{ count }}</UiCount>
+    >{{ formattedCount }}</UiCount>
     <!-- Доп. бейдж рядом с заголовком (например «editorial») -->
     <slot/>
   </div>
@@ -45,6 +45,12 @@ const props = withDefaults(defineProps<{
   variant: 'page'
 });
 
+const { n } = useI18n();
+
+const formattedCount = computed(() => (
+  typeof props.count === 'number' ? n(props.count, 'compact') : props.count
+));
+
 const titleClass = computed(() => [
   'ui-section-title__title',
   props.variant === 'section' ? '--section' : '_title'

package/components/view/model-videos.vue

@@ -13,7 +13,7 @@
 
     <UiSectionTitle
       v-else-if="isFilteredPage"
-      :count="data?.total ? $n(data.total, 'compact') : 0"
+      :count="data?.total"
       :title="title"
       class="view-model-videos__title _title"
       icon="video-camera"
@@ -66,7 +66,7 @@
       class="view-model-videos__other"
     >
       <UiSectionTitle
-        :count="props.dataOther ? $n(props.dataOther?.total, 'compact') : 0"
+        :count="props.dataOther?.total"
         :title="otherItemsTitle"
         class="view-model-videos__other-title"
         title-tag="h2"

package/components/view/videos.vue

@@ -4,7 +4,7 @@
     <header class="view-videos__header">
       <UiSectionTitle
         v-if="title"
-        :count="data?.total && $n(data?.total, 'compact')"
+        :count="data?.total"
         :title="title"
         :img="flagImg"
         class="view-videos__title"

package/components/view/webcams.vue

@@ -208,7 +208,7 @@ const sections = computed<ISwitcherItem[]>(() => [
     name: 'webcams',
     title: t('webcams.sections.webcams'),
     icon: 'webcam',
-    subtitle: props.data?.total ? t('webcams.online_short', { count: n(props.data.total) }) : '',
+    subtitle: props.data?.total ? t('webcams.online_short', { count: n(props.data.total, 'compact') }) : '',
   },
 ]);
 

package/components/webcam/counters.vue

@@ -16,7 +16,7 @@
       class="webcam-counters__item"
     >
       <span class="webcam-counters__pulse"/>
-      {{ t('webcams.online_now', { count: $n(total) }) }}
+      {{ t('webcams.online_now', { count: $n(total, 'compact') }) }}
     </span>
 
     <span

package/composables/use-route-query-categories.ts

@@ -0,0 +1,25 @@
+import { CategoriesApiService } from '../services/api/categories.service';
+import { convertQueryCategories, convertString } from '../runtime';
+
+/**
+ * Перечисление выбранных категорий для заголовка страницы — на языке текущей локали.
+ *
+ * В query лежит английский слаг категории, переводы есть только в группах с бека, поэтому
+ * при активном фильтре список групп догружается в SSR (тот же ленивый стейт, что у чипсов
+ * фильтра, `load()` идемпотентен — лишнего запроса не будет). Пустая строка, если фильтр не стоит.
+ */
+export const useRouteQueryCategories = async () => {
+  const route = useRoute();
+  const { data: groups, load } = useFetchGroupsCategoriesLazy(CategoriesApiService.getGroupsCategories);
+
+  watch(() => route.query[ 'categories' ], value => {
+    if (value) load();
+  });
+
+  if (route.query[ 'categories' ]) await load();
+
+  return computed(() => {
+    if (!route.query[ 'categories' ]) return '';
+    return convertString().toCapitalize(convertQueryCategories(route, groups.value));
+  });
+};

package/i18n/locales/de-DE.json

@@ -1,4 +1,5 @@
 {
+  "top_models": "Top-Models",
   "additional_link": {
     "2257": "2257",
     "report": "Fehler melden",
@@ -107,7 +108,7 @@
   "get_full_video": "Vollständiges Video erhalten",
   "filter": "Filter",
   "filters": "Filter",
-  "show_all_models": "Alle Models anzeigen",
+  "show_all_models": "Alle anzeigen",
   "all_categories": "Alphabetisch A-Z",
   "related_searches": "Ähnliche Suchen",
   "related_models": "Ähnliche Models",
@@ -380,11 +381,16 @@
     "item": "{n} Element | {n} Elemente",
     "filter": "{n} Filter | {n} Filter"
   },
+  "video_actions": {
+    "add_favorites": "Zu Favoriten hinzufügen",
+    "remove_favorites": "Aus Favoriten entfernen",
+    "add_watch_later": "Zu „Später ansehen“ hinzufügen",
+    "remove_watch_later": "Aus „Später ansehen“ entfernen"
+  },
   "filter_popup": {
     "active_count": "{count} aktiv",
     "active_title": "Aktive Filter",
-    "quick_title": "Schnellfilter · ganz nach deinem Geschmack",
-    "fields": "{count} Felder",
+    "quick_title": "Schnellfilter",
     "performer": {
       "title": "Darsteller",
       "description": "Wer zu sehen ist"
@@ -485,6 +491,7 @@
     "playlists": "Playlists",
     "network": "Netzwerk",
     "profile": "Profil",
+    "library": "Mediathek",
     "settings": "Einstellungen",
     "my_playlists": "Meine Playlists",
     "back_to_main_page": "Zur Hauptseite zurück",

package/i18n/locales/en-US.json

@@ -1,4 +1,5 @@
 {
+  "top_models": "Top models",
   "playlists_empty": {
     "title": "No playlists yet",
     "tap": "Tap",
@@ -163,7 +164,7 @@
   "get_full_video": "Get full video",
   "filter": "Filter",
   "filters": "Filters",
-  "show_all_models": "Show all models",
+  "show_all_models": "Show all",
   "all_categories": "Alphabetical A-Z",
   "related_searches": "Related searches",
   "related_models": "Related models",
@@ -196,7 +197,7 @@
   "models_by_letter": "Models by letter",
   "trending": "Trending",
   "trending_models": "Trending Models",
-  "popular_searches": "Popular Searches",
+  "popular_searches": "Popular searches",
   "category": "Category",
   "playlists": "Playlists",
   "channels": "Channels",
@@ -489,8 +490,7 @@
   "filter_popup": {
     "active_count": "{count} active",
     "active_title": "Active filters",
-    "quick_title": "Quick filters · top-tier discovery",
-    "fields": "{count} fields",
+    "quick_title": "Quick filters",
     "performer": {
       "title": "Performer",
       "description": "Who's on screen"

package/i18n/locales/es-ES.json

@@ -1,4 +1,5 @@
 {
+  "top_models": "Top modelos",
   "additional_link": {
     "2257": "2257",
     "report": "Reportar error",
@@ -107,7 +108,7 @@
   "get_full_video": "Obtener video completo",
   "filter": "Filtro",
   "filters": "Filtros",
-  "show_all_models": "Mostrar todos los modelos",
+  "show_all_models": "Ver todos",
   "all_categories": "Alfabético A-Z",
   "related_searches": "Búsquedas relacionadas",
   "related_models": "Modelos relacionados",
@@ -380,13 +381,18 @@
     "item": "{n} elemento | {n} elementos",
     "filter": "{n} filtro | {n} filtros"
   },
+  "video_actions": {
+    "add_favorites": "Añadir a favoritos",
+    "remove_favorites": "Quitar de favoritos",
+    "add_watch_later": "Añadir a «Ver más tarde»",
+    "remove_watch_later": "Quitar de «Ver más tarde»"
+  },
   "filter_popup": {
     "active_count": "{count} activos",
     "active_title": "Filtros activos",
-    "quick_title": "Filtros rápidos · descubre lo que te gusta",
-    "fields": "{count} campos",
+    "quick_title": "Filtros rápidos",
     "performer": {
-      "title": "Actriz / Actor",
+      "title": "Actor",
       "description": "Quién sale en pantalla"
     },
     "scene": {
@@ -485,6 +491,7 @@
     "profile": "Perfil",
     "settings": "Configuraciones",
     "my_playlists": "Mis listas de reproducción",
+    "library": "Biblioteca",
     "back_to_main_page": "Volver a la página principal",
     "history": "Historial",
     "live_sex": "Sexo en vivo",

package/i18n/locales/fr-FR.json

@@ -1,4 +1,5 @@
 {
+  "top_models": "Top modèles",
   "additional_link": {
     "2257": "2257",
     "report": "Signaler un bug",
@@ -107,7 +108,7 @@
   "get_full_video": "Obtenir la vidéo complète",
   "filter": "Filtre",
   "filters": "Filtres",
-  "show_all_models": "Afficher tous les modèles",
+  "show_all_models": "Voir tout",
   "all_categories": "Alphabétique A-Z",
   "related_searches": "Recherches associées",
   "related_models": "Modèles associés",
@@ -380,13 +381,18 @@
     "item": "{n} élément | {n} éléments",
     "filter": "{n} filtre | {n} filtres"
   },
+  "video_actions": {
+    "add_favorites": "Ajouter aux favoris",
+    "remove_favorites": "Retirer des favoris",
+    "add_watch_later": "Ajouter à « À regarder plus tard »",
+    "remove_watch_later": "Retirer de « À regarder plus tard »"
+  },
   "filter_popup": {
     "active_count": "{count} actifs",
     "active_title": "Filtres actifs",
-    "quick_title": "Filtres rapides · selon vos envies",
-    "fields": "{count} champs",
+    "quick_title": "Filtres rapides",
     "performer": {
-      "title": "Acteur / Actrice",
+      "title": "Acteur",
       "description": "Qui est à l'écran"
     },
     "scene": {
@@ -485,6 +491,7 @@
     "profile": "Profil",
     "settings": "Paramètres",
     "my_playlists": "Mes listes de lecture",
+    "library": "Bibliothèque",
     "back_to_main_page": "Retour à la page principale",
     "history": "Historique",
     "live_sex": "Sexe en direct",

package/i18n/locales/it-IT.json

@@ -1,4 +1,5 @@
 {
+  "top_models": "Top modelli",
   "additional_link": {
     "2257": "2257",
     "report": "Segnala bug",
@@ -107,7 +108,7 @@
   "get_full_video": "Ottieni video completo",
   "filter": "Filtro",
   "filters": "Filtri",
-  "show_all_models": "Mostra tutti i modelli",
+  "show_all_models": "Vedi tutti",
   "all_categories": "Alfabetico A-Z",
   "related_searches": "Ricerche correlate",
   "related_models": "Modelli correlati",
@@ -380,13 +381,18 @@
     "item": "{n} elemento | {n} elementi",
     "filter": "{n} filtro | {n} filtri"
   },
+  "video_actions": {
+    "add_favorites": "Aggiungi ai preferiti",
+    "remove_favorites": "Rimuovi dai preferiti",
+    "add_watch_later": "Aggiungi a «Guarda più tardi»",
+    "remove_watch_later": "Rimuovi da «Guarda più tardi»"
+  },
   "filter_popup": {
     "active_count": "{count} attivi",
     "active_title": "Filtri attivi",
-    "quick_title": "Filtri rapidi · su misura per i tuoi gusti",
-    "fields": "{count} campi",
+    "quick_title": "Filtri rapidi",
     "performer": {
-      "title": "Attore / Attrice",
+      "title": "Attore",
       "description": "Chi c'è sullo schermo"
     },
     "scene": {
@@ -487,6 +493,7 @@
     "my_playlists": "Le mie playlist",
     "back_to_main_page": "Torna alla pagina principale",
     "history": "Cronologia",
+    "library": "Raccolta",
     "live_sex": "Sesso dal vivo",
     "watch_later": "Guarda dopo"
   },

package/i18n/locales/ja-JP.json

@@ -1,4 +1,5 @@
 {
+  "top_models": "人気モデル",
   "additional_link": {
     "2257": "2257",
     "report": "バグを報告",
@@ -107,7 +108,7 @@
   "get_full_video": "フルビデオを取得",
   "filter": "フィルター",
   "filters": "フィルター",
-  "show_all_models": "すべてのモデルを表示",
+  "show_all_models": "すべて見る",
   "all_categories": "アルファベット A-Z",
   "related_searches": "関連検索",
   "related_models": "関連モデル",
@@ -140,7 +141,7 @@
   "models_by_letter": "アルファベット別のモデル",
   "trending": "トレンド",
   "trending_models": "トレンドモデル",
-  "popular_searches": "人気検索",
+  "popular_searches": "人気の検索",
   "category": "カテゴリ",
   "playlists": "プレイリスト",
   "channels": "チャンネル",
@@ -378,13 +379,18 @@
     "views": "{n} 視聴 | {n} 視聴回数",
     "videos": "{n} ビデオ | {n} ビデオ",
     "item": "{n} アイテム | {n} アイテム",
-    "filter": "{n} 件のフィルター | {n} 件のフィルター"
+    "filter": "{n}件のフィルター | {n}件のフィルター"
+  },
+  "video_actions": {
+    "add_favorites": "お気に入りに追加",
+    "remove_favorites": "お気に入りから削除",
+    "add_watch_later": "後で見るに追加",
+    "remove_watch_later": "後で見るから削除"
   },
   "filter_popup": {
     "active_count": "{count}件有効",
     "active_title": "有効なフィルター",
-    "quick_title": "クイックフィルター · あなた好みの発見",
-    "fields": "{count}項目",
+    "quick_title": "クイックフィルター",
     "performer": {
       "title": "出演者",
       "description": "画面に映っている人"
@@ -485,6 +491,7 @@
     "profile": "プロフィール",
     "settings": "設定",
     "my_playlists": "マイプレイリスト",
+    "library": "ライブラリ",
     "back_to_main_page": "メインページに戻る",
     "history": "履歴",
     "live_sex": "ライブ",

package/i18n/locales/ko-KR.json

@@ -1,4 +1,5 @@
 {
+  "top_models": "인기 모델",
   "additional_link": {
     "2257": "2257",
     "report": "버그 신고",
@@ -107,7 +108,7 @@
   "get_full_video": "전체 비디오 받기",
   "filter": "필터",
   "filters": "필터",
-  "show_all_models": "모든 모델 표시",
+  "show_all_models": "전체 보기",
   "all_categories": "알파벳 A-Z",
   "related_searches": "관련 검색",
   "related_models": "관련 모델",
@@ -140,7 +141,7 @@
   "models_by_letter": "알파벳별 모델",
   "trending": "트렌드",
   "trending_models": "트렌드 모델",
-  "popular_searches": "인기 검색",
+  "popular_searches": "인기 검색어",
   "category": "카테고리",
   "playlists": "재생목록",
   "channels": "채널",
@@ -378,13 +379,18 @@
     "views": "{n} 조회 | {n} 조회수",
     "videos": "{n} 비디오 | {n} 비디오",
     "item": "{n} 항목 | {n} 항목",
-    "filter": "{n}개 필터 | {n}개 필터"
+    "filter": "필터 {n}개 | 필터 {n}개"
+  },
+  "video_actions": {
+    "add_favorites": "즐겨찾기에 추가",
+    "remove_favorites": "즐겨찾기에서 제거",
+    "add_watch_later": "나중에 볼 동영상에 추가",
+    "remove_watch_later": "나중에 볼 동영상에서 제거"
   },
   "filter_popup": {
     "active_count": "{count}개 활성",
     "active_title": "활성 필터",
-    "quick_title": "빠른 필터 · 취향저격 탐색",
-    "fields": "{count}개 필드",
+    "quick_title": "빠른 필터",
     "performer": {
       "title": "배우",
       "description": "화면 속 인물"
@@ -484,6 +490,7 @@
     "network": "네트워크",
     "profile": "프로필",
     "settings": "설정",
+    "library": "보관함",
     "my_playlists": "내 재생목록",
     "back_to_main_page": "메인 페이지로 돌아가기",
     "history": "기록",

package/i18n/locales/ru-RU.json

@@ -1,4 +1,5 @@
 {
+  "top_models": "Популярные модели",
   "additional_link": {
     "2257": "2257",
     "report": "Сообщить об ошибке",
@@ -107,7 +108,7 @@
   "get_full_video": "Получить полное видео",
   "filter": "Фильтр",
   "filters": "Фильтры",
-  "show_all_models": "Показать всех моделей",
+  "show_all_models": "Показать все",
   "all_categories": "По алфавиту А-Я",
   "related_searches": "Похожие запросы",
   "related_models": "Похожие модели",
@@ -378,15 +379,20 @@
     "views": "{n} просмотр | {n} просмотра | {n} просмотров",
     "videos": "{n} видео | {n} видео | {n} видео",
     "item": "{n} элемент | {n} элемента | {n} элементов",
-    "filter": "{n} фильтр | {n} фильтра"
+    "filter": "{n} фильтр | {n} фильтра | {n} фильтров"
+  },
+  "video_actions": {
+    "add_favorites": "В избранное",
+    "remove_favorites": "Убрать из избранного",
+    "add_watch_later": "Смотреть позже",
+    "remove_watch_later": "Убрать из «Смотреть позже»"
   },
   "filter_popup": {
     "active_count": "{count} активно",
     "active_title": "Активные фильтры",
-    "quick_title": "Быстрые фильтры · подборка по твоему вкусу",
-    "fields": "{count} полей",
+    "quick_title": "Быстрые фильтры",
     "performer": {
-      "title": "Актёр / актриса",
+      "title": "Актёр",
       "description": "Кто в кадре"
     },
     "scene": {
@@ -485,6 +491,7 @@
     "playlists": "Плейлисты",
     "network": "Сеть",
     "profile": "Профиль",
+    "library": "Библиотека",
     "settings": "Настройки",
     "my_playlists": "Мои плейлисты",
     "back_to_main_page": "Вернуться на главную",

package/i18n/locales/zh-CN.json

@@ -1,4 +1,5 @@
 {
+  "top_models": "热门模特",
   "additional_link": {
     "2257": "2257",
     "report": "报告错误",
@@ -107,7 +108,7 @@
   "get_full_video": "获取完整视频",
   "filter": "筛选",
   "filters": "筛选器",
-  "show_all_models": "显示全部模特",
+  "show_all_models": "查看全部",
   "all_categories": "字母 A-Z",
   "related_searches": "相关搜索",
   "related_models": "相关模特",
@@ -378,13 +379,18 @@
     "views": "{n} 次观看 | {n} 次观看",
     "videos": "{n} 个视频 | {n} 个视频",
     "item": "{n} 个项目 | {n} 个项目",
-    "filter": "{n} 个筛选 | {n} 个筛选"
+    "filter": "{n} 个筛选项 | {n} 个筛选项"
+  },
+  "video_actions": {
+    "add_favorites": "添加到收藏",
+    "remove_favorites": "从收藏中移除",
+    "add_watch_later": "添加到稍后观看",
+    "remove_watch_later": "从稍后观看中移除"
   },
   "filter_popup": {
     "active_count": "{count} 个已启用",
     "active_title": "已启用的筛选",
-    "quick_title": "快速筛选 · 投你所好",
-    "fields": "{count} 个字段",
+    "quick_title": "快速筛选",
     "performer": {
       "title": "演员",
       "description": "画面中是谁"
@@ -485,6 +491,7 @@
     "profile": "个人资料",
     "settings": "设置",
     "my_playlists": "我的播放列表",
+    "library": "媒体库",
     "back_to_main_page": "返回主页",
     "history": "历史记录",
     "live_sex": "直播",

package/package.json

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

package/pages/channels/[channel].vue

@@ -75,7 +75,7 @@
 </template>
 
 <script setup lang="ts">
-import { convertString, convertQueryCategories, convertModelToRoundCard, convertChannelToRoundCard } from '../../runtime';
+import { convertString, convertModelToRoundCard, convertChannelToRoundCard } from '../../runtime';
 import { sortItemsDefault } from '../../lib';
 import { ChannelsApiService } from '../../services/api/channels.service';
 import { ModelsApiService } from '../../services/api/models.service';
@@ -93,11 +93,13 @@ const [
   { data: cardInfo, status },
   { data: videosData, status: videosStatus },
   { data: channelsTag },
+  queryCategories,
 ] = await Promise.all([
   useFetchModelsByChannel(ModelsApiService.getListByChannel, 100),
   useFetchChannelsByName(ChannelsApiService.getChannelsByName),
   useFetchVideosByChannel(VideosApiService.getListByNicheAndChannel),
   useFetchPopularTagsByChannelName(VideosApiService.popularTagsByChannelName),
+  useRouteQueryCategories(),
 ]);
 
 const { data: networkChannels } = cardInfo.value?.isNetwork
@@ -107,13 +109,7 @@ const { data: networkChannels } = cardInfo.value?.isNetwork
 const title = convertString().fromSlug(String(route.params['channel']));
 const metaTitle = computed(() => convertString().toCapitalize(title));
 
-const routeQueryCategories = computed(() => {
-  if (route.query['categories']) {
-    const text = convertQueryCategories(route);
-    return ` ${convertString().toCapitalize(text)}`;
-  }
-  return '';
-});
+const routeQueryCategories = computed(() => (queryCategories.value ? ` ${queryCategories.value}` : ''));
 
 const {
   meta

package/pages/history.vue

@@ -51,7 +51,7 @@
       >
         <UiSectionTitle
           :title="getGroupTitle(group)"
-          :count="n(group.items.length, 'compact')"
+          :count="group.items.length"
           class="history__group-header"
           icon="video-camera"
           title-tag="h2"
@@ -130,7 +130,7 @@ import type { IBreadcrumbItem, IVideoCard } from '../types';
 
 const PER_PAGE = 24;
 
-const { t, n, locale } = useI18n();
+const { t, locale } = useI18n();
 const route = useRoute();
 
 const isFilterOpen = ref(false);

package/pages/index.vue

@@ -17,7 +17,7 @@
 </template>
 
 <script setup lang="ts">
-import { convertQueryCategories, convertString, AsyncData } from '../runtime';
+import { AsyncData } from '../runtime';
 import { VideosApiService } from '../services/api/videos.service';
 import { ModelsApiService } from '../services/api/models.service';
 import { CategoriesApiService } from '../services/api/categories.service';
@@ -37,21 +37,17 @@ const [
   { data, status },
   { data: dataModels },
   { quickGroups },
+  queryCategories,
 ] = await Promise.all([
   useFetchVideos(VideosApiService.getListByNiche),
   useFetchTopModels(ModelsApiService.getTop, 24, AsyncData.TopModelsMore, String(pageName)),
   useFetchQuickFilterGroups(CategoriesApiService.getQuickGroups, quickFilterScheme.map(item => item.name)),
+  useRouteQueryCategories(),
 ]);
 
 const quickFilters = computed(() => toQuickFilters(quickGroups.value || [], quickFilterScheme, key => t(key)));
 
-const routeQueryCategories = computed(() => {
-  if (route.query['categories']) {
-    const text = convertQueryCategories(route);
-    return `${convertString().toCapitalize(text)} `;
-  }
-  return '';
-});
+const routeQueryCategories = computed(() => (queryCategories.value ? `${queryCategories.value} ` : ''));
 
 const clientCountry = useClientCountry();
 

package/pages/models/[slug]/channel/[channel].vue

@@ -24,7 +24,7 @@
 </template>
 
 <script setup lang="ts">
-import { convertQueryCategories, convertString } from '../../../../runtime';
+import { convertString } from '../../../../runtime';
 import { VideosApiService } from '../../../../services/api/videos.service';
 import { ModelsApiService } from '../../../../services/api/models.service';
 import { ChannelsApiService } from '../../../../services/api/channels.service';
@@ -42,6 +42,7 @@ const [
   { data: dataModels },
   { data: modelTags },
   { data: modelChannels },
+  queryCategories,
 ] = await Promise.all([
   useFetchVideosByChannel(VideosApiService.getListByNicheAndChannel),
   useFetchVideosByModelAndChannel(VideosApiService.getListByNicheAndModelAndChannel),
@@ -49,6 +50,7 @@ const [
   useFetchRelatedModels(ModelsApiService.getRelatedModels, 25, String(pageName)),
   useFetchPopularTagsByModelName(VideosApiService.popularTagsByModelName),
   useFetchChannelsByModel(ChannelsApiService.getChannelsByModel),
+  useRouteQueryCategories(),
 ]);
 
 const { t } = useI18n();
@@ -56,13 +58,7 @@ const { t } = useI18n();
 const title = convertString().fromSlug(String(route.params[ 'slug' ]));
 const metaTitle = computed(() => convertString().toCapitalize(title));
 
-const routeQueryCategories = computed(() => {
-  if (route.query[ 'categories' ]) {
-    const text = convertQueryCategories(route);
-    return ` ${convertString().toCapitalize(text)}`;
-  }
-  return '';
-});
+const routeQueryCategories = computed(() => (queryCategories.value ? ` ${queryCategories.value}` : ''));
 
 const channelRoute = String(route.params[ 'channel' ]);
 const channelSlug = computed(() => convertString().fromSlug(channelRoute));

package/pages/models/[slug]/index.vue

@@ -18,7 +18,7 @@
 </template>
 
 <script setup lang="ts">
-import { convertQueryCategories, convertString, AsyncData } from '../../../runtime';
+import { convertString, AsyncData } from '../../../runtime';
 import { VideosApiService } from '../../../services/api/videos.service';
 import { ModelsApiService } from '../../../services/api/models.service';
 import { ChannelsApiService } from '../../../services/api/channels.service';
@@ -36,6 +36,7 @@ const [
   { data: modelTags },
   { data: modelChannels },
   { data: topModels }, // TODO placeholder
+  queryCategories,
 ] = await Promise.all([
   useFetchVideosByModel(VideosApiService.getListByNicheAndModel),
   useFetchModelByName(ModelsApiService.getModelsByName),
@@ -43,6 +44,7 @@ const [
   useFetchPopularTagsByModelName(VideosApiService.popularTagsByModelName),
   useFetchChannelsByModel(ChannelsApiService.getChannelsByModel),
   useFetchTopModels(ModelsApiService.getTop, 12, AsyncData.TopModelsMore, String(pageName)),
+  useRouteQueryCategories(),
 ]);
 
 const testModelImages = [
@@ -66,13 +68,7 @@ const { t } = useI18n();
 const title = convertString().fromSlug(String(route.params[ 'slug' ]));
 const metaTitle = computed(() => convertString().toCapitalize(title));
 
-const routeQueryCategories = computed(() => {
-  if (route.query[ 'categories' ]) {
-    const text = convertQueryCategories(route);
-    return ` ${convertString().toCapitalize(text)}`;
-  }
-  return '';
-});
+const routeQueryCategories = computed(() => (queryCategories.value ? ` ${queryCategories.value}` : ''));
 
 const { meta, h1 } = useMeta({
   t,

package/pages/models/[slug]/tag/[tag].vue

@@ -24,7 +24,7 @@
 </template>
 
 <script setup lang="ts">
-import { convertQueryCategories, convertString } from '../../../../runtime';
+import { convertString } from '../../../../runtime';
 import { VideosApiService } from '../../../../services/api/videos.service';
 import { ModelsApiService } from '../../../../services/api/models.service';
 import { ChannelsApiService } from '../../../../services/api/channels.service';
@@ -42,6 +42,7 @@ const [
   { data: dataModels },
   { data: modelTags },
   { data: modelChannels },
+  queryCategories,
 ] = await Promise.all([
   useFetchVideosByTag(VideosApiService.getListByNicheAndTag),
   useFetchVideosByModelAndTag(VideosApiService.getListByNicheAndModelAndTag),
@@ -49,6 +50,7 @@ const [
   useFetchRelatedModels(ModelsApiService.getRelatedModels, 25, String(pageName)),
   useFetchPopularTagsByModelName(VideosApiService.popularTagsByModelName),
   useFetchChannelsByModel(ChannelsApiService.getChannelsByModel),
+  useRouteQueryCategories(),
 ]);
 
 const { t } = useI18n();
@@ -57,13 +59,7 @@ const tagRoute = String(route.params[ 'tag' ]);
 const tagSlug = computed(() => convertString().fromSlug(tagRoute));
 const title = convertString().fromSlug(String(route.params[ 'slug' ]));
 const metaTitle = computed(() => convertString().toCapitalize(title));
-const routeQueryCategories = computed(() => {
-  if (route.query[ 'categories' ]) {
-    const text = convertQueryCategories(route);
-    return ` ${convertString().toCapitalize(text)}`;
-  }
-  return '';
-});
+const routeQueryCategories = computed(() => (queryCategories.value ? ` ${queryCategories.value}` : ''));
 
 const { meta, h1 } = useMeta({
   t,

package/pages/tag/[tag].vue

@@ -21,7 +21,7 @@
 
 <script setup lang="ts">
 import type { IBreadcrumbItem } from '../../types';
-import { convertQueryCategories, convertString } from '../../runtime';
+import { convertString } from '../../runtime';
 import { VideosApiService } from '../../services/api/videos.service';
 import { ModelsApiService } from '../../services/api/models.service';
 import { sortItemsDefault } from '../../lib';
@@ -33,9 +33,11 @@ const pageName = useGetPureRouteName();
 const [
   { data, status },
   { data: modelsByTag },
+  queryCategories,
 ] = await Promise.all([
   useFetchVideosByTag(VideosApiService.getListByNicheAndTag),
   useFetchModelsByTag(ModelsApiService.getListByTag, 100),
+  useRouteQueryCategories(),
 ]);
 
 useNoindexThinListing(() => data.value?.items?.length);
@@ -46,13 +48,7 @@ const slug = computed(() => String(route.params[ 'tag' ]));
 const title = convertString().fromSlug(slug.value);
 const metaTitle = computed(() => convertString().toCapitalize(title));
 
-const routeQueryCategories = computed(() => {
-  if (route.query[ 'categories' ]) {
-    const text = convertQueryCategories(route);
-    return ` ${convertString().toCapitalize(text)}`;
-  }
-  return '';
-});
+const routeQueryCategories = computed(() => (queryCategories.value ? ` ${queryCategories.value}` : ''));
 
 const { meta, h1 } = useMeta({
   t,

package/runtime/utils/converters/__tests__/convert-query-categories.test.ts

@@ -19,4 +19,21 @@ describe('convertQueryCategories', () => {
     const result = convertQueryCategories(route as any);
     expect(result).toBe('Teen');
   });
+
+  it('берёт переведённый заголовок из групп с бека', () => {
+    const route = { query: { categories: 'cat_teen,age_milf' } };
+    const groups = [
+      { name: 'cat', categories: [{ name: 'teen', title: 'подростки' }] },
+      { name: 'Age', categories: [{ name: 'milf', title: 'мамочки' }] },
+    ];
+    const result = convertQueryCategories(route as any, groups as any);
+    expect(result).toBe('Подростки, Мамочки');
+  });
+
+  it('без совпадения в группах оставляет значение из query', () => {
+    const route = { query: { categories: 'cat_teen' } };
+    const groups = [{ name: 'other', categories: [{ name: 'milf', title: 'мамочки' }] }];
+    const result = convertQueryCategories(route as any, groups as any);
+    expect(result).toBe('Teen');
+  });
 });

package/runtime/utils/converters/convert-query-categories.ts

@@ -1,6 +1,28 @@
 import type { RouteLocationNormalizedLoaded } from 'vue-router';
-/** Конвертирует категории из query-параметра в читаемую строку с заглавными буквами (до 3 категорий). */
-export function convertQueryCategories(route: RouteLocationNormalizedLoaded)  {
+import type { IGroupCategories } from '../../../types';
+
+/**
+ * Конвертирует категории из query-параметра в читаемую строку с заглавными буквами (до 3 категорий).
+ * Со списком групп с бека берёт переведённый заголовок категории, без него — значение из query
+ * (английский слаг): группы грузятся лениво, до них заголовок собирать всё равно нужно.
+ *
+ * @param route - роут со query-параметром `categories` вида `<группа>_<категория>`
+ * @param groups - группы категорий с бека, заголовки в языке текущей локали
+ */
+export function convertQueryCategories(
+  route: RouteLocationNormalizedLoaded,
+  groups?: IGroupCategories[] | null,
+) {
   const MAX_CATEGORIES = 3;
-  return String(route.query[ 'categories' ])?.split(',').map(item => item.split('_')[ 1 ]).map(item => item?.charAt(0).toUpperCase() + item?.slice(1)).slice(0, MAX_CATEGORIES).join(', ');
+
+  return String(route.query[ 'categories' ])?.split(',').slice(0, MAX_CATEGORIES).map(item => {
+    const [ groupName, ...rest ] = item.split('_');
+    const name = rest.join('_');
+    const title = groups
+      ?.find(group => group.name.toLowerCase() === groupName?.toLowerCase())
+      ?.categories?.find(category => category.name === name)?.title;
+
+    const text = title || name;
+    return text?.charAt(0).toUpperCase() + text?.slice(1);
+  }).join(', ');
 }