diff --git a/src/components/Views/Feed/Feed.tsx b/src/components/Views/Feed/Feed.tsx index dadf0596..c3b8ed79 100644 --- a/src/components/Views/Feed/Feed.tsx +++ b/src/components/Views/Feed/Feed.tsx @@ -1,6 +1,6 @@ import { A, createAsync, useLocation, useNavigate, useSearchParams } from '@solidjs/router' import { clsx } from 'clsx' -import { For, Show, createMemo, createSignal, onMount } from 'solid-js' +import { For, Show, createEffect, createMemo, createSignal, on, onMount } from 'solid-js' import { DropDown } from '~/components/_shared/DropDown' import { Option } from '~/components/_shared/DropDown/DropDown' import { Icon } from '~/components/_shared/Icon' @@ -17,7 +17,7 @@ import { useUI } from '~/context/ui' import { loadUnratedShouts } from '~/graphql/api/private' import type { Author, Reaction, Shout } from '~/graphql/schema/core.gen' import { byCreated } from '~/lib/sortby' -import { FeedSearchParams } from '~/routes/feed/[feed]' +import { FeedSearchParams } from '~/routes/feed/(feed)' import { CommentDate } from '../../Article/CommentDate' import { getShareUrl } from '../../Article/SharePopup' import { AuthorBadge } from '../../Author/AuthorBadge' @@ -64,16 +64,24 @@ export const FeedView = (props: FeedProps) => { setTopComments(comments.sort(byCreated).reverse()) } - onMount(() => { - setIsLoading(true) - Promise.all([ - loadTopComments(), - loadReactionsBy({ by: { shouts: props.shouts.map((s) => s.slug) } }) - ]).finally(() => { - setIsRightColumnLoaded(true) - setIsLoading(false) - }) - }) + createEffect( + on( + () => props.shouts, + (sss: Shout[]) => { + if (sss) { + setIsLoading(true) + Promise.all([ + loadTopComments(), + loadReactionsBy({ by: { shouts: sss.map((s: Shout) => s.slug) } }) + ]).finally(() => { + setIsRightColumnLoaded(true) + setIsLoading(false) + }) + } + }, + { defer: true } + ) + ) const [shareData, setShareData] = createSignal() const handleShare = (shared: Shout | undefined) => { diff --git a/src/context/reactions.tsx b/src/context/reactions.tsx index 5cb7cc6d..c9aadab0 100644 --- a/src/context/reactions.tsx +++ b/src/context/reactions.tsx @@ -42,6 +42,7 @@ export const ReactionsProvider = (props: { children: JSX.Element }) => { const loadReactionsBy = async (opts: QueryLoad_Reactions_ByArgs): Promise => { const fetcher = await loadReactions(opts) const result = (await fetcher()) || [] + console.debug('[context.reactions] loaded', result) const newReactionsByShout: Record = {} const newReactionEntities = result.reduce( (acc: { [reaction_id: number]: Reaction }, reaction: Reaction) => { diff --git a/src/routes/(home).tsx b/src/routes/(home).tsx index f406eb45..fcee6905 100644 --- a/src/routes/(home).tsx +++ b/src/routes/(home).tsx @@ -9,7 +9,6 @@ import { HomeView, HomeViewProps } from '../components/Views/Home' import { Loading } from '../components/_shared/Loading' import { PageLayout } from '../components/_shared/PageLayout' import { useLocalize } from '../context/localize' -import { ReactionsProvider } from '../context/reactions' export const SHOUTS_PER_PAGE = 20 @@ -115,18 +114,16 @@ export default function HomePage(props: RouteSectionProps) { return ( - - }> - - -

- -

-
-
-
+ }> + + +

+ +

+
+
) } diff --git a/src/routes/author/(all-authors).tsx b/src/routes/author/(all-authors).tsx index e81484d6..4799c236 100644 --- a/src/routes/author/(all-authors).tsx +++ b/src/routes/author/(all-authors).tsx @@ -6,7 +6,6 @@ import { Loading } from '~/components/_shared/Loading' import { PageLayout } from '~/components/_shared/PageLayout' import { useAuthors } from '~/context/authors' import { useLocalize } from '~/context/localize' -import { ReactionsProvider } from '~/context/reactions' import { loadAuthors, loadAuthorsAll } from '~/graphql/api/public' import { Author, AuthorsBy } from '~/graphql/schema/core.gen' @@ -73,7 +72,6 @@ export default function AllAuthorsPage(props: RouteSectionProps) title={`${t('Discours')} :: ${t('All authors')}`} desc="List of authors of the open editorial community" > - }> ) authorsByShouts={data()?.authorsByShouts} /> - ) } diff --git a/src/routes/feed/[feed].tsx b/src/routes/feed/(feed).tsx similarity index 61% rename from src/routes/feed/[feed].tsx rename to src/routes/feed/(feed).tsx index 28056a0b..3be04631 100644 --- a/src/routes/feed/[feed].tsx +++ b/src/routes/feed/(feed).tsx @@ -1,19 +1,10 @@ -import { RouteSectionProps, createAsync, useParams, useSearchParams } from '@solidjs/router' +import { RouteSectionProps, createAsync, useSearchParams } from '@solidjs/router' import { Client } from '@urql/core' import { Show, createEffect, createSignal } from 'solid-js' import { Feed } from '~/components/Views/Feed' import { PageLayout } from '~/components/_shared/PageLayout' -import { useGraphQL } from '~/context/graphql' import { useLocalize } from '~/context/localize' import { ReactionsProvider } from '~/context/reactions' -import { useSession } from '~/context/session' -import { - loadBookmarkedShouts, - loadCoauthoredShouts, - loadDiscussedShouts, - loadFollowedShouts, - loadUnratedShouts -} from '~/graphql/api/private' import { loadShouts } from '~/graphql/api/public' import { LoadShoutsOptions, Shout } from '~/graphql/schema/core.gen' import { SHOUTS_PER_PAGE } from '../(home)' @@ -55,38 +46,6 @@ const fetchPublishedShouts = async (offset?: number, _client?: Client) => { return await shoutsLoader() } -const fetchBookmarkedShouts = async (offset?: number, client?: Client) => { - const shoutsLoader = loadBookmarkedShouts(client, { limit: SHOUTS_PER_PAGE, offset }) - return await shoutsLoader() -} - -const fetchUnratedShouts = async (offset?: number, client?: Client) => { - const shoutsLoader = loadUnratedShouts(client, { limit: SHOUTS_PER_PAGE, offset }) - return await shoutsLoader() -} - -const fetchFollowedShouts = async (offset?: number, client?: Client) => { - const shoutsLoader = loadFollowedShouts(client, { limit: SHOUTS_PER_PAGE, offset }) - return await shoutsLoader() -} - -const fetchDiscussedShouts = async (offset?: number, client?: Client) => { - const shoutsLoader = loadDiscussedShouts(client, { limit: SHOUTS_PER_PAGE, offset }) - return await shoutsLoader() -} - -const fetchCoauthoredShouts = async (offset?: number, client?: Client) => { - const shoutsLoader = loadCoauthoredShouts(client, { limit: SHOUTS_PER_PAGE, offset }) - return await shoutsLoader() -} - -const fetchersByMode = { - followed: fetchFollowedShouts, - bookmarked: fetchBookmarkedShouts, - discussed: fetchDiscussedShouts, - coauthored: fetchCoauthoredShouts, - unrated: fetchUnratedShouts -} export const route = { load: async ({ location: { query } }: RouteSectionProps<{ articles: Shout[] }>) => { @@ -99,9 +58,6 @@ export const route = { export default (props: RouteSectionProps) => { const [searchParams] = useSearchParams() const { t } = useLocalize() - const params = useParams() - const client = useGraphQL() - const { session } = useSession() const [offset, setOffset] = createSignal(0) const shouts = createAsync(async () => ({ ...props.data }) || (await loadMore())) const [isLoadMoreButtonVisible, setIsLoadMoreButtonVisible] = createSignal(true) @@ -118,10 +74,7 @@ export default (props: RouteSectionProps) => { const period = searchParams?.by || 'month' options.filters = { after: getFromDate(period as FeedPeriod) } } - if (!session()) return await fetchPublishedShouts(newOffset) - const fetcher = fetchersByMode[params.feed as keyof typeof fetchersByMode] - if (!fetcher) return await fetchPublishedShouts(newOffset) - return await fetcher(newOffset, client) + return await fetchPublishedShouts(newOffset) } createEffect(() => setIsLoadMoreButtonVisible(offset() < (shouts()?.length || 0))) return ( diff --git a/src/routes/search/(search).tsx b/src/routes/search/(search).tsx index f763762f..37dc7a47 100644 --- a/src/routes/search/(search).tsx +++ b/src/routes/search/(search).tsx @@ -5,7 +5,6 @@ import { SearchView } from '~/components/Views/Search' import { Loading } from '~/components/_shared/Loading' import { PageLayout } from '~/components/_shared/PageLayout' import { useLocalize } from '~/context/localize' -import { ReactionsProvider } from '~/context/reactions' import { loadShoutsSearch } from '~/graphql/api/public' import { QueryLoad_Shouts_SearchArgs, SearchResult } from '~/graphql/schema/core.gen' @@ -49,7 +48,6 @@ export default () => { return ( - }> }> { - ) } diff --git a/src/routes/topic/(all-topics).tsx b/src/routes/topic/(all-topics).tsx index e89ad49e..0a3ae96c 100644 --- a/src/routes/topic/(all-topics).tsx +++ b/src/routes/topic/(all-topics).tsx @@ -4,7 +4,6 @@ import { AllTopics } from '~/components/Views/AllTopics' import { Loading } from '~/components/_shared/Loading' import { PageLayout } from '~/components/_shared/PageLayout' import { useLocalize } from '~/context/localize' -import { ReactionsProvider } from '~/context/reactions' import { useTopics } from '~/context/topics' import { loadTopics } from '~/graphql/api/public' import { Topic } from '~/graphql/schema/core.gen' @@ -29,11 +28,9 @@ export default (props: RouteSectionProps<{ topics: Topic[] }>) => { headerTitle={`${t('Discours')} :: ${t('All topics')}`} desc="Thematic table of contents of the magazine. Here you can find all the topics that the community authors wrote about" > - }> - ) } diff --git a/src/routes/topic/[slug].tsx b/src/routes/topic/[slug].tsx index bbc6eb4d..4fde4042 100644 --- a/src/routes/topic/[slug].tsx +++ b/src/routes/topic/[slug].tsx @@ -5,7 +5,6 @@ import { TopicView } from '~/components/Views/Topic' import { Loading } from '~/components/_shared/Loading' import { PageLayout } from '~/components/_shared/PageLayout' import { useLocalize } from '~/context/localize' -import { ReactionsProvider } from '~/context/reactions' import { useTopics } from '~/context/topics' import { loadShouts } from '~/graphql/api/public' import { LoadShoutsOptions, Shout, Topic } from '~/graphql/schema/core.gen' @@ -66,13 +65,11 @@ export default (props: RouteSectionProps<{ articles: Shout[] }>) => { slug={topic()?.slug} cover={cover()} > - -