Merge pull request #7 from getz-devs/cleanup

cleanup before final v1.0
getz-devs · Jul 28, 2024 · b14ef3c · b14ef3c
2 parents 3ba5f5b + 5e16851
commit b14ef3c
Show file tree

Hide file tree

Showing 30 changed files with 279 additions and 552 deletions.
diff --git a/.eslintrc.cjs b/.eslintrc.cjs
@@ -11,8 +11,7 @@ module.exports = {
         project: './tsconfig.json',
     },
     rules: {
-        // 'no-multispaces': 'off',
-        // 'no-trailing-spaces': 'on',
+        'no-console': 'off',
         'react/jsx-indent-props': 'off',
         'linebreak-style': 0,
         'react/react-in-jsx-scope': 'off',

diff --git a/next.config.mjs b/next.config.mjs
@@ -6,6 +6,10 @@ const withBundleAnalyzer = bundleAnalyzer({
 
 export default withBundleAnalyzer({
     reactStrictMode: false,
+    compiler: {
+        // Remove console logs only in production, excluding error logs
+        removeConsole: process.env.NODE_ENV === "production" ? { exclude: ["error"] } : false
+    },
     eslint: {
         ignoreDuringBuilds: true,
     },

diff --git a/src/app/advSearch/page.tsx b/src/app/advSearch/page.tsx
@@ -3,10 +3,11 @@
 import { Suspense } from 'react';
 import { useSearchParams } from 'next/navigation';
 import VerticalListSearch from '@/src/components/VerticalList/VerticalListSearch';
+import { Loading } from '@/src/components/Loading/Loading';
 
 export default function SearchBar() {
     return (
-        <Suspense fallback={<div>Loading...</div>}>
+        <Suspense fallback={<Loading />}>
             <SearchBarContent />
         </Suspense>
     );
@@ -16,8 +17,6 @@ function SearchBarContent() {
     const searchParams = useSearchParams();
     const search = searchParams.get('q');
 
-    // URL -> `/dashboard?search=my-project`
-    // `search` -> 'my-project'
     return (
         <div>
             <div>

diff --git a/src/app/book/[id]/edit/page.tsx b/src/app/book/[id]/edit/page.tsx
@@ -17,6 +17,7 @@ import { useEffect, useState } from 'react';
 import { useForm } from '@mantine/form';
 import { useAuthContext } from '@/src/firebase/context';
 import { Book, Bookshelf, BookUpdate } from '@/src/types/api';
+import { Loading } from '@/src/components/Loading/Loading';
 
 const API_HOST = process.env.NEXT_PUBLIC_API_HOST || 'http://localhost:8080/api';
 
@@ -64,13 +65,12 @@ export default function SearchBar() {
 
                 const dataBookshelves: Bookshelf[] | null = await resBookshelves.json();
                 if (dataBookshelves != null) {
-                    console.log('resBookshelves.json() != null');
-                    console.log(resBookshelves.json());
+                    // console.log('resBookshelves.json() != null');
+                    // console.log(resBookshelves.json());
                     setBookshelves(dataBookshelves);
                 }
 
                 // получаем инфо о полке
-
                 // проверка что айди полки не пустай строка
 
                 if (!data.bookshelf_id) {
@@ -102,6 +102,7 @@ export default function SearchBar() {
     // Initialize the form with useForm hook
     const form = useForm<BookUpdate>({
         initialValues: {
+            // id: id, - also need to specify the id (TODO: fix the API)
             title: '',
             author: '',
             description: '',
@@ -113,8 +114,7 @@ export default function SearchBar() {
     const handleSubmit = async (values: BookUpdate) => {
         // Filter out empty fields
         const nonEmptyFields = Object.fromEntries(
-            // eslint-disable-next-line @typescript-eslint/no-unused-vars
-            Object.entries(values).filter(([_, v]) => v !== '' && v !== undefined)
+            Object.entries(values).filter(([, v]) => v !== '' && v !== undefined)
         );
 
         // If no non-empty fields, do not make the request
@@ -149,7 +149,7 @@ export default function SearchBar() {
 
     // console.log(bookshelves);
     if (loading) {
-        return <div>Loading...</div>;
+        return <Loading />;
     }
 
     if (book === null) {
@@ -159,13 +159,10 @@ export default function SearchBar() {
     return (
         <Container size="sm">
             <Card shadow="sm" padding="lg" radius="md" withBorder>
-                {/* <Card.Section> */}
                 <Text fw={700} size="lg">
                     Текущие значения
                 </Text>
                 <Space h="md" />
-                {/* </Card.Section> */}
-                {/* <Card.Section> */}
                 <Grid columns={2}>
                     <Grid.Col span={1}>
                         <Text fw={700} size="lg">
@@ -240,11 +237,6 @@ export default function SearchBar() {
                             placeholder="Enter cover image URL"
                             {...form.getInputProps('cover_image')}
                         />
-                        {/* <TextInput
-                            label="Bookshelf ID"
-                            placeholder="Enter bookshelf ID"
-                            {...form.getInputProps('bookshelf_id')}
-                        /> */}
                         <Select
                             label="Bookshelf"
                             placeholder="Pick a bookshelf"

diff --git a/src/app/book/[id]/page.tsx b/src/app/book/[id]/page.tsx
@@ -1,10 +1,13 @@
 'use client';
 
 import { useParams } from 'next/navigation';
-import { Card, Container, Grid, Image, Text } from '@mantine/core';
+import { Button, Card, Container, Grid, Image, SimpleGrid, Stack, Text } from '@mantine/core';
 import { useEffect, useState } from 'react';
+import Link from 'next/link';
 import { useAuthContext } from '@/src/firebase/context';
 import { Book, Bookshelf } from '@/src/types/api';
+import { Loading } from '@/src/components/Loading/Loading';
+import { ErrorCard } from '@/src/components/ErrorCard/ErrorCard';
 
 const API_HOST = process.env.NEXT_PUBLIC_API_HOST || 'http://localhost:8080/api';
 
@@ -40,7 +43,6 @@ export default function SearchBar() {
                 setBooks(data);
 
                 // получаем инфо о полке
-
                 // проверка что айди полки не пустай строка
 
                 if (!data.bookshelf_id) {
@@ -68,24 +70,22 @@ export default function SearchBar() {
 
         fetchBookshelves();
     }, [user]);
-    // console.log(bookshelves);
+
     if (loading) {
-        return <div>Loading...</div>;
+        return <Loading />;
     }
 
     if (book === null) {
-        return <div>Book not foung</div>;
+        return <ErrorCard error="Book not found" desc="Book not found for this id" />;
     }
 
     return (
         <Container size="md">
-            <Grid>
-                <Grid.Col span={6}>
-                    <Card shadow="sm" padding={0} radius="md">
-                        <Image src={book?.cover_image} alt="Book Cover" />
-                    </Card>
-                </Grid.Col>
-                <Grid.Col span={6}>
+            <SimpleGrid cols={{ base: 1, sm: 2 }}>
+                <Card shadow="sm" padding={0} radius="md">
+                    <Image src={book?.cover_image} alt="Book Cover" />
+                </Card>
+                <Stack gap="md">
                     <Card shadow="sm" padding="lg" radius="md" withBorder>
                         <Grid columns={2}>
                             <Grid.Col span={1}>
@@ -110,7 +110,7 @@ export default function SearchBar() {
                                 </Text>
                             </Grid.Col>
                             <Grid.Col span={1}>
-                                <Text>{book?.description}</Text>
+                                <Text>{book?.description || 'Описание отсутствует'}</Text>
                             </Grid.Col>
                             <Grid.Col span={1}>
                                 <Text fw={700} size="lg">
@@ -121,8 +121,6 @@ export default function SearchBar() {
                                 <Text>{book?.created_at}</Text>
                             </Grid.Col>
 
-                            {/* {bookshelf && ( */}
-                            {/* <> */}
                             <Grid.Col span={1}>
                                 <Text fw={700} size="lg">
                                     Полка
@@ -131,12 +129,19 @@ export default function SearchBar() {
                             <Grid.Col span={1}>
                                 <Text>{bookshelf?.name || 'Книга не на полке'}</Text>
                             </Grid.Col>
-                            {/* </> */}
-                            {/* )} */}
                         </Grid>
                     </Card>
-                </Grid.Col>
-            </Grid>
+                    <Button
+                        component={Link}
+                        href={`/book/${id}/edit`}
+                        color="blue"
+                        fullWidth
+                        radius="md"
+                    >
+                        Edit Book
+                    </Button>
+                </Stack>
+            </SimpleGrid>
         </Container>
     );
 }
diff --git a/src/app/collections/[bookshelfId]/page.tsx b/src/app/collections/[bookshelfId]/page.tsx
@@ -1,7 +1,5 @@
 'use client';
 
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
-import { Card, Stack, Image, Group, Text, Badge, Button } from '@mantine/core';
 import VerticalList from '@/src/components/VerticalList/VerticalList';
 
 interface VerticalListProps {

diff --git a/src/app/collections/page.tsx b/src/app/collections/page.tsx
@@ -1,11 +1,11 @@
 'use client';
 
 import { useState, useEffect } from 'react';
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
-import { Card, Stack, Image, Group, Text, Badge, Button } from '@mantine/core';
+import { Card, Group, Text, Button } from '@mantine/core';
 import Link from 'next/link';
 import { Bookshelf } from '@/src/types/api';
 import { useAuthContext } from '@/src/firebase/context';
+import { Loading } from '@/src/components/Loading/Loading';
 
 const API_HOST = process.env.NEXT_PUBLIC_API_HOST || 'http://localhost:8080/api';
 
@@ -38,35 +38,10 @@ export default function AllBookshelvesPage() {
     }, [user]);
 
     if (loading) {
-        return <div>Loading...</div>;
+        return <Loading />;
     }
 
     return (
-        // <div>
-        //     <Card shadow="sm" padding="lg" radius="md" withBorder style={{ width: '60%' }}>
-        //         <Group justify="space-between" mt="" mb="xs">
-        //             <Text fw={500}>Collection Name</Text>
-        //         </Group>
-
-        //         <Text size="sm" c="dimmed">
-        //             Last update: 14.01.2023
-        //         </Text>
-
-        //         <Button
-        //             color="blue"
-        //             fullWidth
-        //             mt="md"
-        //             radius="md"
-        //             component={Link}
-        //             // href={{ pathname: '/collections', query: { q: 1 } }}
-        //             // eslint-disable-next-line react/jsx-curly-brace-presence, @typescript-eslint/quotes
-        //             href={`/collections/1`}
-        //         >
-        //             View all books
-        //         </Button>
-        //     </Card>
-        // </div>
-
         <div>
             {bookshelves.map((shelf) => (
                 <Card shadow="sm" padding="lg" radius="md" withBorder style={{ width: '60%' }}>

diff --git a/src/app/page.tsx b/src/app/page.tsx
@@ -8,7 +8,6 @@ export default function HomePage() {
             <AllBooks />
             <Collections />
             <AddButton />
-            {/* <ColorSchemeToggle /> */}
         </>
     );
 }
diff --git a/src/app/search/page.tsx b/src/app/search/page.tsx
@@ -2,13 +2,14 @@
 
 import { Suspense } from 'react';
 import { useSearchParams } from 'next/navigation';
-import { Button } from '@mantine/core';
+import { Button, Center } from '@mantine/core';
 import Link from 'next/link';
 import VerticalListSearch from '@/src/components/VerticalList/VerticalListSearch';
+import { Loading } from '@/src/components/Loading/Loading';
 
 export default function SearchBar() {
     return (
-        <Suspense fallback={<div>Loading...</div>}>
+        <Suspense fallback={<Loading />}>
             <SearchBarContent />
         </Suspense>
     );
@@ -18,16 +19,14 @@ function SearchBarContent() {
     const searchParams = useSearchParams();
     const search = searchParams.get('q');
 
-    // URL -> `/dashboard?search=my-project`
-    // `search` -> 'my-project'
     return (
         <div>
-            <div>
-                <VerticalListSearch ISBN={search}></VerticalListSearch>
-            </div>
-            <Button component={Link} href={{ pathname: '/advSearch', query: { q: search } }}>
-                Здесь нет моей книги
-            </Button>
+            <VerticalListSearch ISBN={search}></VerticalListSearch>
+            <Center>
+                <Button component={Link} href={{ pathname: '/advSearch', query: { q: search } }}>
+                    Advanced Search
+                </Button>
+            </Center>
         </div>
     );
 }
diff --git a/src/components/AppFrame/AppFrame.module.css b/src/components/AppFrame/AppFrame.module.css
@@ -7,9 +7,6 @@
     font-size: 26px;
     font-weight: 700;
     color: var(--mantine-color-blue-8);
-    /* background-color: var(--mantine-color-blue-1);
-    border-radius: var(--mantine-radius-xl);
-    margin: 5px; */
 }
 
 .link {