From ff91e96fc66ff1752452330fc1a9d846fa509b41 Mon Sep 17 00:00:00 2001
From: robonen <robonenandrew@gmail.com>
Date: Sun, 15 Jun 2025 15:39:15 +0700
Subject: [PATCH] feat(posts): add Post entity with types and UI components for
 content, meta, and title

---
 src/entities/Post/index.ts           |  4 +++
 src/entities/Post/types.ts           |  9 ++++++
 src/entities/Post/ui/PostContent.vue |  5 +++
 src/entities/Post/ui/PostMeta.vue    | 48 ++++++++++++++++++++++++++++
 src/entities/Post/ui/PostTitle.vue   | 15 +++++++++
 5 files changed, 81 insertions(+)
 create mode 100644 src/entities/Post/index.ts
 create mode 100644 src/entities/Post/types.ts
 create mode 100644 src/entities/Post/ui/PostContent.vue
 create mode 100644 src/entities/Post/ui/PostMeta.vue
 create mode 100644 src/entities/Post/ui/PostTitle.vue

diff --git a/src/entities/Post/index.ts b/src/entities/Post/index.ts
new file mode 100644
index 0000000..768e128
--- /dev/null
+++ b/src/entities/Post/index.ts
@@ -0,0 +1,4 @@
+export * from './types';
+export { default as PostContent } from './ui/PostContent.vue';
+export { default as PostMeta } from './ui/PostMeta.vue';
+export { default as PostTitle } from './ui/PostTitle.vue';
diff --git a/src/entities/Post/types.ts b/src/entities/Post/types.ts
new file mode 100644
index 0000000..1db6558
--- /dev/null
+++ b/src/entities/Post/types.ts
@@ -0,0 +1,9 @@
+export interface Post {
+  id: number;
+  title: string;
+  content_short: string;
+  content_full: string;
+  created_at: string;
+  cover: string;
+  tags: string[];
+}
diff --git a/src/entities/Post/ui/PostContent.vue b/src/entities/Post/ui/PostContent.vue
new file mode 100644
index 0000000..1b83f94
--- /dev/null
+++ b/src/entities/Post/ui/PostContent.vue
@@ -0,0 +1,5 @@
+<template>
+  <p class="text-base">
+    <slot />
+  </p>
+</template>
diff --git a/src/entities/Post/ui/PostMeta.vue b/src/entities/Post/ui/PostMeta.vue
new file mode 100644
index 0000000..33487ec
--- /dev/null
+++ b/src/entities/Post/ui/PostMeta.vue
@@ -0,0 +1,48 @@
+<script lang="ts">
+export interface PostMetaProps {
+  /**
+   * Post creation date in ISO format.
+   */
+  createdAt: string;
+
+  /**
+   * Post content.
+   */
+  content: string;
+
+  /**
+   * Post comments length.
+   */
+  commentsLength: number;
+}
+</script>
+
+<script setup lang="ts">
+import { computed } from 'vue';
+import { ChatIcon, ClockIcon } from '@/shared/icons';
+import { calculateReadingTime, formatDate, pluralize } from '@/shared/utils';
+
+const { createdAt, content, commentsLength } = defineProps<PostMetaProps>();
+
+const readingTime = computed(() => calculateReadingTime(content));
+const formattedDate = computed(() => formatDate(createdAt));
+const formattedComments = computed(() => pluralize(commentsLength, ['комментарий', 'комментария', 'комментариев']));
+</script>
+
+<template>
+  <ul class="flex items-center gap-x-4 text-foreground-muted text-sm">
+    <li class="flex items-center gap-x-1" aria-label="Дата публикации">
+      {{ formattedDate }}
+    </li>
+    <span class="size-1 rounded-full bg-foreground-muted" aria-hidden="true" />
+    <li class="flex items-center gap-x-1" aria-label="Длительность чтения">
+      <ClockIcon class="size-5" />
+      {{ readingTime }} мин
+    </li>
+    <span class="size-1 rounded-full bg-foreground-muted" aria-hidden="true" />
+    <li class="flex items-center gap-x-1" aria-label="Количество комментариев">
+      <ChatIcon class="size-5" />
+      {{ commentsLength }} {{ formattedComments }}
+    </li>
+  </ul>
+</template>
diff --git a/src/entities/Post/ui/PostTitle.vue b/src/entities/Post/ui/PostTitle.vue
new file mode 100644
index 0000000..9265aab
--- /dev/null
+++ b/src/entities/Post/ui/PostTitle.vue
@@ -0,0 +1,15 @@
+<script lang="ts">
+export interface PostTitleProps {
+  as?: keyof HTMLElementTagNameMap;
+}
+</script>
+
+<script setup lang="ts">
+const { as: tag = 'h1' } = defineProps<PostTitleProps>();
+</script>
+
+<template>
+  <component :is="tag" class="text-xl font-semibold">
+    <slot />
+  </component>
+</template>