too many changes, I got tired to commit it properly

.env.development

@@ -1,2 +1,4 @@
 NEXT_PUBLIC_API_URL=https://api.hikka.io
-API_URL=https://api.hikka.io
+API_URL=https://api.hikka.io
+SITE_URL=http://localhost:3000
+NEXT_PUBLIC_SITE_URL=http://localhost:3000

.env.production

@@ -1,2 +1,4 @@
 NEXT_PUBLIC_API_URL=https://api.hikka.io
-API_URL=http://127.0.0.1:8888
+API_URL=http://127.0.0.1:8888
+SITE_URL=https://hikka.io
+NEXT_PUBLIC_SITE_URL=https://hikka.io

app/(api)/auth/activate/[token]/route.ts

@@ -10,7 +10,7 @@ export async function GET(
     { params: { token } }: { params: { token: string } },
 ) {
     try {
-        const res = await activation({ token });
+        const res = await activation({ params: { token } });
         cookies().set('auth', res.secret);
     } catch (e) {
         if ('code' in (e as API.Error)) {

app/(api)/auth/google/route.ts

@@ -10,8 +10,10 @@ export async function GET(request: Request) {
         const { searchParams } = new URL(request.url);
         const code = searchParams.get('code');
         const res = await loginOAuth({
-            code: String(code),
-            provider: 'google',
+            params: {
+                code: String(code),
+                provider: 'google',
+            },
         });
 
         cookies().set('auth', res.secret, {

app/(pages)/(content)/anime/(animeList)/components/anime-list-navbar/_components/search.tsx

@@ -7,7 +7,6 @@ import { usePathname, useRouter, useSearchParams } from 'next/navigation';
 import { Input } from '@/components/ui/input';
 import createQueryString from '@/utils/createQueryString';
 
-
 const Search = () => {
     const router = useRouter();
     const pathname = usePathname();

app/(pages)/(content)/anime/(animeList)/components/anime-list/anime-list.tsx

@@ -1,6 +1,7 @@
 'use client';
 
 import * as React from 'react';
+import { FC } from 'react';
 
 import AnimeCard from '@/app/(pages)/(content)/components/anime-card';
 import FiltersNotFound from '@/components/filters/components/filters-not-found';
@@ -9,7 +10,6 @@ import Block from '@/components/ui/block';
 import Pagination from '@/components/ui/pagination';
 import Stack from '@/components/ui/stack';
 import useAnimeCatalog from '@/services/hooks/anime/useAnimeCatalog';
-import useAuth from '@/services/hooks/auth/useAuth';
 
 import { useNextPage, useUpdatePage } from './anime-list.hooks';
 import AnimeListSkeleton from './components/anime-list-skeleton';
@@ -18,16 +18,13 @@ interface Props {
     searchParams: Record<string, string>;
 }
 
-const AnimeList = ({ searchParams }: Props) => {
-    const { auth } = useAuth();
-
+const AnimeList: FC<Props> = ({ searchParams }) => {
     const page = searchParams.page;
     const iPage = searchParams.iPage;
 
     const dataKeys = {
         page: Number(page),
         iPage: Number(iPage),
-        auth,
     };
 
     const {

app/(pages)/(content)/anime/(animeList)/layout.tsx

@@ -1,4 +1,4 @@
-import { ReactNode } from 'react';
+import { FC, ReactNode } from 'react';
 
 import Filters from '@/components/filters/anime-filters';
 import Block from '@/components/ui/block';
@@ -10,7 +10,7 @@ interface Props {
     children: ReactNode;
 }
 
-const AnimeListLayout = async ({ children }: Props) => {
+const AnimeListLayout: FC<Props> = async ({ children }) => {
     return (
         <div>
             <div className="grid grid-cols-1 justify-center lg:grid-cols-[1fr_25%] lg:items-start lg:justify-between lg:gap-16">

app/(pages)/(content)/anime/(animeList)/page.tsx

@@ -1,12 +1,14 @@
+import { FC } from 'react';
+
 import { redirect } from 'next/navigation';
 
 import AnimeList from './components/anime-list';
 
-const AnimeListPage = ({
-    searchParams,
-}: {
+interface Props {
     searchParams: Record<string, string>;
-}) => {
+}
+
+const AnimeListPage: FC<Props> = ({ searchParams }) => {
     const page = searchParams.page;
 
     if (!page) {

app/(pages)/(content)/anime/[slug]/(animeDetails)/comments/page.tsx

@@ -4,7 +4,6 @@ import { HydrationBoundary, dehydrate } from '@tanstack/react-query';
 
 import Comments from '@/components/comments/comments';
 import getComments from '@/services/api/comments/getComments';
-import { getCookie } from '@/utils/actions';
 import _generateMetadata from '@/utils/generateMetadata';
 import getQueryClient from '@/utils/getQueryClient';
 
@@ -26,24 +25,25 @@ interface Props {
 }
 
 const AnimeCommentsPage = async ({ params: { slug } }: Props) => {
-    const queryClient = getQueryClient();
-    const auth = await getCookie('auth');
+    const queryClient = await getQueryClient();
 
     await queryClient.prefetchInfiniteQuery({
         initialPageParam: 1,
-        queryKey: ['comments', slug, 'anime', { auth }],
-        queryFn: ({ pageParam }) =>
+        queryKey: ['comments', slug, 'anime'],
+        queryFn: ({ pageParam, meta }) =>
             getComments({
-                slug,
-                content_type: 'anime',
+                params: {
+                    slug,
+                    content_type: 'anime',
+                },
                 page: pageParam,
-                auth,
+                auth: meta?.auth,
             }),
     });
 
     return (
         <HydrationBoundary state={dehydrate(queryClient)}>
-            <Comments auth={auth} slug={slug} content_type="anime" />
+            <Comments slug={slug} content_type="anime" />
         </HydrationBoundary>
     );
 };

app/(pages)/(content)/anime/[slug]/components/actions/actions.tsx

@@ -1,28 +1,30 @@
+'use client';
+
+import { FC } from 'react';
+
+import { useParams } from 'next/navigation';
+
 import WatchListButton from '@/components/watchlist-button';
-import { getCookie } from '@/utils/actions';
+import useSession from '@/services/hooks/auth/useSession';
 
+import CommentsButton from './components/comments-button';
 import WatchStats from './components/watch-stats';
 
-interface Props {
-    anime?: API.AnimeInfo;
-}
-
-const Actions = async ({ anime }: Props) => {
-    if (!anime) {
-        return null;
-    }
 
-    const auth = await getCookie('auth');
+const Actions: FC = () => {
+    const params = useParams();
+    const { user } = useSession();
 
     return (
         <div className="flex flex-col gap-12">
             <div className="flex flex-col gap-4">
                 <WatchListButton
-                    disabled={!auth}
+                    disabled={!user}
                     additional
-                    slug={String(anime.slug)}
+                    slug={String(params.slug)}
                 />
                 <WatchStats />
+                <CommentsButton />
             </div>
         </div>
     );

app/(pages)/(content)/anime/[slug]/components/actions/components/comments-button.tsx

@@ -0,0 +1,38 @@
+'use client';
+
+import React from 'react';
+import IconamoonCommentFill from '~icons/iconamoon/comment-fill';
+
+import Link from 'next/link';
+import { useParams } from 'next/navigation';
+
+import { Button } from '@/components/ui/button';
+import useAnimeInfo from '@/services/hooks/anime/useAnimeInfo';
+import getDeclensionWord from '@/utils/getDeclensionWord';
+
+
+const COMMENT_DECLENSIONS: [string, string, string] = [
+    'коментар',
+    'коментарі',
+    'коментарів',
+];
+
+const CommentsButton = () => {
+    const params = useParams();
+    const { data: anime } = useAnimeInfo({ slug: String(params.slug) });
+
+    return (
+        <Button variant="outline" asChild>
+            <Link href={`/anime/${params.slug}/comments`}>
+                <IconamoonCommentFill />
+                {anime?.comments_count || 0}{' '}
+                {getDeclensionWord(
+                    anime?.comments_count || 0,
+                    COMMENT_DECLENSIONS,
+                )}
+            </Link>
+        </Button>
+    );
+};
+
+export default CommentsButton;

app/(pages)/(content)/anime/[slug]/components/actions/components/watch-stats.tsx

@@ -1,5 +1,7 @@
 'use client';
 
+import React from 'react';
+
 import { useParams } from 'next/navigation';
 
 import H3 from '@/components/typography/h3';
@@ -11,6 +13,7 @@ import useAnimeInfo from '@/services/hooks/anime/useAnimeInfo';
 import useAddWatch from '@/services/hooks/watch/useAddWatch';
 import useWatch from '@/services/hooks/watch/useWatch';
 
+
 const WatchStats = () => {
     const params = useParams();
 
@@ -43,13 +46,15 @@ const WatchStats = () => {
             case 'decrease':
                 addToList({
                     status,
+                    rewatches: watch?.rewatches,
                     score: watch!.score,
                     episodes: watch?.episodes ? watch.episodes - 1 : 0,
                 });
                 break;
             case 'increase':
                 addToList({
                     status,
+                    rewatches: watch?.rewatches,
                     score: watch!.score,
                     episodes: watch?.episodes ? watch.episodes + 1 : 1,
                 });

app/(pages)/(content)/anime/[slug]/components/characters/characters.tsx

@@ -1,6 +1,6 @@
 'use client';
 
-import React from 'react';
+import React, { FC } from 'react';
 
 import { useParams } from 'next/navigation';
 
@@ -14,7 +14,7 @@ interface Props {
     extended?: boolean;
 }
 
-const Characters = ({ extended }: Props) => {
+const Characters: FC<Props> = ({ extended }) => {
     const params = useParams();
     const { fetchNextPage, hasNextPage, isFetchingNextPage, ref } =
         useCharacters({ slug: String(params.slug) });

app/(pages)/(content)/anime/[slug]/components/characters/components/main-characters.tsx

@@ -1,5 +1,7 @@
 'use client';
 
+import { FC } from 'react';
+
 import { useParams } from 'next/navigation';
 
 import Block from '@/components/ui/block';
@@ -13,7 +15,7 @@ interface Props {
     extended?: boolean;
 }
 
-const MainCharacters = ({ extended }: Props) => {
+const MainCharacters: FC<Props> = ({ extended }) => {
     const params = useParams();
     const { list, fetchNextPage, hasNextPage, isFetchingNextPage, ref } =
         useCharacters({ slug: String(params.slug) });

app/(pages)/(content)/anime/[slug]/components/characters/components/other-characters.tsx

@@ -1,5 +1,7 @@
 'use client';
 
+import { FC } from 'react';
+
 import { useParams } from 'next/navigation';
 
 import CharacterCard from '@/app/(pages)/(content)/components/character-card';
@@ -12,7 +14,7 @@ interface Props {
     extended?: boolean;
 }
 
-const OtherCharacters = ({ extended }: Props) => {
+const OtherCharacters: FC<Props> = ({ extended }) => {
     const params = useParams();
     const { list, fetchNextPage, hasNextPage, isFetchingNextPage, ref } =
         useCharacters({ slug: String(params.slug) });