From 71772ae0d6eb1574b4670ef15ac516d118c0346d Mon Sep 17 00:00:00 2001 From: Untone Date: Tue, 27 Aug 2024 20:17:24 +0300 Subject: [PATCH] all-authors-revert --- .../Views/AllAuthors/AllAuthors.tsx | 81 ++++++------------- 1 file changed, 26 insertions(+), 55 deletions(-) diff --git a/src/components/Views/AllAuthors/AllAuthors.tsx b/src/components/Views/AllAuthors/AllAuthors.tsx index d81aac9c..da0f80ff 100644 --- a/src/components/Views/AllAuthors/AllAuthors.tsx +++ b/src/components/Views/AllAuthors/AllAuthors.tsx @@ -1,6 +1,6 @@ import { useSearchParams } from '@solidjs/router' import { clsx } from 'clsx' -import { For, Show, createEffect, createMemo, createSignal } from 'solid-js' +import { For, Show, createEffect, createMemo, createSignal, on } from 'solid-js' import { AuthorBadge } from '~/components/Author/AuthorBadge' import { Button } from '~/components/_shared/Button' import { InlineLoader } from '~/components/_shared/InlineLoader' @@ -11,7 +11,7 @@ import { useLocalize } from '~/context/localize' import type { Author } from '~/graphql/schema/core.gen' import { authorLetterReduce, translateAuthor } from '~/intl/translate' import { dummyFilter } from '~/lib/dummyFilter' -import { byFirstChar, byStat } from '~/lib/sort' +// import { byFirstChar, byStat } from '~/lib/sort' import { scrollHandler } from '~/utils/scroll' import styles from './AllAuthors.module.scss' import stylesAuthorList from './AuthorsList.module.scss' @@ -29,57 +29,38 @@ export const ABC = { en: 'ABCDEFGHIJKLMNOPQRSTUVWXYZ#' } +// useAuthors sorted from context, set filter/sort + export const AllAuthors = (props: Props) => { const { t, lang } = useLocalize() const alphabet = createMemo(() => ABC[lang()] || ABC['ru']) - const [searchParams, changeSearchParams] = useSearchParams<{ by?: string }>() + const [searchParams, ] = useSearchParams<{ by?: string }>() const { authorsSorted, setAuthorsSort, loadAuthors } = useAuthors() + const authors = createMemo(() => (searchParams.by || searchParams.by === 'name') ? props.authors : authorsSorted()) const [loading, setLoading] = createSignal(false) - const [_currentAuthors, setCurrentAuthors] = createSignal([]) - - // UPDATE Fetch authors initially and when searchParams.by changes - createEffect(() => { - fetchAuthors(searchParams.by || 'name', 0) - }) - - const authors = createMemo(() => { - let sortedAuthors = [...(props.authors || authorsSorted())] // Clone the array to avoid mutating the original - console.log('Before Sorting:', sortedAuthors.slice(0, 5)) // Log the first 5 authors for comparison - if (searchParams.by === 'name') { - sortedAuthors = sortedAuthors.sort(byFirstChar) - console.log('Sorted by Name:', sortedAuthors.slice(0, 5)) - } else if (searchParams.by === 'shouts') { - sortedAuthors = sortedAuthors.sort(byStat('shouts')) - console.log('Sorted by Shouts:', sortedAuthors.slice(0, 5)) - } else if (searchParams.by === 'followers') { - sortedAuthors = sortedAuthors.sort(byStat('followers')) - console.log('Sorted by Followers:', sortedAuthors.slice(0, 5)) - } - console.log('After Sorting:', sortedAuthors.slice(0, 5)) - return sortedAuthors - }) - - // Log authors data and searchParams for debugging - createEffect(() => { - console.log('Authors:', props.authors.slice(0, 5)) // Log the first 5 authors - console.log('Sorted Authors:', authors().slice(0, 5)) // Log the first 5 sorted authors - console.log('Search Params "by":', searchParams.by) - }) // filter const [searchQuery, setSearchQuery] = createSignal('') const [filteredAuthors, setFilteredAuthors] = createSignal([]) createEffect( - () => authors() && setFilteredAuthors(dummyFilter(authors(), searchQuery(), lang()) as Author[]) + () => + authors() && + setFilteredAuthors((_prev: Author[]) => dummyFilter(authors(), searchQuery(), lang()) as Author[]) ) + // sort by + // onMount(() => !searchParams?.by && changeSearchParams({ by: 'name' })) + createEffect(on(() => searchParams?.by || 'name', setAuthorsSort || ((_) => null), {})) + // store by first char const byLetterFiltered = createMemo<{ [letter: string]: Author[] }>(() => { if (!(filteredAuthors()?.length > 0)) return {} console.debug('[components.AllAuthors] update byLetterFiltered', filteredAuthors()?.length) - return filteredAuthors().reduce( - (acc, author: Author) => authorLetterReduce(acc, author, lang()), - {} as { [letter: string]: Author[] } + return ( + filteredAuthors()?.reduce( + (acc, author: Author) => authorLetterReduce(acc, author, lang()), + {} as { [letter: string]: Author[] } + ) || {} ) }) @@ -102,24 +83,20 @@ export const AllAuthors = (props: Props) => { limit: AUTHORS_PER_PAGE, offset }) - // UPDATE authors to currentAuthors state - setCurrentAuthors((prev) => [...prev, ...authorsSorted()]) } catch (error) { console.error('[components.AuthorsList] error fetching authors:', error) } finally { setLoading(false) } } - const [currentPage, setCurrentPage] = createSignal<{ followers: number; shouts: number }>({ followers: 0, shouts: 0 }) - const loadMoreAuthors = () => { - const by = searchParams?.by as 'followers' | 'shouts' | undefined - if (!by) return - const nextPage = currentPage()[by] + 1 + const by = searchParams?.by + if (!by || by === 'name') return + const nextPage = currentPage()[by as 'followers' | 'shouts'] + 1 fetchAuthors(by, nextPage).then(() => setCurrentPage({ ...currentPage(), [by]: nextPage })) } @@ -134,27 +111,21 @@ export const AllAuthors = (props: Props) => { ['view-switcher__item--selected']: !searchParams?.by || searchParams?.by === 'shouts' })} > - changeSearchParams({ by: 'shouts' })}> - {t('By shouts')} - + {t('By shouts')}
  • - changeSearchParams({ by: 'followers' })}> - {t('By popularity')} - + {t('By popularity')}
  • - changeSearchParams({ by: 'name' })}> - {t('By name')} - + {t('By name')}
  • @@ -224,7 +195,7 @@ export const AllAuthors = (props: Props) => { const AuthorsSortedList = () => (
    - + {(author) => (
    @@ -236,7 +207,7 @@ export const AllAuthors = (props: Props) => {
    - 0}> + 0}>