@automattic/social-previews
Version:
A suite of components to generate previews for a post for both social and search engines.
19 lines • 2.12 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { __ } from '@wordpress/i18n';
import SectionHeading from '../shared/section-heading';
import { ThreadsLinkPreview } from './link-preview';
import { ThreadsPostPreview } from './post-preview';
export const ThreadsPreviews = ({ headingLevel, hideLinkPreview, hidePostPreview, posts, }) => {
if (!posts?.length) {
return null;
}
return (_jsxs("div", { className: "social-preview threads-preview", children: [!hidePostPreview && (_jsxs("section", { className: "social-preview__section threads-preview__section", children: [_jsx(SectionHeading, { level: headingLevel, children:
// translators: refers to a social post on Threads
__('Your post', 'social-previews') }), _jsx("p", { className: "social-preview__section-desc", children: __('This is what your social post will look like on Threads:', 'social-previews') }), posts.map((post, index) => {
const isLast = index + 1 === posts.length;
return (_jsx(ThreadsPostPreview, { ...post, showThreadConnector: !isLast }, `threads-preview__post-${index}`));
})] })), !hideLinkPreview ? (_jsxs("section", { className: "social-preview__section threads-preview__section", children: [_jsx(SectionHeading, { level: headingLevel, children:
// translators: refers to a link to a Threads post
__('Link preview', 'social-previews') }), posts[0].image ? (_jsxs(_Fragment, { children: [_jsx("p", { className: "social-preview__section-desc", children: __('This is what it will look like when someone shares the link to your WordPress post on Threads.', 'social-previews') }), _jsx(ThreadsLinkPreview, { ...posts[0], name: "", profileImage: "" })] })) : (_jsx("p", { className: "social-preview__section-desc", children: __('Threads link preview requires an image to be set for the post. Please add an image to see the preview.', 'social-previews') }))] })) : null] }));
};
//# sourceMappingURL=previews.js.map