diff options
| author | Armand Philippot <git@armandphilippot.com> | 2022-04-29 12:13:34 +0200 |
|---|---|---|
| committer | Armand Philippot <git@armandphilippot.com> | 2022-04-29 18:30:05 +0200 |
| commit | 7e16f500cb7bc0cfd8bafbf6bb1555704f771231 (patch) | |
| tree | bfc2b4a475cb06a787e2c4bdf284165644e82952 /src/components/Widgets/Sharing/Sharing.tsx | |
| parent | 5324664e87bedfaa01ba62c0c847ef5b861e69b3 (diff) | |
chore: remove old pages, components, helpers and types
Since I'm using new components, I will also rewrite the GraphQL queries
so it is easier to start from scratch.
Diffstat (limited to 'src/components/Widgets/Sharing/Sharing.tsx')
| -rw-r--r-- | src/components/Widgets/Sharing/Sharing.tsx | 238 |
1 files changed, 0 insertions, 238 deletions
diff --git a/src/components/Widgets/Sharing/Sharing.tsx b/src/components/Widgets/Sharing/Sharing.tsx deleted file mode 100644 index 45fe3ce..0000000 --- a/src/components/Widgets/Sharing/Sharing.tsx +++ /dev/null @@ -1,238 +0,0 @@ -import { ExpandableWidget } from '@components/WidgetParts'; -import { useRouter } from 'next/router'; -import { useEffect, useState } from 'react'; -import { useIntl } from 'react-intl'; -import styles from './Sharing.module.scss'; - -type Parameters = { - content: string; - image: string; - title: string; - url: string; -}; - -type Website = { - id: string; - name: string; - parameters: Parameters; - url: string; -}; - -const Sharing = ({ excerpt, title }: { excerpt: string; title: string }) => { - const intl = useIntl(); - const [pageExcerpt, setPageExcerpt] = useState(''); - const [pageUrl, setPageUrl] = useState(''); - const [domainName, setDomainName] = useState(''); - const router = useRouter(); - - useEffect(() => { - const divEl = document.createElement('div'); - divEl.innerHTML = excerpt; - const cleanExcerpt = divEl.textContent!; - setPageExcerpt(cleanExcerpt); - }, [excerpt]); - - useEffect(() => { - const { protocol, hostname, port } = window.location; - const currentPort = port ? `:${port}` : ''; - const fullUrl = `${protocol}//${hostname}${currentPort}${router.asPath}`; - - setDomainName(hostname); - setPageUrl(fullUrl); - }, [router.asPath]); - - const getSharingUrl = (website: Website): string => { - const { id, parameters, url } = website; - let sharingUrl = `${url}?`; - let count = 0; - - for (const [key, value] of Object.entries(parameters)) { - if (!value) continue; - - sharingUrl += count > 0 ? `&${value}=` : `${value}=`; - - switch (key) { - case 'content': - if (id === 'email') { - const intro = intl.formatMessage({ - defaultMessage: 'Introduction:', - description: 'Sharing: email content prefix', - id: 'yfgMcl', - }); - const readMore = intl.formatMessage({ - defaultMessage: 'Read more here:', - description: 'Sharing: content link prefix', - id: 'UsQske', - }); - const body = `${intro}\n\n"${pageExcerpt}"\n\n${readMore} ${pageUrl}`; - sharingUrl += encodeURI(body); - } else { - sharingUrl += encodeURI(pageExcerpt); - } - break; - case 'title': - const prefix = - id === 'email' - ? intl.formatMessage( - { - defaultMessage: 'Seen on {domainName}:', - description: 'Sharing: seen on text', - id: 'eUXMG4', - }, - { domainName } - ) - : ''; - sharingUrl += encodeURI(`${prefix} ${title}`); - break; - case 'url': - sharingUrl += encodeURI(pageUrl); - break; - default: - break; - } - - count++; - } - - return sharingUrl; - }; - - const websites = [ - { - id: 'diaspora', - name: intl.formatMessage({ - defaultMessage: 'Diaspora', - description: 'Sharing: Diaspora', - id: 'Dhow1m', - }), - parameters: { - content: '', - image: '', - title: 'title', - url: 'url', - }, - url: 'https://share.diasporafoundation.org/', - }, - { - id: 'facebook', - name: intl.formatMessage({ - defaultMessage: 'Facebook', - description: 'Sharing: Facebook', - id: '7iiaRx', - }), - parameters: { - content: '', - image: '', - title: '', - url: 'u', - }, - url: 'https://www.facebook.com/sharer/sharer.php', - }, - { - id: 'linkedin', - name: intl.formatMessage({ - defaultMessage: 'LinkedIn', - description: 'Sharing: LinkedIn', - id: 'csCQQk', - }), - parameters: { - content: '', - image: '', - title: '', - url: 'url', - }, - url: 'https://www.linkedin.com/sharing/share-offsite/', - }, - { - id: 'twitter', - name: intl.formatMessage({ - defaultMessage: 'Twitter', - description: 'Sharing: Twitter', - id: 'WjVBnY', - }), - parameters: { - content: '', - image: '', - title: 'text', - url: 'url', - }, - url: 'https://twitter.com/intent/tweet', - }, - { - id: 'journal-du-hacker', - name: intl.formatMessage({ - defaultMessage: 'Journal du hacker', - description: 'Sharing: Journal du hacker', - id: 'P0I+Xm', - }), - parameters: { - content: '', - image: '', - title: 'title', - url: 'url', - }, - url: 'https://www.journalduhacker.net/stories/new', - }, - { - id: 'email', - name: intl.formatMessage({ - defaultMessage: 'Email', - description: 'Sharing: Email', - id: 'lKZm9t', - }), - parameters: { - content: 'body', - image: '', - title: 'subject', - url: '', - }, - url: 'mailto:', - }, - ]; - - const getItems = () => { - return websites.map((website) => { - const { id, name } = website; - const sharingUrl = getSharingUrl(website); - const linkModifier = `link--${id}`; - - return ( - <li key={id}> - <a - href={sharingUrl} - title={name} - className={`${styles.link} ${styles[linkModifier]}`} - > - <span className="screen-reader-text"> - {intl.formatMessage( - { - defaultMessage: 'Share on {name}', - description: 'Sharing: share on social network text', - id: 'ureXFw', - }, - { name } - )} - </span> - </a> - </li> - ); - }); - }; - - return ( - <ExpandableWidget - title={intl.formatMessage({ - defaultMessage: 'Share', - description: 'Sharing: widget title', - id: 'q3U6uI', - })} - expand={true} - > - <ul className={`${styles.list} ${styles['list--sharing']}`}> - {getItems()} - </ul> - </ExpandableWidget> - ); -}; - -export default Sharing; |
