feat: add collection favorite button and delete button if own collection

fix: private collection loading
fix: wrong lists bar percentages

app/components/CollectionInfo/CollectionInfoControls.tsx

@@ -0,0 +1,72 @@
+"use client";
+import { Card, Button } from "flowbite-react";
+import { useState } from "react";
+import { useUserStore } from "#/store/auth";
+import { ENDPOINTS } from "#/api/config";
+import { useRouter } from "next/navigation";
+
+export const CollectionInfoControls = (props: {
+  isFavorite: boolean;
+  id: number;
+  authorId: number;
+  isPrivate: boolean;
+}) => {
+  const [isFavorite, setIsFavorite] = useState(props.isFavorite);
+  const userStore = useUserStore();
+  const router = useRouter();
+
+  async function _addToFavorite() {
+    if (userStore.user) {
+      setIsFavorite(!isFavorite);
+      if (isFavorite) {
+        fetch(
+          `${ENDPOINTS.collection.favoriteCollections}/delete/${props.id}?token=${userStore.token}`
+        );
+      } else {
+        fetch(
+          `${ENDPOINTS.collection.favoriteCollections}/add/${props.id}?token=${userStore.token}`
+        );
+      }
+    }
+  }
+
+  async function _deleteCollection() {
+    if (userStore.user) {
+      fetch(
+        `${ENDPOINTS.collection.delete}/${props.id}?token=${userStore.token}`
+      );
+      router.push("/collections");
+    }
+  }
+
+  return (
+    <Card className="w-full h-fit ">
+      <Button color={"blue"} onClick={() => _addToFavorite()}>
+        <span
+          className={`iconify w-6 h-6 mr-2 ${
+            isFavorite ? "mdi--heart" : "mdi--heart-outline"
+          }`}
+        ></span>
+        {!isFavorite ? "Добавить в избранное" : "Убрать из избранного"}
+      </Button>
+      {props.isPrivate && (
+        <p>Это приватная коллекция, доступ к ней имеете только вы</p>
+      )}
+      {userStore.user && userStore.user.id == props.authorId && (
+        <div className="flex flex-wrap gap-2">
+          <Button color={"blue"} className="w-full sm:max-w-64">
+            <span className={`iconify w-6 h-6 mr-2 mdi--pencil`}></span>{" "}
+            Редактировать
+          </Button>
+          <Button
+            color={"red"}
+            className="w-full sm:max-w-64"
+            onClick={() => _deleteCollection()}
+          >
+            <span className={`iconify w-6 h-6 mr-2 mdi--trash`}></span> Удалить
+          </Button>
+        </div>
+      )}
+    </Card>
+  );
+};