itube-specs 0.0.892 → 0.0.895

package/pages/library.vue

@@ -1,366 +1,6 @@
-<!-- Библиотека: «продолжить просмотр», коллекции и подписки. Данные пока заглушка -->
 <template>
-  <div class="library _page _container">
-    <UiBreadcrumbs
-      :items="breadcrumbs"
-      class="_breadcrumbs"
-    />
-
-    <div class="library__header">
-      <h1 class="library__title _title">{{ t('navigation.library') }}</h1>
-
-      <UiToggle
-        v-model="saveHistory"
-        class="library__save"
-        left
-      >{{ t('history_text') }}</UiToggle>
-    </div>
-
-    <section
-      v-if="continueWatching.length > 0"
-      class="library__section"
-    >
-      <header class="library__section-header">
-        <h2 class="library__heading">
-          <span class="library__heading-icon">
-            <UiIcon
-              name="history"
-              size="16"
-            />
-          </span>
-          {{ t('library.continue_watching') }}
-        </h2>
-
-        <UiLink
-          :to="generateLink('/history')"
-          theme="secondary"
-        >
-          {{ t('library.view_all_history') }}
-          <UiIcon
-            name="arrow-right"
-            size="16"
-          />
-        </UiLink>
-      </header>
-
-      <div class="library__continue">
-        <CardHistory
-          v-for="item in continueWatching"
-          :key="`continue-${item.guid}`"
-          :card="item"
-          loading="eager"
-          priority
-          remaining
-          @share="onShare"
-          @remove="onRemove"
-        />
-      </div>
-    </section>
-
-    <section class="library__section">
-      <header class="library__section-header">
-        <h2 class="library__heading">
-          <span class="library__heading-icon">
-            <UiIcon
-              name="layers"
-              size="16"
-            />
-          </span>
-          {{ t('library.collections') }}
-        </h2>
-      </header>
-
-      <ul class="library__grid">
-        <li
-          v-for="item in collections"
-          :key="item.title"
-        >
-          <LibraryItem
-            :to="item.to"
-            :icon="item.icon"
-            :title="item.title"
-            :subtitle="item.subtitle"
-          />
-        </li>
-      </ul>
-    </section>
-
-    <section class="library__section">
-      <header class="library__section-header">
-        <h2 class="library__heading">
-          <span class="library__heading-icon">
-            <UiIcon
-              name="plus"
-              size="16"
-            />
-          </span>
-          {{ t('library.following') }}
-        </h2>
-
-        <UiBtn theme="secondary">
-          {{ t('library.whats_new', { count: newTotal }) }}
-          <UiIcon
-            name="arrow-right"
-            size="16"
-          />
-        </UiBtn>
-      </header>
-
-      <ul class="library__grid">
-        <li
-          v-for="item in following"
-          :key="item.title"
-        >
-          <LibraryItem
-            :to="item.to"
-            :icon="item.icon"
-            :title="item.title"
-            :subtitle="item.subtitle"
-            :badge="item.badge"
-            :badge-note="item.badgeNote"
-            :badge-theme="item.badgeTheme"
-          />
-        </li>
-      </ul>
-    </section>
-
-    <ShareMain
-      v-model="isShareOpen"
-      :url="shareUrl"
-    >
-      <template #card>
-        <CardVideoMini
-          v-if="shareCard"
-          :card="shareCard"
-        />
-      </template>
-    </ShareMain>
-  </div>
+  <NuxtPage />
 </template>
 
 <script setup lang="ts">
