feat: add view of release name, description, image, author, releases in lists and releases in collection

app/components/CollectionInfo/CollectionInfo.Basics.tsx

@@ -0,0 +1,47 @@
+import { Card, Button, Avatar } from "flowbite-react";
+import { useState } from "react";
+import { unixToDate } from "#/api/utils";
+import Link from "next/link";
+
+export const CollectionInfoBasics = (props: {
+  image: string;
+  title: string;
+  description: string;
+  authorAvatar: string;
+  authorLogin: string;
+  authorId: number;
+  creationDate: number;
+  updateDate: number;
+}) => {
+  return (
+    <Card className="w-full max-w-full lg:max-w-[50%]">
+      <div className="flex flex-col items-end justify-between sm:items-center sm:flex-row">
+        <div className="flex flex-col gap-1">
+          <p>создана: {unixToDate(props.creationDate, "full")}</p>
+          <p>обновлена: {unixToDate(props.updateDate, "full")}</p>
+        </div>
+        <Link href={`/profile/${props.authorId}`}>
+          <Avatar
+            img={props.authorAvatar}
+            rounded={true}
+            bordered={true}
+            size="md"
+            className="flex-row-reverse gap-2"
+          >
+            <div className="font-medium dark:text-white">
+              <div className="text-lg">{props.authorLogin}</div>
+              <div className="text-right text-gray-500">Автор</div>
+            </div>
+          </Avatar>
+        </Link>
+      </div>
+      <div className="min-w-full aspect-video">
+        <img src={props.image} className="w-full rounded-lg" />
+      </div>
+      <div className="flex flex-col gap-1">
+        <p className="text-xl font-bold">{props.title}</p>
+        <p className="whitespace-pre-wrap">{props.description}</p>
+      </div>
+    </Card>
+  );
+};