From 1c1cfe9b40dd71f1915ed67e0062f257d31a9da2 Mon Sep 17 00:00:00 2001 From: ilya-bkv Date: Sun, 5 Mar 2023 16:31:36 +0300 Subject: [PATCH 1/3] Show followers list --- src/components/Views/Author.tsx | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) diff --git a/src/components/Views/Author.tsx b/src/components/Views/Author.tsx index 2d46b85e..518267db 100644 --- a/src/components/Views/Author.tsx +++ b/src/components/Views/Author.tsx @@ -95,7 +95,7 @@ export const AuthorView = (props: AuthorProps) => { }) setCommented(data) } catch (error) { - console.log('!!! error:', error) + console.error('[getReactionsBy comment]', error) } } }) @@ -205,6 +205,13 @@ export const AuthorView = (props: AuthorProps) => { + +
+
    + {(follower: Author) => } +
+
+ From 9b22627908a6e82e0b3c086967e07a3b080a3353 Mon Sep 17 00:00:00 2001 From: kvakazyambra Date: Fri, 24 Mar 2023 00:39:13 +0300 Subject: [PATCH 2/3] Followers list on authors page. Replaced "compact" props with "hideWriteButton" in the author card component. --- src/components/Article/Comment.tsx | 1 - src/components/Article/FullArticle.tsx | 12 +++++++----- src/components/Author/Card.tsx | 4 ++-- src/components/Author/Full.tsx | 2 +- src/components/Feed/Beside.tsx | 2 +- src/components/Views/Author.tsx | 12 +++++++++--- src/components/Views/Feed.tsx | 4 ++-- 7 files changed, 22 insertions(+), 15 deletions(-) diff --git a/src/components/Article/Comment.tsx b/src/components/Article/Comment.tsx index 63ef6f9e..268710c9 100644 --- a/src/components/Article/Comment.tsx +++ b/src/components/Article/Comment.tsx @@ -101,7 +101,6 @@ export const Comment = (props: Props) => { { )} -
+ +
+
@@ -254,7 +256,7 @@ export const FullArticle = (props: ArticleProps) => { {(a) => (
- +
)} diff --git a/src/components/Author/Card.tsx b/src/components/Author/Card.tsx index 929942f6..9e8bdddb 100644 --- a/src/components/Author/Card.tsx +++ b/src/components/Author/Card.tsx @@ -16,7 +16,7 @@ import { useLocalize } from '../../context/localize' interface AuthorCardProps { caption?: string - compact?: boolean + hideWriteButton?: boolean hideDescription?: boolean hideFollow?: boolean hasLink?: boolean @@ -166,7 +166,7 @@ export const AuthorCard = (props: AuthorCardProps) => { - +
    !r.replyTo)}> diff --git a/src/components/Article/FullArticle.tsx b/src/components/Article/FullArticle.tsx index ead27868..c299fbf8 100644 --- a/src/components/Article/FullArticle.tsx +++ b/src/components/Article/FullArticle.tsx @@ -23,6 +23,7 @@ import { useLocalize } from '../../context/localize' interface ArticleProps { article: Shout + scrollToComments?: boolean } interface MediaItem { @@ -88,6 +89,22 @@ export const FullArticle = (props: ArticleProps) => { return mi }) + const commentsRef: { current: HTMLDivElement } = { current: null } + + const scrollToComments = () => { + window.scrollTo({ + top: commentsRef.current.offsetTop - 96, + left: 0, + behavior: 'smooth' + }) + } + + createEffect(() => { + if (props.scrollToComments) { + scrollToComments() + } + }) + const { actions: { loadReactionsBy } } = useReactions() @@ -186,12 +203,10 @@ export const FullArticle = (props: ArticleProps) => { {props.article.stat?.viewed} - - +
    {props.article.stat?.commented ?? ''} - - +
    { )}
    -
    +
    (commentsRef.current = el)}> void } export const Header = (props: Props) => { @@ -78,6 +80,10 @@ export const Header = (props: Props) => { }) }) + const scrollToComments = (value) => { + props.scrollToComments(value) + } + return (
    { containerCssClass={styles.control} trigger={} /> - + diff --git a/src/components/_shared/CommentEditor/CommentEditor.tsx b/src/components/_shared/CommentEditor/CommentEditor.tsx index 819627cf..e17e4ba9 100644 --- a/src/components/_shared/CommentEditor/CommentEditor.tsx +++ b/src/components/_shared/CommentEditor/CommentEditor.tsx @@ -21,6 +21,7 @@ type Props = { placeholder?: string onSubmit: (value: string) => void clear?: boolean + cancel?: () => void initialContent?: string } @@ -69,6 +70,9 @@ const CommentEditor = (props: Props) => { const clearEditor = () => { editorViewRef.current.destroy() initEditor() + if (props.cancel) { + props.cancel() + } } createEffect(() => { @@ -76,7 +80,6 @@ const CommentEditor = (props: Props) => { clearEditor() } }) - return (
    (editorElRef.current = el)} /> diff --git a/src/components/_shared/PageLayout.tsx b/src/components/_shared/PageLayout.tsx index 30a7e84c..23ca13fd 100644 --- a/src/components/_shared/PageLayout.tsx +++ b/src/components/_shared/PageLayout.tsx @@ -2,7 +2,7 @@ import type { JSX } from 'solid-js' import { Header } from '../Nav/Header' import { Footer } from '../Discours/Footer' -import { Show } from 'solid-js' +import { createEffect, createSignal, Show } from 'solid-js' import { clsx } from 'clsx' import '../../styles/app.scss' import styles from './PageLayout.module.scss' @@ -10,6 +10,7 @@ import { Meta } from '@solidjs/meta' type PageLayoutProps = { headerTitle?: string + slug?: string articleBody?: string cover?: string children: JSX.Element @@ -17,19 +18,29 @@ type PageLayoutProps = { hideFooter?: boolean class?: string withPadding?: boolean + scrollToComments?: (value: boolean) => void } export const PageLayout = (props: PageLayoutProps) => { const isHeaderFixed = props.isHeaderFixed === undefined ? true : props.isHeaderFixed + const [scrollToComments, setScrollToComments] = createSignal(false) + + createEffect(() => { + if (props.scrollToComments) { + props.scrollToComments(scrollToComments()) + } + }) return ( <>
    setScrollToComments(value)} />
    { return ( (containerRef.current = el)}> - {props.trigger} + + {props.trigger} +
    { script.dataset.ackeeDomainId = '1004abeb-89b2-4e85-ad97-74f8d2c8ed2d' document.body.appendChild(script) }) + const [scrollToComments, setScrollToComments] = createSignal(false) return ( - + { + setScrollToComments(value) + }} + > }> - + diff --git a/src/styles/Article.module.scss b/src/styles/Article.module.scss index abdd02e7..ef42c9e5 100644 --- a/src/styles/Article.module.scss +++ b/src/styles/Article.module.scss @@ -172,13 +172,20 @@ img { a { border: none; - + text-decoration: none; &:hover { - .icon { - filter: invert(1); + background: unset; + color: #000; + + img { + filter: unset; } } } + + &:hover { + cursor: pointer; + } } .shoutStatsItemLikes {