diff --git a/src/components/Feed/ArticleCard/ArticleCard.tsx b/src/components/Feed/ArticleCard/ArticleCard.tsx index 7452067a..665a2d50 100644 --- a/src/components/Feed/ArticleCard/ArticleCard.tsx +++ b/src/components/Feed/ArticleCard/ArticleCard.tsx @@ -62,8 +62,8 @@ const getTitleAndSubtitle = ( title: string subtitle: string } => { - let title = article?.title || '' - let subtitle: string = article?.subtitle || '' + let title = article.title || '' + let subtitle: string = article.subtitle || '' if (!subtitle) { let titleParts = article.title?.split('. ') || [] @@ -85,8 +85,8 @@ const getTitleAndSubtitle = ( } const getMainTopicTitle = (article: Shout, lng: string) => { - const mainTopicSlug = article?.main_topic || '' - const mainTopic = (article?.topics || []).find((tpc: Maybe) => tpc?.slug === mainTopicSlug) + const mainTopicSlug = article.main_topic || '' + const mainTopic = (article.topics || []).find((tpc: Maybe) => tpc?.slug === mainTopicSlug) const mainTopicTitle = mainTopicSlug && lng === 'en' ? mainTopicSlug.replace(/-/, ' ') : mainTopic?.title || '' @@ -109,29 +109,30 @@ export const ArticleCard = (props: ArticleCardProps) => { const [isActionPopupActive, setIsActionPopupActive] = createSignal(false) const [isCoverImageLoadError, setIsCoverImageLoadError] = createSignal(false) const [isCoverImageLoading, setIsCoverImageLoading] = createSignal(true) - const description = descFromBody(props.article?.body) - const aspectRatio: Accessor = () => LAYOUT_ASPECT[props.article?.layout as string] + const description = descFromBody(props.article.body) + const aspectRatio: Accessor = () => LAYOUT_ASPECT[props.article.layout as string] const [mainTopicTitle, mainTopicSlug] = getMainTopicTitle(props.article, lang()) const { title, subtitle } = getTitleAndSubtitle(props.article) const formattedDate = createMemo(() => - props.article?.published_at ? formatDate(new Date(props.article.published_at * 1000)) : '' + props.article.published_at ? formatDate(new Date(props.article.published_at * 1000)) : '' ) const canEdit = createMemo( () => Boolean(author()?.id) && - (props.article?.authors?.some((a) => Boolean(a) && a?.id === author().id) || - props.article?.created_by?.id === author().id || + (props.article.authors?.some((a) => Boolean(a) && a?.id === author().id) || + props.article.created_by?.id === author().id || session()?.user?.roles?.includes('editor')) ) const navigate = useNavigate() + const scrollToComments = (event: MouseEvent & { currentTarget: HTMLAnchorElement; target: Element }) => { event.preventDefault() - navigate(`/${props.article.slug}`) changeSearchParams({ scrollTo: 'comments' }) + navigate(`/${props.article.slug}`) } const onInvite = () => { @@ -196,10 +197,9 @@ export const ArticleCard = (props: ArticleCardProps) => { } > @@ -220,7 +220,7 @@ export const ArticleCard = (props: ArticleCardProps) => { [styles.shoutCardTitlesContainerFeedMode]: props.settings?.isFeedMode })} > - +
@@ -280,10 +280,9 @@ export const ArticleCard = (props: ArticleCardProps) => { } >
@@ -332,7 +331,7 @@ export const ArticleCard = (props: ArticleCardProps) => { {(triggerRef: (el: HTMLElement) => void) => ( ) + const { feedByAuthor, addFeed } = useFeed() + const [sortedFeed, setSortedFeed] = createSignal([]) + const [loadMoreHidden, setLoadMoreHidden] = createSignal(false) + const loadMore = async () => { + saveScrollPosition() + const amountBefore = feedByAuthor()?.[props.authorSlug]?.length || 0 + const topicShoutsFetcher = loadShouts({ + filters: { author: props.authorSlug }, + limit: SHOUTS_PER_PAGE, + offset: amountBefore + }) + const result = await topicShoutsFetcher() + result && addFeed(result) + const amountAfter = feedByAuthor()?.[props.authorSlug].length + setLoadMoreHidden(amountAfter === amountBefore) + restoreScrollPosition() + return result as LoadMoreItems + } + + // fx to update author's feed + createEffect(on(feedByAuthor, (byAuthor) => { + const feed = byAuthor[props.authorSlug] as Shout[] + if (!feed) return + setSortedFeed(feed) + },{})) + return (
@@ -218,10 +248,14 @@ export const AuthorView = (props: AuthorViewProps) => {
- 0}> - i % 3 === 0)}> + +
diff --git a/src/routes/author/[slug]/[...tab].tsx b/src/routes/author/[slug]/[...tab].tsx index ceb24eec..ddc6ccd0 100644 --- a/src/routes/author/[slug]/[...tab].tsx +++ b/src/routes/author/[slug]/[...tab].tsx @@ -2,11 +2,10 @@ import { RouteSectionProps, createAsync } from '@solidjs/router' import { ErrorBoundary, Suspense, createEffect, createSignal, on } from 'solid-js' import { AuthorView } from '~/components/Views/Author' import { FourOuFourView } from '~/components/Views/FourOuFour' -import { LoadMoreItems, LoadMoreWrapper } from '~/components/_shared/LoadMoreWrapper' import { Loading } from '~/components/_shared/Loading' import { PageLayout } from '~/components/_shared/PageLayout' import { useAuthors } from '~/context/authors' -import { SHOUTS_PER_PAGE, useFeed } from '~/context/feed' +import { SHOUTS_PER_PAGE } from '~/context/feed' import { useLocalize } from '~/context/localize' import { ReactionsProvider } from '~/context/reactions' import { loadAuthors, loadShouts, loadTopics } from '~/graphql/api/public' @@ -106,21 +105,7 @@ export default function AuthorPage(props: RouteSectionProps) { ) // author's shouts - const { addFeed, feedByAuthor } = useFeed() - const [loadMoreHidden, setLoadMoreHidden] = createSignal(true) - const authorShouts = createAsync(async () => { - const sss: Shout[] = (props.data.articles as Shout[]) || feedByAuthor()[props.params.slug] || [] - const result = sss || (await fetchAuthorShouts(props.params.slug, 0)) - if (!result) setLoadMoreHidden(true) - return result - }) - - // load more shouts - const loadAuthorShoutsMore = async (offset: number) => { - const loadedShouts = await fetchAuthorShouts(props.params.slug, offset) - loadedShouts && addFeed(loadedShouts) - return (loadedShouts || []) as LoadMoreItems - } + const authorShouts = createAsync(async () => props.data.articles as Shout[] || await fetchAuthorShouts(props.params.slug, 0)) return ( }> @@ -133,17 +118,11 @@ export default function AuthorPage(props: RouteSectionProps) { cover={cover()} > - +