diff --git a/CHANGELOG.md b/CHANGELOG.md index 288cfe8..4317e3a 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -5,6 +5,20 @@ All notable changes to this project will be documented in this file. The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html). +## [2.24.0] - Sep 28, 2024 + +### Changed + +- Use a utility function to return higher resolution images +- Stop using separate mobile and desktop review section components +- Made the similar books component fully responsive instead of relying on props + +### Fixed + +- Fix the series title not being centered in some browsers +- Fix some section titles not being the same color in dark mode +- Fix similar books titles being cut off on hover + ## [2.23.2] - Sep 21, 2024 ### Fixed diff --git a/README.md b/README.md index 3ccf910..31359bd 100644 --- a/README.md +++ b/README.md @@ -41,7 +41,7 @@ Inspired by [Nitter](https://github.com/zedeus/nitter), [libremdb](https://githu | Instance URL | Country | Provider | Notes | | --------------------------------------------------------------------------------------------------------------------------------------------- | :--------------------: | --------------- | ----------------------------------------------------------- | -| [biblioreads.eu.org](https://biblioreads.eu.org) | :us: | Netlify | Run by [me](https://github.com/nesaku) | +| [biblioreads.eu.org](https://biblioreads.eu.org) | :globe_with_meridians: | Cloudflare | Run by [me](https://github.com/nesaku) | | [biblioreads.vercel.app](https://biblioreads.vercel.app) | :us: | Vercel | Run by [me](https://github.com/nesaku) | | [biblioreads.mooo.com](https://biblioreads.mooo.com) | :globe_with_meridians: | Cloudflare | Run by [me](https://github.com/nesaku) | | [bl.vern.cc](https://bl.vern.cc) | :us: | Hetzner | Run by [~vern](https://vern.cc) | @@ -55,7 +55,7 @@ Inspired by [Nitter](https://github.com/zedeus/nitter), [libremdb](https://githu | [biblioreads.privacyredirect.com](https://biblioreads.privacyredirect.com) | :finland: | Private WebHost | Run by [privacyredirect](https://privacyredirect.com) | | [reads.nezumi.party](https://reads.nezumi.party) | :it: | Vodafone Italia | Run by [greyratdev](https://nezumi.party) | | [br.bloat.cat](https://br.bloat.cat) | :romania: | Kyun | Run by [bloat.cat](https://bloat.cat) | -| [read.canine.tools](https://read.canine.tools) | :us: | RoyaleHosting | Run by [canine.tools](https://canine.tools) | +| [read.canine.tools](https://read.canine.tools) | :us: | RoyaleHosting | Run by [canine.tools](https://canine.tools) | | Onion: | | | | | [bl.vernccvbvyi5qhfzyqengccj7lkove6bjot2xhh5kajhwvidqafczrad.onion](http://bl.vernccvbvyi5qhfzyqengccj7lkove6bjot2xhh5kajhwvidqafczrad.onion) | :us: | Hetzner | Run by [~vern](https://vern.cc) | | I2P: | | | | diff --git a/components/authorpage/AuthorBooks.js b/components/authorpage/AuthorBooks.js index ee7b60e..36b090b 100644 --- a/components/authorpage/AuthorBooks.js +++ b/components/authorpage/AuthorBooks.js @@ -1,5 +1,6 @@ /* eslint-disable @next/next/no-img-element */ import Link from "next/link"; +import { cleanImageUrl } from "../../utils/cleanImageUrl"; const AuthorBooks = (props) => { const slideLeft = () => { @@ -32,26 +33,21 @@ const AuthorBooks = (props) => { {data.cover && ( {`${data.title} { const [imageLoaded, setImageLoaded] = useState(false); @@ -126,26 +127,23 @@ const AuthorResultData = ({ scrapedData }) => { {/* Load WebP Image With JPG Fallback & 404 Not Found Image*/} { return ( @@ -50,26 +51,21 @@ const AuthorSeries = (props) => { {data.cover && ( {`${data.title} { return ( @@ -66,26 +67,21 @@ const EditionsList = (props) => {
{`${data.title} { - const version = "v2.23.2"; - const versionSlug = "2232---sep-21-2024"; + const version = "v2.24.0"; + const versionSlug = "2240---sep-28-2024"; useEffect(() => { if (typeof sessionStorage !== "undefined") { diff --git a/components/librarypage/AuthorList.js b/components/librarypage/AuthorList.js index 968b0a7..8330332 100644 --- a/components/librarypage/AuthorList.js +++ b/components/librarypage/AuthorList.js @@ -1,5 +1,7 @@ /* eslint-disable @next/next/no-img-element */ +import { cleanImageUrl } from "../../utils/cleanImageUrl"; + const AuthorList = ({ libraryData }) => { return (
{ {data.image && ( {`${data.name}'s { return (
{ {data.cover && ( {`${data.title} { return ( @@ -58,26 +59,21 @@ const BookList = (props) => {
{`${data.title} { const [inputValue, setInputValue] = useState(""); @@ -35,26 +36,23 @@ const QuotesResults = ({ scrapedData, singleQuote }) => {
{ "" )} > - + {scrapedData.series} @@ -534,25 +533,18 @@ const ResultData = ({ scrapedData }) => { {scrapedData.reviewBreakdown && scrapedData.reviews != 0 && ( )} -
- {scrapedData.quotesURL != "" && ( - - )} - {scrapedData.reviews != "" && ( - - )} -
)} - {scrapedData.title && ( -
- {scrapedData.quotesURL != "" && ( - - )} - {scrapedData.reviews != "" && } -
- )} + +
+ {scrapedData.quotesURL && scrapedData.quotesURL != "" && ( + + )} + {scrapedData.reviews && scrapedData.reviews != "" && ( + + )} +
); }; diff --git a/components/resultpage/ReviewBreakdown.js b/components/resultpage/ReviewBreakdown.js index a89b529..39632c8 100644 --- a/components/resultpage/ReviewBreakdown.js +++ b/components/resultpage/ReviewBreakdown.js @@ -4,7 +4,7 @@ const ReviewBreakdown = ({ data }) => { return (

{ return ( <> -
-

+
+

Reviews:

-
-
+
+

Search:{" "}

@@ -159,15 +168,15 @@ const Reviews = (props) => { placeholder="Search review text" className={ filterStars || sortBy - ? "form-control block w-[360px] m-0 px-3 py-1.5 text-base font-normal text-gray-400 dark:text-gray-600 bg-gray-300 dark:bg-gray-600 bg-clip-padding border-2 border-solid border-gray-400 rounded-lg transition ease-in-out focus:text-gray-700 focus:bg-white focus:border-rose-600 focus:outline-none cursor-not-allowed" - : "form-control block w-[360px] m-0 px-3 py-1.5 text-base font-normal text-gray-900 dark:text-gray-200 bg-rose-50 dark:bg-gray-800 bg-clip-padding border-2 border-solid border-gray-400 rounded-lg transition ease-in-out focus:text-gray-900 focus:bg-gray-200 focus:border-rose-600 focus:outline-none" + ? "form-control block w-48 lg:w-[360px] m-0 px-3 py-1.5 text-base font-normal text-gray-400 dark:text-gray-600 bg-gray-300 dark:bg-gray-600 bg-clip-padding border-2 border-solid border-gray-400 rounded-lg transition ease-in-out focus:text-gray-700 focus:bg-white focus:border-rose-600 focus:outline-none cursor-not-allowed" + : "form-control block w-48 lg:w-[360px] m-0 px-3 py-1.5 text-base font-normal text-gray-900 dark:text-gray-200 bg-rose-50 dark:bg-gray-800 bg-clip-padding border-2 border-solid border-gray-400 rounded-lg transition ease-in-out focus:text-gray-900 focus:bg-gray-200 focus:border-rose-600 focus:outline-none" } onChange={(e) => setSearchText(e.target.value)} disabled={filterStars || sortBy} />
-
-

+

+

Show Profile Avatars:

+ +
diff --git a/components/resultpage/ReviewsMobile.js b/components/resultpage/ReviewsMobile.js deleted file mode 100644 index 9c9c07a..0000000 --- a/components/resultpage/ReviewsMobile.js +++ /dev/null @@ -1,452 +0,0 @@ -import { useState, useEffect } from "react"; -import ReactPaginate from "react-paginate"; -import ReviewCard from "./ReviewCard"; -import FilterButton from "./FilterButton"; -import SortButton from "./SortButton"; - -const ReviewsMobile = (props) => { - const [showReviews, setShowReviews] = useState(false); - const [showAvatars, setShowAvatars] = useState(false); - - const [filterStars, setFilterStars] = useState(); - const [sortBy, setSortBy] = useState(); - - const [searchText, setSearchText] = useState(""); - - const [pagination, setPagination] = useState({ - data: props.data, - offset: 0, - numberPerPage: 6, - pageCount: 0, - currentData: [], - }); - - useEffect(() => { - setPagination((prevState) => ({ - ...prevState, - pageCount: prevState.data.length / prevState.numberPerPage, - currentData: prevState.data.slice( - pagination.offset, - pagination.offset + pagination.numberPerPage - ), - })); - }, [pagination.numberPerPage, pagination.offset]); - - const handlePageClick = (event) => { - const selected = event.selected; - const offset = selected * pagination.numberPerPage; - setPagination({ ...pagination, offset }); - }; - - return ( -
-

- Reviews: -

- - - {showReviews && ( -
-
-

- Filter: -

- - - - - -
-
-

- Sort By: -

- - - -
-
-

- Show Profile Avatars: -

- - - -
-
-

- Search:{" "} -

- setSearchText(e.target.value)} - disabled={filterStars || sortBy} - /> -
- {/* If popular sort order and star filter is set, order by default and then filter by stars */} - {filterStars && - sortBy === "popular" && - props.data - .sort((a, b) => a.id > b.id) - .map( - (data, i) => - data.stars === filterStars && ( -
- -
- ) - )} - - {/* If popular sort order is set but no star filter, then order by default */} - {filterStars === undefined && - sortBy === "popular" && - props.data - .sort((a, b) => a.id > b.id) - .map((data, i) => ( - - ))} - - {/* If new-old sort order and star filter is set, order by date and then filter by stars */} - {filterStars && - sortBy === "new-old" && - props.data - .sort( - (a, b) => - new Date(a.date).getTime() - new Date(b.date).getTime() - ) - .reverse() - .map( - (data, i) => - data.stars === filterStars && ( -
- -
- ) - )} - - {/* If old-new sort order and star filter is set, order by date and then filter by stars */} - {filterStars && - sortBy === "old-new" && - props.data - .sort( - (a, b) => - new Date(b.date).getTime() - new Date(a.date).getTime() - ) - .reverse() - .map( - (data, i) => - data.stars === filterStars && ( -
- -
- ) - )} - - {/* If new-old sort order is set but no star filter, then order by date */} - {filterStars === undefined && - sortBy === "new-old" && - props.data - .sort( - (a, b) => - new Date(a.date).getTime() - new Date(b.date).getTime() - ) - .reverse() - .map((data, i) => ( -
- -
- ))} - - {/* If old-new sort order is set but no star filter, then order by date */} - {filterStars === undefined && - sortBy === "old-new" && - props.data - .sort( - (a, b) => - new Date(b.date).getTime() - new Date(a.date).getTime() - ) - .reverse() - .map((data, i) => ( -
- -
- ))} - - {/* If sort order is not set, then filter by stars */} - {sortBy === undefined && - filterStars && - props.data.map( - (data, i) => - data.stars === filterStars && ( -
- -
- ) - )} - - {/* If sort order and star filter are not set and the search box is used, then display default */} - {searchText && - filterStars === undefined && - sortBy === undefined && - props.data - .filter((data) => { - if (searchText == "") { - return data; - } else if ( - data.text.toLowerCase().includes(searchText.toLowerCase()) - ) { - return data; - } - }) - .map((data, i) => ( -
- -
- ))} - - {/* If sort order, star filter and search box are not set, then display default */} - {searchText === "" && - filterStars === undefined && - sortBy === undefined && ( - - )} -
- )} -
- ); -}; - -export default ReviewsMobile; diff --git a/components/resultpage/SimilarBooks.js b/components/resultpage/SimilarBooks.js index f4e824d..1a404c9 100644 --- a/components/resultpage/SimilarBooks.js +++ b/components/resultpage/SimilarBooks.js @@ -2,6 +2,7 @@ /* eslint-disable @next/next/no-html-link-for-pages */ import { useEffect, useRef, useState } from "react"; import SmallLoader from "../global/SmallLoader"; +import { cleanImageUrl } from "../../utils/cleanImageUrl"; // Instead of waiting for the similar books section to be lazy loaded, get the results directly from the Goodreads similar books page const SimilarBooks = ({ quotesURL, mobile }) => { @@ -55,9 +56,9 @@ const SimilarBooks = ({ quotesURL, mobile }) => { return (
-

+

Similar Books:{" "}

{isLoading ? ( @@ -65,9 +66,8 @@ const SimilarBooks = ({ quotesURL, mobile }) => { ) : ( <>
{scrapedData.books != undefined && scrapedData.books.slice(1).map((data, i) => ( @@ -79,26 +79,23 @@ const SimilarBooks = ({ quotesURL, mobile }) => { {data.cover && ( {`${data.title} { {data.rating.split("avg")[0]}
-
+
{data.title.slice(0, 40)} @@ -136,7 +133,7 @@ const SimilarBooks = ({ quotesURL, mobile }) => {
))}
-
+