From bd9c9ae7e2ae973969569dd434836de9f38b07d4 Mon Sep 17 00:00:00 2001 From: Armand Philippot Date: Tue, 7 Nov 2023 16:55:58 +0100 Subject: refactor(components): split Comment component into 3 components * add ApprovedComment, PendingComment and ReplyCommentForm components * let consumer handle reply form visibility * move structured data into article page (each article already has the comments data and already handle json ltd schema so I prefered to move the schema in the final consumer instead of adding a script element foreach comment) --- .../comment/pending-comment/pending-comment.tsx | 36 ++++++++++++++++++++++ 1 file changed, 36 insertions(+) create mode 100644 src/components/organisms/comment/pending-comment/pending-comment.tsx (limited to 'src/components/organisms/comment/pending-comment/pending-comment.tsx') diff --git a/src/components/organisms/comment/pending-comment/pending-comment.tsx b/src/components/organisms/comment/pending-comment/pending-comment.tsx new file mode 100644 index 0000000..0d37ac2 --- /dev/null +++ b/src/components/organisms/comment/pending-comment/pending-comment.tsx @@ -0,0 +1,36 @@ +import { type ForwardRefRenderFunction, forwardRef } from 'react'; +import { useIntl } from 'react-intl'; +import { Card, CardBody, type CardProps } from '../../../molecules'; + +export type PendingCommentProps = Omit< + CardProps, + | 'children' + | 'content' + | 'cover' + | 'id' + | 'isCentered' + | 'linkTo' + | 'meta' + | 'variant' +>; + +const PendingCommentWithRef: ForwardRefRenderFunction< + HTMLDivElement, + PendingCommentProps +> = (props, ref) => { + const intl = useIntl(); + + return ( + + + {intl.formatMessage({ + defaultMessage: 'This comment is awaiting moderation…', + description: 'PendingComment: awaiting moderation text', + id: '1d/xvG', + })} + + + ); +}; + +export const PendingComment = forwardRef(PendingCommentWithRef); -- cgit v1.2.3