-import { getHistoryStub } from '../stubs/history';
-import type { HistoryStubCard } from '../stubs/history';
-import { libraryStub } from '../stubs/library';
-import type { IBreadcrumbItem, IVideoCard } from '../types';
-
-/** Карточка-ссылка библиотеки в разметке страницы. */
-type LibraryLink = {
-  to: string
-  icon: string
-  title: string
-  subtitle?: string
-  badge?: string
-  badgeNote?: string
-  badgeTheme?: 'accent' | 'bordered'
-};
-
-const CONTINUE_LIMIT = 4;
-
-const { t } = useI18n();
-
-const { generateLink } = useGenerateLink();
-
-const saveHistory = ref(true);
-
-const removedGuids = ref<string[]>([]);
-
-/** Недосмотренные ролики: прогресс есть, но до конца не дошли. */
-const continueWatching = computed(() => getHistoryStub()
-  .filter(item => item.progress > 0 && item.progress < 100)
-  .filter(item => !removedGuids.value.includes(item.guid))
-  .slice(0, CONTINUE_LIMIT));
-
-const newTotal = computed(() => libraryStub.newModels + libraryStub.newChannels + libraryStub.newPlaylists);
-
-const collections = computed<LibraryLink[]>(() => [
-  {
-    to: generateLink('/favorites'),
-    icon: 'heart-stroke',
-    title: t('favorites'),
-    subtitle: t('plural.videos', libraryStub.favorites),
-  },
-  {
-    to: `${generateLink('/favorites')}?tab=watch-later`,
-    icon: 'clock',
-    title: t('watch_later'),
-    subtitle: t('plural.videos', libraryStub.watchLater),
-  },
-  {
-    to: generateLink('/playlists'),
-    icon: 'playlist',
-    title: t('my_playlists'),
-    subtitle: t('library.playlists_visibility', {
-      privateCount: libraryStub.privatePlaylists,
-      publicCount: libraryStub.publicPlaylists,
-    }),
-  },
-  {
-    to: generateLink('/history'),
-    icon: 'history',
-    title: t('history'),
-    subtitle: t('library.watched_today', { count: libraryStub.watchedToday }),
-  },
-]);
-
-const following = computed<LibraryLink[]>(() => [
-  {
-    to: generateLink('/models'),
-    icon: 'user',
-    title: t('models'),
-    subtitle: t('plural.models', libraryStub.models),
-    badge: t('library.new_count', { count: libraryStub.newModels }),
-  },
-  {
-    to: generateLink('/channels'),
-    icon: 'play-circle',
-    title: t('channels'),
-    subtitle: t('plural.channels', libraryStub.channels),
-    badge: t('library.new_count', { count: libraryStub.newChannels }),
-  },
-  {
-    to: generateLink('/categories'),
-    icon: 'grid',
-    title: t('categories'),
-    subtitle: t('plural.categories', libraryStub.categories),
-    badge: `+${libraryStub.categoryVideosPerWeek}`,
-    badgeNote: t('library.this_week'),
-    badgeTheme: 'bordered',
-  },
-  {
-    to: generateLink('/playlists'),
-    icon: 'playlist',
-    title: t('playlists'),
-    subtitle: t('plural.playlists', libraryStub.playlists),
-    badge: t('library.new_count', { count: libraryStub.newPlaylists }),
-  },
-]);
-
-function onRemove(card: HistoryStubCard) {
-  removedGuids.value = [...removedGuids.value, card.guid];
-}
-
-const isShareOpen = ref(false);
-const shareCard = ref<IVideoCard | null>(null);
-
-const shareUrl = computed(() => shareCard.value ? generateLink(`/videos/${shareCard.value.id}`) : '');
-
-function onShare(card: IVideoCard) {
-  shareCard.value = card;
-  isShareOpen.value = true;
-}
-
-useNoindex();
-
-const { brandName } = useAppConfig();
-
-useHead(() => ({
-  title: `${t('navigation.library')} — ${brandName}`,
-}));
-
-const breadcrumbs = [
-  {
-    name: `${t('navigation.main')}`,
-    to: '/',
-  },
-  {
-    name: `${t('navigation.library')}`,
-  },
-] as IBreadcrumbItem[];
 </script>
-
-<style lang="scss">
-.library__header {
-  display: flex;
-  flex-wrap: wrap;
-  align-items: center;
-  justify-content: space-between;
-  column-gap: 16px;
-  row-gap: 12px;
-  margin-bottom: 24px;
-}
-
-.library__title._title {
-  margin-bottom: 0;
-}
-
-.library__save .ui-toggle__text {
-  @include font-sm;
-
-  color: $page-library-toggle-text;
-}
-
-.library__section {
-  margin-bottom: 48px;
-}
-
-.library__section-header {
-  display: flex;
-  flex-wrap: wrap;
-  align-items: center;
-  justify-content: space-between;
-  column-gap: 16px;
-  row-gap: 12px;
-  margin-bottom: 16px;
-}
-
-.library__heading {
-  @include font-xl;
-
-  display: flex;
-  align-items: center;
-  column-gap: 8px;
-  margin: 0;
-  font-weight: 600;
-  color: $page-library-heading;
-}
-
-.library__heading-icon {
-  display: grid;
-  place-content: center;
-  flex-shrink: 0;
-  width: 24px;
-  height: 24px;
-  color: $page-library-heading-icon;
-  background-color: $page-library-heading-icon-bg;
-  border-radius: $radius-md;
-}
-
-.library__continue {
-  display: grid;
-  gap: 16px;
-  grid-template-columns: 1fr;
-
-  @include from-br(xm) {
-    grid-template-columns: repeat(2, 1fr);
-  }
-
-  @include from-br(sm) {
-    gap: 24px;
-    grid-template-columns: repeat(3, 1fr);
-  }
-
-  @include from-br(md) {
-    grid-template-columns: repeat(4, 1fr);
-  }
-}
-
-.library__grid {
-  display: grid;
-  gap: 16px;
-  margin: 0;
-  padding: 0;
-  list-style: none;
-  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
-
-  @include from-br(sm) {
-    gap: 24px;
-    grid-template-columns: repeat(4, 1fr);
-  }
-}
-
-/* Карточка тянется на всю высоту ряда — иначе соседи с двухстрочным тайтлом разной высоты. */
-.library__grid > li {
-  display: grid;
-}
-</style>

