diff --git a/next.config.js b/next.config.js index 658404a..dee0eb6 100644 --- a/next.config.js +++ b/next.config.js @@ -1,4 +1,99 @@ /** @type {import('next').NextConfig} */ -const nextConfig = {}; +const nextConfig = { + images: { + remotePatterns: [ + { + protocol: "https", + hostname: "archive.org", + port: "", + pathname: "/download/**", + }, + { + protocol: "https", + hostname: "covers.openlibrary.org", + port: "", + pathname: "/b/id/**", + }, + { + protocol: "https", + hostname: "images.isbndb.com", + port: "", + pathname: "/covers/**", + }, + { + protocol: "https", + hostname: "libgen.li", + port: "", + pathname: "/comicscovers/**", + }, + { + protocol: "https", + hostname: "libgen.li", + port: "", + pathname: "/comicscovers_repository/**", + }, + { + protocol: "https", + hostname: "libgen.li", + port: "", + pathname: "/covers/**", + }, + { + protocol: "https", + hostname: "libgen.li", + port: "", + pathname: "/editioncovers/**", + }, + { + protocol: "https", + hostname: "libgen.li", + port: "", + pathname: "/fictioncovers/**", + }, + { + protocol: "https", + hostname: "libgen.li", + port: "", + pathname: "/fictionruscovers/**", + }, + { + protocol: "https", + hostname: "libgen.li", + port: "", + pathname: "/magzcovers/**", + }, + { + protocol: "https", + hostname: "libgen.rs", + port: "", + pathname: "/covers/**", + }, + { + protocol: "https", + hostname: "libgen.rs", + port: "", + pathname: "/fictioncovers/**", + }, + { + protocol: "https", + hostname: "reader.zlibcdn.com", + port: "", + pathname: "/books/**", + }, + { + protocol: "https", + hostname: "static.1lib.sk", + port: "", + pathname: "/covers/books/**", + }, + { + protocol: "https", + hostname: "static.3lib.net", + port: "", + pathname: "/covers/books/**", + }, + ], + }, +}; module.exports = nextConfig; diff --git a/public/placeholder.avif b/public/placeholder.avif new file mode 100644 index 0000000..6cd571d Binary files /dev/null and b/public/placeholder.avif differ diff --git a/public/placeholder_dark.avif b/public/placeholder_dark.avif new file mode 100644 index 0000000..cfbf731 Binary files /dev/null and b/public/placeholder_dark.avif differ diff --git a/public/placeholder_light.avif b/public/placeholder_light.avif new file mode 100644 index 0000000..94172c3 Binary files /dev/null and b/public/placeholder_light.avif differ diff --git a/public/tevi.png b/public/tevi.png deleted file mode 100644 index ce44971..0000000 Binary files a/public/tevi.png and /dev/null differ diff --git a/src/components/Card/Card.module.css b/src/components/Card/Card.module.css index 4387e0c..da50a99 100644 --- a/src/components/Card/Card.module.css +++ b/src/components/Card/Card.module.css @@ -7,49 +7,50 @@ padding: 1rem; border-top: 0.14rem solid rgba(195, 195, 195); gap: 1rem; + color: white; } .cover { - flex-shrink: 0; - position: relative; - object-fit: cover; + object-fit: contain; overflow: hidden; - width: 128px; - height: 64px; + padding: 0; + min-width: 72px; + max-width: 72px; } .bookInfo { display: flex; flex-direction: column; - margin-left: 1rem; + margin-right: auto; row-gap: 0.6rem; } .title { font-size: 1.2em; - color: #ffffff; +} + +.true_title { + font-size: 1em; + color:rgb(181, 181, 181); + margin-top: -0.6rem; } .source { font-size: 1em; - color: #ffffff; + margin-top: auto; } .fileInfo { display: flex; flex-direction: column; - color: #ffffff; text-align: right; flex-shrink: 0; } .size { - color: #ffffff; font-size: 1em; - } .extension { - color: #ffffff; font-size: 0.9em; } \ No newline at end of file diff --git a/src/components/Card/Card.tsx b/src/components/Card/Card.tsx index a94f41a..7212779 100644 --- a/src/components/Card/Card.tsx +++ b/src/components/Card/Card.tsx @@ -1,20 +1,55 @@ "use client"; import styles from "./Card.module.css"; +import Image from "next/image"; +import ImageWithFallback from "../ImageWithFallback/ImageWithFallback"; type CardInterface = { id: string; title: string; + true_title: string; sources: string[]; size: string; extension: string; + description: string; + cover: string; }; -function Card({ id, title, sources, size, extension }: CardInterface) { +function Card({ + id, + title, + true_title, + sources, + size, + extension, + description, + cover, +}: CardInterface) { return (
+ {cover ? ( + + ) : ( + Placeholder image + )}
{title} + {true_title} {sources.join(" | ")}
diff --git a/src/components/ImageWithFallback/ImageWithFallback.tsx b/src/components/ImageWithFallback/ImageWithFallback.tsx new file mode 100644 index 0000000..0da6dad --- /dev/null +++ b/src/components/ImageWithFallback/ImageWithFallback.tsx @@ -0,0 +1,28 @@ +"use client"; +import React, { useState } from "react"; +import Image, { ImageProps } from "next/image"; + +interface ImageWithFallbackProps extends ImageProps { + fallbackSrc: string; +} + +// https://stackoverflow.com/a/66953317 +const ImageWithFallback = (props: ImageWithFallbackProps) => { + const { src, fallbackSrc, ...rest } = props; + const [imgSrc, setImgSrc] = useState(src); + // const [isUnoptimized, setIsUnoptimized] = useState(false); + + return ( + { + setImgSrc(fallbackSrc); + // setIsUnoptimized(true); + }} + // unoptimized={isUnoptimized} + /> + ); +}; + +export default ImageWithFallback; diff --git a/src/components/ImageWithFallback/index.js b/src/components/ImageWithFallback/index.js new file mode 100644 index 0000000..c74b6db --- /dev/null +++ b/src/components/ImageWithFallback/index.js @@ -0,0 +1,2 @@ +export * from "./ImageWithFallback"; +export { default } from "./ImageWithFallback"; diff --git a/src/components/SearchResultList/SearchResultList.tsx b/src/components/SearchResultList/SearchResultList.tsx index 9b5fe1a..5d1088a 100644 --- a/src/components/SearchResultList/SearchResultList.tsx +++ b/src/components/SearchResultList/SearchResultList.tsx @@ -45,9 +45,12 @@ function SearchResultList({ searchResults }: SearchResultListInterface) { key={book.id} id={book.id} title={book.title} + true_title={book.true_title} sources={book.sources} size={round(book.size / 1048576, 2).toFixed(1)} // to mebibytes extension={book.extension} + description={book.description} + cover={book.cover} /> ))}
diff --git a/src/data/book-data.ts b/src/data/book-data.ts index 7076cc7..e0d5f34 100644 --- a/src/data/book-data.ts +++ b/src/data/book-data.ts @@ -1,7 +1,10 @@ export interface Book { id: string; title: string; + true_title: string; sources: string[]; size: number; extension: string; + description: string; + cover: string; } diff --git a/src/lib/xata.ts b/src/lib/xata.ts index 27a81ac..94a7481 100644 --- a/src/lib/xata.ts +++ b/src/lib/xata.ts @@ -1,4 +1,4 @@ -// Generated by Xata Codegen 0.28.2. Please do not edit. +// Generated by Xata Codegen 0.28.3. Please do not edit. import { buildClient } from "@xata.io/client"; import type { BaseClientOptions, @@ -17,6 +17,8 @@ const tables = [ { name: "sources", type: "multiple" }, { name: "md5", type: "string" }, { name: "embeddings", type: "vector", vector: { dimension: 1024 } }, + { name: "description", type: "text", notNull: true, defaultValue: "" }, + { name: "cover", type: "string", notNull: true, defaultValue: "" }, ], }, ] as const;