<!-- Подписки на моделей: аватар, параметры (тип/телосложение/этнос), лента последних роликов. Данные пока заглушка -->
<template>
  <div class="_page _container">
    <UiBreadcrumbs
      :items="breadcrumbs"
      class="_breadcrumbs"
    />

    <LibraryFollows
      :items="items"
      :title="t('library.my_models')"
      icon="user"
    />
  </div>
</template>

<script setup lang="ts">
import { getLibraryModelsStub } from '../../stubs/library-follows';
import { convertString, formatDate } from '../../runtime';
import type { IBreadcrumbItem, ILibraryFeedItem } from '../../types';

const { t } = useI18n();
const { generateLink } = useGenerateLink();

const items = computed<ILibraryFeedItem[]>(() => getLibraryModelsStub().map(model => ({
  guid: model.guid,
  title: model.title,
  to: generateLink(`/models/${convertString().toSlug(model.title)}`),
  avatarUrl: model.avatarUrl,
  country: model.country,
  parameters: [model.guyType, model.bodyBuild, model.ethnicity],
  age: `${model.age} ${t('yo')}`,
  newCount: model.newCount,
  meta: [
    { icon: 'video-camera', text: String(model.videosCount) },
    { icon: 'date', text: t('library.updated_at', { date: formatDate(model.lastVideoAddedAt) }), desktopOnly: true },
  ],
  videosCount: model.videosCount,
  feedTitle: t('library.latest'),
  openText: t('library.open_profile'),
  videos: model.videos,
})));

useNoindex();

const { brandName } = useAppConfig();

useHead(() => ({
  title: `${t('library.my_models')} — ${brandName}`,
}));

const breadcrumbs = [
  {
    name: `${t('navigation.main')}`,
    to: '/',
  },
  {
    name: `${t('navigation.library')}`,
    to: '/library',
  },
  {
    name: `${t('library.my_models')}`,
  },
] as IBreadcrumbItem[];
</script>