package/stubs/history.ts

@@ -1,3 +1,4 @@
+import { VIDEO_POOL } from './videos';
 import type { IThumbUrls } from '../types';
 
 const HOUR = 3600;
@@ -20,24 +21,26 @@ export type HistoryStubCard = {
 };
 
 /**
- * Ролики сняты с главной gay.cool — id, тайтлы, тумбы и каналы настоящие.
+ * Состояние просмотра поверх общего пула роликов — индекс в индекс с `VIDEO_POOL`.
  * `watchedAgo` — смещение в секундах от «сейчас», чтобы даты в вёрстке не устаревали.
  */
-const ITEMS = [
-  { id: '445839845', title: 'Drew Sebastian Barebacks Nick Fitt: Muscle Daddy Tops Athletic Bottom on the Couch', duration: 486, thumbUrls: { webp: { '320x180': 'https://nlt01.gay.cool/a/8/d/a8dc253cad705d688508de096435a989/thumbs/320x180/3.webp', '480x270': 'https://nlt01.gay.cool/a/8/d/a8dc253cad705d688508de096435a989/thumbs/480x270/3.webp' } }, channelName: 'Icon Male', channelAvatar: 'https://nli01.joystorage.com/c/0/2/c02a3f8ef14943b5f3da537aaed46fcc.jpeg', previewUrl: 'https://nlp02.gay.cool/a/8/d/a8dc253cad705d688508de096435a989/preview/video.mp4', progress: 57, watchedAgo: 2 * HOUR },
-  { id: '171708405', title: 'Bareback bathroom fisting with black latex gloves, rimming, piss play and anal gape', duration: 358, quality: '1080', thumbUrls: { webp: { '320x180': 'https://nlt03.gay.cool/b/7/5/b75c1bf33571126845502e2b9bb5d687/thumbs/320x180/33.webp', '480x270': 'https://nlt03.gay.cool/b/7/5/b75c1bf33571126845502e2b9bb5d687/thumbs/480x270/33.webp' } }, previewUrl: 'https://nlp02.gay.cool/b/7/5/b75c1bf33571126845502e2b9bb5d687/preview/video.mp4', progress: 74, watchedAgo: 5 * HOUR },
-  { id: '374534215', title: 'Jake Davis Takes Bareback Anal in Blue Harness from Athletic Partner', duration: 487, thumbUrls: { webp: { '320x180': 'https://nlt02.gay.cool/2/4/6/246f577796c7c955b8df94f6454de2a5/thumbs/320x180/12.webp', '480x270': 'https://nlt02.gay.cool/2/4/6/246f577796c7c955b8df94f6454de2a5/thumbs/480x270/12.webp' } }, channelName: 'Icon Male', channelAvatar: 'https://nli01.joystorage.com/c/0/2/c02a3f8ef14943b5f3da537aaed46fcc.jpeg', previewUrl: 'https://nlp05.gay.cool/2/4/6/246f577796c7c955b8df94f6454de2a5/preview/video.mp4', progress: 91, watchedAgo: 8 * HOUR },
-  { id: '3377550', title: 'Rego Bello and Devin Adams bareback bedroom flip: reciprocal oral then Devin tops Rego', duration: 426, thumbUrls: { webp: { '320x180': 'https://nlt01.gay.cool/3/e/b/3eb0f19f1e600a98a7f5a5e51edc4b46/thumbs/320x180/33.webp', '480x270': 'https://nlt01.gay.cool/3/e/b/3eb0f19f1e600a98a7f5a5e51edc4b46/thumbs/480x270/33.webp' } }, previewUrl: 'https://nlp05.gay.cool/3/e/b/3eb0f19f1e600a98a7f5a5e51edc4b46/preview/video.mp4', progress: 48, watchedAgo: DAY + 3 * HOUR },
-  { id: '443170695', title: 'Johnny Rapid and Malakai White lead four-man hotel bareback with Max Lorde and Kyler Drayke', duration: 487, thumbUrls: { webp: { '320x180': 'https://nlt04.gay.cool/9/f/f/9ff067b9ea8b157ff2478667423ff9bb/thumbs/320x180/29.webp', '480x270': 'https://nlt04.gay.cool/9/f/f/9ff067b9ea8b157ff2478667423ff9bb/thumbs/480x270/29.webp' } }, channelName: 'Johnny Rapid', channelAvatar: 'https://nli01.joystorage.com/e/6/d/e6d0abd734a1a2eaef0baf7ceccfdb5c.jpeg', previewUrl: 'https://nlp01.gay.cool/9/f/f/9ff067b9ea8b157ff2478667423ff9bb/preview/video.mp4', progress: 100, watchedAgo: DAY + 7 * HOUR },
-  { id: '175791825', title: 'Kyle Wilkinson flip-fucks bareback with a smooth skinny twink: deep oral, riding and doggy', duration: 586, thumbUrls: { webp: { '320x180': 'https://nlt05.gay.cool/9/0/f/90fd15f9305b32394f8d383113376c27/thumbs/320x180/7.webp', '480x270': 'https://nlt05.gay.cool/9/0/f/90fd15f9305b32394f8d383113376c27/thumbs/480x270/7.webp' } }, previewUrl: 'https://nlp04.gay.cool/9/0/f/90fd15f9305b32394f8d383113376c27/preview/video.mp4', progress: 23, watchedAgo: DAY + 11 * HOUR },
-  { id: '374648505', title: 'Devon Lebron barebacks tattooed twink after rimjob in Staxus bedroom', duration: 1800, thumbUrls: { webp: { '320x180': 'https://nlt05.gay.cool/a/2/b/a2b4dce906ce8a4c107a5d559013e555/thumbs/320x180/46.webp', '480x270': 'https://nlt05.gay.cool/a/2/b/a2b4dce906ce8a4c107a5d559013e555/thumbs/480x270/46.webp' } }, previewUrl: 'https://nlp04.gay.cool/a/2/b/a2b4dce906ce8a4c107a5d559013e555/preview/video.mp4', progress: 99, watchedAgo: DAY + 16 * HOUR },
-  { id: '307011761', title: 'Damien Nichols barebacks a tattooed twink: military amateur, deepthroat to raw anal and cumshot', duration: 419, thumbUrls: { webp: { '320x180': 'https://nlt01.gay.cool/5/a/0/5a00c5dd536d7d7ce4baef5e45930f91/thumbs/320x180/43.webp', '480x270': 'https://nlt01.gay.cool/5/a/0/5a00c5dd536d7d7ce4baef5e45930f91/thumbs/480x270/43.webp' } }, previewUrl: 'https://nlp02.gay.cool/5/a/0/5a00c5dd536d7d7ce4baef5e45930f91/preview/video.mp4', progress: 66, watchedAgo: 2 * DAY + 4 * HOUR },
-  { id: '444068845', title: 'Dean Young Bareback Flip Fuck: Versatile Anal, Deepthroat and Rimming in the Bedroom', duration: 604, thumbUrls: { webp: { '320x180': 'https://nlt03.gay.cool/7/d/a/7daacbe876b51c7cdc50101b0d504be8/thumbs/320x180/16.webp', '480x270': 'https://nlt03.gay.cool/7/d/a/7daacbe876b51c7cdc50101b0d504be8/thumbs/480x270/16.webp' } }, previewUrl: 'https://nlp03.gay.cool/7/d/a/7daacbe876b51c7cdc50101b0d504be8/preview/video.mp4', progress: 12, watchedAgo: 2 * DAY + 9 * HOUR },
-  { id: '374968825', title: 'Brody Fox sucks and rides daddy Cain Marko bareback', duration: 497, thumbUrls: { webp: { '320x180': 'https://nlt01.gay.cool/9/e/2/9e23f59e882e860da3ab2400d93ac73e/thumbs/320x180/10.webp', '480x270': 'https://nlt01.gay.cool/9/e/2/9e23f59e882e860da3ab2400d93ac73e/thumbs/480x270/10.webp' } }, previewUrl: 'https://nlp03.gay.cool/9/e/2/9e23f59e882e860da3ab2400d93ac73e/preview/video.mp4', progress: 88, watchedAgo: 2 * DAY + 15 * HOUR },
-  { id: '377844995', title: 'Rick Lovatelli: blond twink dominated, deepthroats and gets barebacked by a suited bearded top', duration: 1627, thumbUrls: { webp: { '320x180': 'https://nlt05.gay.cool/f/1/b/f1b09d77a2e23f4b4696d97169614099/thumbs/320x180/25.webp', '480x270': 'https://nlt05.gay.cool/f/1/b/f1b09d77a2e23f4b4696d97169614099/thumbs/480x270/25.webp' } }, previewUrl: 'https://nlp01.gay.cool/f/1/b/f1b09d77a2e23f4b4696d97169614099/preview/video.mp4', progress: 35, watchedAgo: 4 * DAY + 6 * HOUR },
-  { id: '375132285', title: 'Viktor Rom and Jordan Fox bareback blue-haired bottom in bedroom threesome', duration: 800, quality: '1080', thumbUrls: { webp: { '320x180': 'https://nlt03.gay.cool/5/f/b/5fbcdd007476cd0a1e9c85abc9fc0042/thumbs/320x180/1.webp', '480x270': 'https://nlt03.gay.cool/5/f/b/5fbcdd007476cd0a1e9c85abc9fc0042/thumbs/480x270/1.webp' } }, previewUrl: 'https://nlp04.gay.cool/5/f/b/5fbcdd007476cd0a1e9c85abc9fc0042/preview/video.mp4', progress: 71, watchedAgo: 4 * DAY + 12 * HOUR },
+const WATCH_STATE = [
+  { progress: 57, watchedAgo: 2 * HOUR },
+  { progress: 74, watchedAgo: 5 * HOUR },
+  { progress: 91, watchedAgo: 8 * HOUR },
+  { progress: 48, watchedAgo: DAY + 3 * HOUR },
+  { progress: 100, watchedAgo: DAY + 7 * HOUR },
+  { progress: 23, watchedAgo: DAY + 11 * HOUR },
+  { progress: 99, watchedAgo: DAY + 16 * HOUR },
+  { progress: 66, watchedAgo: 2 * DAY + 4 * HOUR },
+  { progress: 12, watchedAgo: 2 * DAY + 9 * HOUR },
+  { progress: 88, watchedAgo: 2 * DAY + 15 * HOUR },
+  { progress: 35, watchedAgo: 4 * DAY + 6 * HOUR },
+  { progress: 71, watchedAgo: 4 * DAY + 12 * HOUR },
 ];
 
+const ITEMS = VIDEO_POOL.map((video, index) => ({ ...video, ...WATCH_STATE[index] }));
+
 /** Тот же набор, отодвинутый глубже в прошлое — чтобы набралось несколько страниц. */
 const WAVES = [0, 7 * DAY, 21 * DAY, 45 * DAY, 120 * DAY];
 

package/stubs/library-follows.ts

@@ -0,0 +1,135 @@
+import { VIDEO_POOL } from './videos';
+import type { StubVideo } from './videos';
+
+const HOUR = 3600;
+const DAY = 24 * HOUR;
+
+/** Сколько последних роликов сущности показываем в ленте. */
+const PREVIEW_LIMIT = 5;
+
+export type LibraryFollowVideo = StubVideo & {
+  guid: string;
+  isNew: boolean;
+};
+
+type LibraryFollowBase = {
+  guid: string;
+  title: string;
+  videosCount: number;
+  /** Сколько роликов вышло с прошлого захода; 0 — плашки «новое» нет */
+  newCount: number;
+  /** Unix timestamp (сек.) последнего добавленного ролика */
+  lastVideoAddedAt: number;
+  videos: LibraryFollowVideo[];
+};
+
+export type LibraryModelStub = LibraryFollowBase & {
+  avatarUrl: string;
+  country: {
+    name: string
+    title: string
+  };
+  age: number;
+  tags: string[];
+};
+
+export type LibraryChannelStub = LibraryFollowBase & {
+  avatarUrl?: string;
+  followersCount: number;
+  tags: string[];
+};
+
+export type LibraryCategoryStub = LibraryFollowBase;
+
+const now = () => Math.floor(Date.now() / 1000);
+
+const toSlug = (title: string) => title.toLowerCase().replace(/\s+/g, '-');
+
+/** Нарезает пул на ленту сущности: guid уникален внутри неё, первые `newCount` помечены новинками. */
+function buildVideos(slug: string, offset: number, newCount: number): LibraryFollowVideo[] {
+  return Array.from({ length: PREVIEW_LIMIT }, (_, index) => {
+    const video = VIDEO_POOL[(offset + index) % VIDEO_POOL.length];
+
+    return {
+      ...video,
+      guid: `${slug}-${video.id}`,
+      isNew: index < newCount,
+    };
+  });
+}
+
+/** Порядок по числу новинок намеренно не совпадает с алфавитным — иначе обе сортировки дают одно и то же. */
+const MODELS = [
+  { title: 'Dakota Lovell', image: 'Dakota_Lovell.png', country: { name: 'us', title: 'USA' }, age: 22, videosCount: 41, newCount: 3, tags: ['Twink', 'Jock', 'Versatile', 'Smooth', 'Bareback', 'Amateur'], updatedAgo: 6 * HOUR, videoOffset: 3 },
+  { title: 'Jax Thirio', image: 'Jax_Thirio.png', country: { name: 'ca', title: 'Canada' }, age: 38, videosCount: 17, newCount: 2, tags: ['Muscle', 'Daddy', 'Top', 'Tattooed'], updatedAgo: 2 * DAY, videoOffset: 9 },
+  { title: 'Austin Young', image: 'Austin_Young.png', country: { name: 'us', title: 'USA' }, age: 24, videosCount: 75, newCount: 1, tags: ['Twink', 'Smooth', 'Bottom', 'Blond', 'Solo'], updatedAgo: 9 * DAY, videoOffset: 0 },
+  { title: 'Devin Franco', image: 'Devin_Franco.png', country: { name: 'us', title: 'USA' }, age: 33, videosCount: 24, newCount: 0, tags: ['Muscle', 'Tattooed', 'Bottom', 'Fisting', 'Hardcore', 'Professional'], updatedAgo: 21 * DAY, videoOffset: 6 },
+];
+
+const CHANNELS = [
+  { title: 'Top To Bottom', avatarUrl: undefined, videosCount: 17, followersCount: 12800, newCount: 3, tags: ['Versatile', 'Flip-Flop', 'HD', 'Professional', 'Exclusive', 'Bareback'], updatedAgo: 4 * HOUR, videoOffset: 2 },
+  { title: 'Icon Male', avatarUrl: 'https://nli01.joystorage.com/c/0/2/c02a3f8ef14943b5f3da537aaed46fcc.jpeg', videosCount: 128, followersCount: 128400, newCount: 2, tags: ['Muscle', 'Daddy', 'Bareback', 'Professional', 'Exclusive', 'HD', 'Studio'], updatedAgo: DAY, videoOffset: 0 },
+  { title: 'Sean Cody', avatarUrl: undefined, videosCount: 64, followersCount: 210500, newCount: 1, tags: ['Jock', 'Muscle', 'Bareback', 'Studio'], updatedAgo: 5 * DAY, videoOffset: 7 },
+  { title: 'Johnny Rapid', avatarUrl: 'https://nli01.joystorage.com/e/6/d/e6d0abd734a1a2eaef0baf7ceccfdb5c.jpeg', videosCount: 86, followersCount: 94200, newCount: 0, tags: ['Twink', 'Bareback', 'Group', 'Amateur'], updatedAgo: 14 * DAY, videoOffset: 4 },
+];
+
+/**
+ * Широкие категории пополняются постоянно, поэтому новинки у них есть всегда; узкие вроде Firemen
+ * неделями стоят на месте — там `newCount: 0`, и лента откатывается на лучшее за неделю.
+ */
+const CATEGORIES = [
+  { title: 'Bareback', videosCount: 214, newCount: 3, updatedAgo: 3 * HOUR, videoOffset: 1 },
+  { title: 'Twinks', videosCount: 176, newCount: 2, updatedAgo: 9 * HOUR, videoOffset: 5 },
+  { title: 'Bears', videosCount: 92, newCount: 0, updatedAgo: 11 * DAY, videoOffset: 10 },
+  { title: 'Firemen', videosCount: 61, newCount: 0, updatedAgo: 24 * DAY, videoOffset: 8 },
+];
+
+/**
+ * Подписки пользователя. Ручек под них пока нет — вёрстка живёт на заглушке.
+ * Возраст ролика считаем от «сейчас», чтобы даты в разметке не устаревали.
+ */
+export function getLibraryModelsStub(): LibraryModelStub[] {
+  const stamp = now();
+
+  return MODELS.map(({ image, updatedAgo, videoOffset, ...model }) => {
+    const guid = toSlug(model.title);
+
+    return {
+      ...model,
+      guid,
+      avatarUrl: `/img/models/${image}`,
+      lastVideoAddedAt: stamp - updatedAgo,
+      videos: buildVideos(guid, videoOffset, model.newCount),
+    };
+  });
+}
+
+export function getLibraryChannelsStub(): LibraryChannelStub[] {
+  const stamp = now();
+
+  return CHANNELS.map(({ updatedAgo, videoOffset, ...channel }) => {
+    const guid = toSlug(channel.title);
+
+    return {
+      ...channel,
+      guid,
+      lastVideoAddedAt: stamp - updatedAgo,
+      videos: buildVideos(guid, videoOffset, channel.newCount),
+    };
+  });
+}
+
+export function getLibraryCategoriesStub(): LibraryCategoryStub[] {
+  const stamp = now();
+
+  return CATEGORIES.map(({ updatedAgo, videoOffset, ...category }) => {
+    const guid = toSlug(category.title);
+
+    return {
+      ...category,
+      guid,
+      lastVideoAddedAt: stamp - updatedAgo,
+      videos: buildVideos(guid, videoOffset, category.newCount),
+    };
+  });
+}

package/stubs/videos.ts

@@ -0,0 +1,29 @@
+import type { IThumbUrls } from '../types';
+
+/** Базовый ролик заглушек: id, тайтлы и тумбы сняты с главной gay.cool. */
+export type StubVideo = {
+  id: string;
+  title: string;
+  duration: number;
+  quality?: string;
+  thumbUrls: IThumbUrls;
+  previewUrl: string;
+  channelName?: string;
+  channelAvatar?: string;
+};
+
+/** Общий пул роликов для всех заглушек — порядок фиксирован, на него завязаны наборы-надстройки. */
+export const VIDEO_POOL: StubVideo[] = [
+  { id: '445839845', title: 'Drew Sebastian Barebacks Nick Fitt: Muscle Daddy Tops Athletic Bottom on the Couch', duration: 486, thumbUrls: { webp: { '320x180': 'https://nlt01.gay.cool/a/8/d/a8dc253cad705d688508de096435a989/thumbs/320x180/3.webp', '480x270': 'https://nlt01.gay.cool/a/8/d/a8dc253cad705d688508de096435a989/thumbs/480x270/3.webp' } }, channelName: 'Icon Male', channelAvatar: 'https://nli01.joystorage.com/c/0/2/c02a3f8ef14943b5f3da537aaed46fcc.jpeg', previewUrl: 'https://nlp02.gay.cool/a/8/d/a8dc253cad705d688508de096435a989/preview/video.mp4' },
+  { id: '171708405', title: 'Bareback bathroom fisting with black latex gloves, rimming, piss play and anal gape', duration: 358, quality: '1080', thumbUrls: { webp: { '320x180': 'https://nlt03.gay.cool/b/7/5/b75c1bf33571126845502e2b9bb5d687/thumbs/320x180/33.webp', '480x270': 'https://nlt03.gay.cool/b/7/5/b75c1bf33571126845502e2b9bb5d687/thumbs/480x270/33.webp' } }, previewUrl: 'https://nlp02.gay.cool/b/7/5/b75c1bf33571126845502e2b9bb5d687/preview/video.mp4' },
+  { id: '374534215', title: 'Jake Davis Takes Bareback Anal in Blue Harness from Athletic Partner', duration: 487, thumbUrls: { webp: { '320x180': 'https://nlt02.gay.cool/2/4/6/246f577796c7c955b8df94f6454de2a5/thumbs/320x180/12.webp', '480x270': 'https://nlt02.gay.cool/2/4/6/246f577796c7c955b8df94f6454de2a5/thumbs/480x270/12.webp' } }, channelName: 'Icon Male', channelAvatar: 'https://nli01.joystorage.com/c/0/2/c02a3f8ef14943b5f3da537aaed46fcc.jpeg', previewUrl: 'https://nlp05.gay.cool/2/4/6/246f577796c7c955b8df94f6454de2a5/preview/video.mp4' },
+  { id: '3377550', title: 'Rego Bello and Devin Adams bareback bedroom flip: reciprocal oral then Devin tops Rego', duration: 426, thumbUrls: { webp: { '320x180': 'https://nlt01.gay.cool/3/e/b/3eb0f19f1e600a98a7f5a5e51edc4b46/thumbs/320x180/33.webp', '480x270': 'https://nlt01.gay.cool/3/e/b/3eb0f19f1e600a98a7f5a5e51edc4b46/thumbs/480x270/33.webp' } }, previewUrl: 'https://nlp05.gay.cool/3/e/b/3eb0f19f1e600a98a7f5a5e51edc4b46/preview/video.mp4' },
+  { id: '443170695', title: 'Johnny Rapid and Malakai White lead four-man hotel bareback with Max Lorde and Kyler Drayke', duration: 487, thumbUrls: { webp: { '320x180': 'https://nlt04.gay.cool/9/f/f/9ff067b9ea8b157ff2478667423ff9bb/thumbs/320x180/29.webp', '480x270': 'https://nlt04.gay.cool/9/f/f/9ff067b9ea8b157ff2478667423ff9bb/thumbs/480x270/29.webp' } }, channelName: 'Johnny Rapid', channelAvatar: 'https://nli01.joystorage.com/e/6/d/e6d0abd734a1a2eaef0baf7ceccfdb5c.jpeg', previewUrl: 'https://nlp01.gay.cool/9/f/f/9ff067b9ea8b157ff2478667423ff9bb/preview/video.mp4' },
+  { id: '175791825', title: 'Kyle Wilkinson flip-fucks bareback with a smooth skinny twink: deep oral, riding and doggy', duration: 586, thumbUrls: { webp: { '320x180': 'https://nlt05.gay.cool/9/0/f/90fd15f9305b32394f8d383113376c27/thumbs/320x180/7.webp', '480x270': 'https://nlt05.gay.cool/9/0/f/90fd15f9305b32394f8d383113376c27/thumbs/480x270/7.webp' } }, previewUrl: 'https://nlp04.gay.cool/9/0/f/90fd15f9305b32394f8d383113376c27/preview/video.mp4' },
+  { id: '374648505', title: 'Devon Lebron barebacks tattooed twink after rimjob in Staxus bedroom', duration: 1800, thumbUrls: { webp: { '320x180': 'https://nlt05.gay.cool/a/2/b/a2b4dce906ce8a4c107a5d559013e555/thumbs/320x180/46.webp', '480x270': 'https://nlt05.gay.cool/a/2/b/a2b4dce906ce8a4c107a5d559013e555/thumbs/480x270/46.webp' } }, previewUrl: 'https://nlp04.gay.cool/a/2/b/a2b4dce906ce8a4c107a5d559013e555/preview/video.mp4' },
+  { id: '307011761', title: 'Damien Nichols barebacks a tattooed twink: military amateur, deepthroat to raw anal and cumshot', duration: 419, thumbUrls: { webp: { '320x180': 'https://nlt01.gay.cool/5/a/0/5a00c5dd536d7d7ce4baef5e45930f91/thumbs/320x180/43.webp', '480x270': 'https://nlt01.gay.cool/5/a/0/5a00c5dd536d7d7ce4baef5e45930f91/thumbs/480x270/43.webp' } }, previewUrl: 'https://nlp02.gay.cool/5/a/0/5a00c5dd536d7d7ce4baef5e45930f91/preview/video.mp4' },
+  { id: '444068845', title: 'Dean Young Bareback Flip Fuck: Versatile Anal, Deepthroat and Rimming in the Bedroom', duration: 604, thumbUrls: { webp: { '320x180': 'https://nlt03.gay.cool/7/d/a/7daacbe876b51c7cdc50101b0d504be8/thumbs/320x180/16.webp', '480x270': 'https://nlt03.gay.cool/7/d/a/7daacbe876b51c7cdc50101b0d504be8/thumbs/480x270/16.webp' } }, previewUrl: 'https://nlp03.gay.cool/7/d/a/7daacbe876b51c7cdc50101b0d504be8/preview/video.mp4' },
+  { id: '374968825', title: 'Brody Fox sucks and rides daddy Cain Marko bareback', duration: 497, thumbUrls: { webp: { '320x180': 'https://nlt01.gay.cool/9/e/2/9e23f59e882e860da3ab2400d93ac73e/thumbs/320x180/10.webp', '480x270': 'https://nlt01.gay.cool/9/e/2/9e23f59e882e860da3ab2400d93ac73e/thumbs/480x270/10.webp' } }, previewUrl: 'https://nlp03.gay.cool/9/e/2/9e23f59e882e860da3ab2400d93ac73e/preview/video.mp4' },
+  { id: '377844995', title: 'Rick Lovatelli: blond twink dominated, deepthroats and gets barebacked by a suited bearded top', duration: 1627, thumbUrls: { webp: { '320x180': 'https://nlt05.gay.cool/f/1/b/f1b09d77a2e23f4b4696d97169614099/thumbs/320x180/25.webp', '480x270': 'https://nlt05.gay.cool/f/1/b/f1b09d77a2e23f4b4696d97169614099/thumbs/480x270/25.webp' } }, previewUrl: 'https://nlp01.gay.cool/f/1/b/f1b09d77a2e23f4b4696d97169614099/preview/video.mp4' },
+  { id: '375132285', title: 'Viktor Rom and Jordan Fox bareback blue-haired bottom in bedroom threesome', duration: 800, quality: '1080', thumbUrls: { webp: { '320x180': 'https://nlt03.gay.cool/5/f/b/5fbcdd007476cd0a1e9c85abc9fc0042/thumbs/320x180/1.webp', '480x270': 'https://nlt03.gay.cool/5/f/b/5fbcdd007476cd0a1e9c85abc9fc0042/thumbs/480x270/1.webp' } }, previewUrl: 'https://nlp04.gay.cool/5/f/b/5fbcdd007476cd0a1e9c85abc9fc0042/preview/video.mp4' },
+];

package/types/index.d.ts

@@ -49,6 +49,7 @@ export * from './navigation-items.d.ts';
 export * from './link-item.d.ts';
 export * from './fluid-player.d.ts';
 export * from './chips-item.d.ts';
+export * from './library-feed.d.ts';
 export * from './nav-link-item.d.ts';
 export * from './paginated-response.d.ts';
 export * from './request-pagination.d.ts';

package/types/library-feed.d.ts

@@ -0,0 +1,34 @@
+import type { IChipsItem } from './chips-item';
+import type { IVideoCard } from './video-card';
+
+/** Счётчик в строке под тегами: «17», «128.4K followers», «Updated 04.06.2026». */
+export interface ILibraryFeedMeta {
+  icon?: string
+  text: string
+}
+
+/**
+ * Блок одной подписки в «Библиотеке». Модели, каналы и категории отличаются только
+ * составом шапки, поэтому страница приводит их к этой форме, а вёрстка одна.
+ */
+export interface ILibraryFeedItem {
+  guid: string
+  title: string
+  /** Ссылка на саму сущность */
+  to: string
+  /** Нет — вместо картинки рисуются инициалы */
+  avatarUrl?: string
+  /** Только у моделей */
+  country?: {
+    name: string
+    title: string
+  }
+  tags?: IChipsItem[]
+  /** Роликов с прошлого захода: плашка «N new» и порядок в сортировке «сначала новые». 0 — плашки нет */
+  newCount: number
+  meta: ILibraryFeedMeta[]
+  videosCount: number
+  /** Подпись над лентой: «Latest» / «Top this week». Нет — лента без подписи */
+  feedTitle?: string
+  videos: IVideoCard[]
+}