diff --git a/src/App/index.tsx b/src/App/index.tsx index 86179bb..a870f44 100644 --- a/src/App/index.tsx +++ b/src/App/index.tsx @@ -1,6 +1,5 @@ import React, { useState } from "react"; import { Route, Switch } from "wouter"; -import { BookListContextProvider } from "~/context"; import { Bookshelf } from "~/pages/Bookshelf"; import { BookView } from "~/pages/BookView"; @@ -24,19 +23,17 @@ export const App = () => { )} - - - - - - - - - - - - - + + + + + + + + + + + ); }; diff --git a/src/context.tsx b/src/context.tsx deleted file mode 100644 index a1cae71..0000000 --- a/src/context.tsx +++ /dev/null @@ -1,19 +0,0 @@ -import React from "react"; -import { useLibrary, UseLibraryReturnTuple } from "./hooks/useLibrary"; -import { BookT } from "./types/book"; - -export const BookListContext = React.createContext([ - {}, - (book: BookT) => {}, - [], -]); - -export const BookListContextProvider: React.FC = ({ children }) => { - const library = useLibrary(); - - return ( - - {children} - - ); -}; diff --git a/src/pages/BookView/index.tsx b/src/pages/BookView/index.tsx index c28d1c6..292d6dc 100644 --- a/src/pages/BookView/index.tsx +++ b/src/pages/BookView/index.tsx @@ -1,29 +1,52 @@ -import React, { MouseEventHandler, useContext, useEffect, useRef } from "react"; +import React, { MouseEventHandler, useState, useEffect, useRef } from "react"; import { Redirect, useRoute } from "wouter"; import styles from "./BookView.module.css"; -import { BookListContext } from "~/context"; import { usePagination } from "~/hooks/usePagination"; import { IPageProps } from "~/types/page"; import { useBookState } from "~/hooks/useBookState"; +import { BookT } from "~/types/book"; +import { API_URL } from "~/constants"; +import { validateResponse } from "~/utils/api"; export const BookView = ({ setLoading, loading }: IPageProps) => { useEffect(() => setLoading(true), []); + const [hasErr, setHasErr] = useState(false); + const [book, setBook] = useState(); + const [_, params] = useRoute("/:hash"); - const [books] = useContext(BookListContext); const contentRef = useRef(null); const pageContainerRef = useRef(null); const pageRef = useRef(null); + useEffect(() => { + if (params?.hash) { + (async () => { + try { + const res = await fetch(API_URL + "/book/" + params.hash); + if (!res.ok) throw new Error(res.status + " " + res.statusText); + + const book: unknown = await res.json(); + + if (validateResponse(book)) setBook(book); + } catch (err) { + if (process.env.NODE_ENV === "development") console.error(err); + setHasErr(true); + setLoading(false); + } + })(); + } + }, []); + const [pagesReady, goToPage, currentPage, pagesNumber] = usePagination( contentRef, pageContainerRef, pageRef, - books && loading ? params?.hash : undefined, - params?.hash && books && loading ? books[params.hash]?.content : undefined + book ? params?.hash : undefined, + params?.hash ? book?.content : undefined ); const currentPageRef = useRef(currentPage); @@ -68,35 +91,33 @@ export const BookView = ({ setLoading, loading }: IPageProps) => { } }; - if (books) { - if (params?.hash && params.hash in books) - return ( - <> -
-
-
-
-
-
-
- - - {currentPage + 1} / {pagesNumber} - - -
- - ); - return ; - } else return <>; + if (hasErr) return ; + + return ( + <> +
+
+
+
+
+
+
+ + + {currentPage + 1} / {pagesNumber} + + +
+ + ); }; diff --git a/src/pages/UploadForm/index.tsx b/src/pages/UploadForm/index.tsx index 820af34..ab9c05b 100644 --- a/src/pages/UploadForm/index.tsx +++ b/src/pages/UploadForm/index.tsx @@ -1,18 +1,15 @@ -import React, { useContext, useEffect, useState } from "react"; +import React, { useState } from "react"; import { useLocation } from "wouter"; import PlusIcon from "~/assets/plus.svg"; import styles from "./UploadForm.module.css"; import { submitFile, validateResponse, validState } from "~/utils/api"; -import { BookListContext } from "~/context"; import { IPageProps } from "~/types/page"; export const UploadForm = ({ setLoading }: IPageProps) => { const [error, setError] = useState(""); const [_, setLocation] = useLocation(); - const [__, saveBook] = useContext(BookListContext); - const processFile = async (file: File | undefined) => { try { if (validState(file)) { @@ -22,10 +19,7 @@ export const UploadForm = ({ setLoading }: IPageProps) => { const res = await submitFile(file); setLoading(false); - if (validateResponse(res)) { - saveBook(res); - setLocation("/"); - } + if (validateResponse(res)) setLocation("/"); } } catch (err) { setLoading(false);