diff --git a/components/ShareButtons.js b/components/ShareButtons.js
index e3714b79..853aa3a4 100644
--- a/components/ShareButtons.js
+++ b/components/ShareButtons.js
@@ -1,53 +1,52 @@
import { siteConfig } from '@/lib/config'
import { useGlobal } from '@/lib/global'
-import copy from 'copy-to-clipboard'
import dynamic from 'next/dynamic'
import { useRouter } from 'next/router'
-import { useState } from 'react'
+import { useEffect, useState } from 'react'
import {
- FacebookShareButton,
- FacebookIcon,
- FacebookMessengerShareButton,
- FacebookMessengerIcon,
- RedditShareButton,
- RedditIcon,
- LineShareButton,
- LineIcon,
- EmailShareButton,
EmailIcon,
- TwitterShareButton,
- TwitterIcon,
- TelegramShareButton,
- TelegramIcon,
- WhatsappShareButton,
- WhatsappIcon,
- LinkedinShareButton,
+ EmailShareButton,
+ FacebookIcon,
+ FacebookMessengerIcon,
+ FacebookMessengerShareButton,
+ FacebookShareButton,
+ HatenaIcon,
+ HatenaShareButton,
+ InstapaperIcon,
+ InstapaperShareButton,
+ LineIcon,
+ LineShareButton,
LinkedinIcon,
- PinterestShareButton,
- PinterestIcon,
- VKIcon,
- VKShareButton,
- OKShareButton,
- OKIcon,
- TumblrShareButton,
- TumblrIcon,
+ LinkedinShareButton,
LivejournalIcon,
LivejournalShareButton,
- MailruShareButton,
MailruIcon,
+ MailruShareButton,
+ OKIcon,
+ OKShareButton,
+ PinterestIcon,
+ PinterestShareButton,
+ PocketIcon,
+ PocketShareButton,
+ RedditIcon,
+ RedditShareButton,
+ TelegramIcon,
+ TelegramShareButton,
+ TumblrIcon,
+ TumblrShareButton,
+ TwitterIcon,
+ TwitterShareButton,
+ VKIcon,
+ VKShareButton,
ViberIcon,
ViberShareButton,
- WorkplaceShareButton,
- WorkplaceIcon,
- WeiboShareButton,
WeiboIcon,
- PocketShareButton,
- PocketIcon,
- InstapaperShareButton,
- InstapaperIcon,
- HatenaShareButton,
- HatenaIcon
+ WeiboShareButton,
+ WhatsappIcon,
+ WhatsappShareButton,
+ WorkplaceIcon,
+ WorkplaceShareButton
} from 'react-share'
const QrCode = dynamic(() => import('@/components/QrCode'), { ssr: false })
@@ -59,10 +58,11 @@ const QrCode = dynamic(() => import('@/components/QrCode'), { ssr: false })
*/
const ShareButtons = ({ post }) => {
const router = useRouter()
- const shareUrl = siteConfig('LINK') + router.asPath
+ const [shareUrl, setShareUrl] = useState(siteConfig('LINK') + router.asPath)
const title = post.title || siteConfig('TITLE')
const image = post.pageCover
- const body = post?.title + ' | ' + title + ' ' + shareUrl + ' ' + post?.summary
+ const body =
+ post?.title + ' | ' + title + ' ' + shareUrl + ' ' + post?.summary
const services = siteConfig('POSTS_SHARE_SERVICES').split(',')
const titleWithSiteInfo = title + ' | ' + siteConfig('TITLE')
@@ -70,8 +70,8 @@ const ShareButtons = ({ post }) => {
const [qrCodeShow, setQrCodeShow] = useState(false)
const copyUrl = () => {
- copy(shareUrl)
- alert(locale.COMMON.URL_COPIED)
+ navigator?.clipboard?.writeText(shareUrl)
+ alert(locale.COMMON.URL_COPIED + ' \n' + shareUrl)
}
const openPopover = () => {
@@ -81,300 +81,308 @@ const ShareButtons = ({ post }) => {
setQrCodeShow(false)
}
+ useEffect(() => {
+ setShareUrl(window.location.href)
+ }, [])
+
return (
- <>
- {services.map(singleService => {
- if (singleService === 'facebook') {
- return (
-
-
-
- )
- }
- if (singleService === 'messenger') {
- return (
-
-
-
- )
- }
- if (singleService === 'line') {
- return (
-
-
-
- )
- }
- if (singleService === 'reddit') {
- return (
-
-
-
- )
- }
- if (singleService === 'email') {
- return (
-
-
-
- )
- }
- if (singleService === 'twitter') {
- return (
-
-
-
- )
- }
- if (singleService === 'telegram') {
- return (
-
-
-
- )
- }
- if (singleService === 'whatsapp') {
- return (
-
-
-
- )
- }
- if (singleService === 'linkedin') {
- return (
-
-
-
- )
- }
- if (singleService === 'pinterest') {
- return (
-
-
-
- )
- }
- if (singleService === 'vkshare') {
- return (
-
-
-
- )
- }
- if (singleService === 'okshare') {
- return (
-
-
-
- )
- }
- if (singleService === 'tumblr') {
- return (
-
-
-
- )
- }
- if (singleService === 'livejournal') {
- return (
-
-
-
- )
- }
- if (singleService === 'mailru') {
- return (
-
-
-
- )
- }
- if (singleService === 'viber') {
- return (
-
-
-
- )
- }
- if (singleService === 'workplace') {
- return (
-
-
-
- )
- }
- if (singleService === 'weibo') {
- return (
-
-
-
- )
- }
- if (singleService === 'pocket') {
- return (
-
-
-
- )
- }
- if (singleService === 'instapaper') {
- return (
-
-
-
- )
- }
- if (singleService === 'hatena') {
- return (
-
-
-
- )
- }
- if (singleService === 'qq') {
- return
- }
- if (singleService === 'wechat') {
- return
- }
- if (singleService === 'link') {
- return
- }
- return <>>
- })}
- >
+ <>
+ {services.map(singleService => {
+ if (singleService === 'facebook') {
+ return (
+
+
+
+ )
+ }
+ if (singleService === 'messenger') {
+ return (
+
+
+
+ )
+ }
+ if (singleService === 'line') {
+ return (
+
+
+
+ )
+ }
+ if (singleService === 'reddit') {
+ return (
+
+
+
+ )
+ }
+ if (singleService === 'email') {
+ return (
+
+
+
+ )
+ }
+ if (singleService === 'twitter') {
+ return (
+
+
+
+ )
+ }
+ if (singleService === 'telegram') {
+ return (
+
+
+
+ )
+ }
+ if (singleService === 'whatsapp') {
+ return (
+
+
+
+ )
+ }
+ if (singleService === 'linkedin') {
+ return (
+
+
+
+ )
+ }
+ if (singleService === 'pinterest') {
+ return (
+
+
+
+ )
+ }
+ if (singleService === 'vkshare') {
+ return (
+
+
+
+ )
+ }
+ if (singleService === 'okshare') {
+ return (
+
+
+
+ )
+ }
+ if (singleService === 'tumblr') {
+ return (
+
+
+
+ )
+ }
+ if (singleService === 'livejournal') {
+ return (
+
+
+
+ )
+ }
+ if (singleService === 'mailru') {
+ return (
+
+
+
+ )
+ }
+ if (singleService === 'viber') {
+ return (
+
+
+
+ )
+ }
+ if (singleService === 'workplace') {
+ return (
+
+
+
+ )
+ }
+ if (singleService === 'weibo') {
+ return (
+
+
+
+ )
+ }
+ if (singleService === 'pocket') {
+ return (
+
+
+
+ )
+ }
+ if (singleService === 'instapaper') {
+ return (
+
+
+
+ )
+ }
+ if (singleService === 'hatena') {
+ return (
+
+
+
+ )
+ }
+ if (singleService === 'qq') {
+ return (
+
+ )
+ }
+ if (singleService === 'wechat') {
+ return (
+
+ )
+ }
+ if (singleService === 'link') {
+ return (
+
+ )
+ }
+ return <>>
+ })}
+ >
)
}
diff --git a/package.json b/package.json
index 5a4a8cce..c17bd829 100644
--- a/package.json
+++ b/package.json
@@ -28,8 +28,6 @@
"algoliasearch": "^4.18.0",
"animejs": "^3.2.1",
"aos": "^2.3.4",
- "axios": ">=0.21.1",
- "copy-to-clipboard": "^3.3.1",
"feed": "^4.2.2",
"js-md5": "^0.7.3",
"localStorage": "^1.0.4",
@@ -40,8 +38,6 @@
"notion-client": "6.15.6",
"notion-utils": "6.15.6",
"nprogress": "^0.2.0",
- "preact": "^10.5.15",
- "prism-themes": "1.9.0",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-facebook": "^8.1.4",
diff --git a/yarn.lock b/yarn.lock
index 8e4cfd52..c5711de7 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -4146,11 +4146,6 @@ postcss@^8.4.23, postcss@^8.4.31, postcss@^8.4.33:
picocolors "^1.0.0"
source-map-js "^1.0.2"
-preact@^10.5.15:
- version "10.19.3"
- resolved "https://registry.yarnpkg.com/preact/-/preact-10.19.3.tgz#7a7107ed2598a60676c943709ea3efb8aaafa899"
- integrity sha512-nHHTeFVBTHRGxJXKkKu5hT8C/YWBkPso4/Gad6xuj5dbptt9iF9NZr9pHbPhBrnT2klheu7mHTxTZ/LjwJiEiQ==
-
prelude-ls@^1.2.1:
version "1.2.1"
resolved "https://registry.yarnpkg.com/prelude-ls/-/prelude-ls-1.2.1.tgz#debc6489d7a6e6b0e7611888cec880337d316396"
@@ -4168,11 +4163,6 @@ prettier@3.2.5:
resolved "https://r.cnpmjs.org/prettier/-/prettier-3.2.5.tgz#e52bc3090586e824964a8813b09aba6233b28368"
integrity sha512-3/GWa9aOC0YeD7LUfvOG2NiDyhOWRvt1k+rcKhOuYnMY24iiCphgneUfJDyFXd6rZCAnuLBv6UeAULtrhT/F4A==
-prism-themes@1.9.0:
- version "1.9.0"
- resolved "https://registry.yarnpkg.com/prism-themes/-/prism-themes-1.9.0.tgz#19c034f3205f1e28d75d89728e54ccd745f7e3dd"
- integrity sha512-tX2AYsehKDw1EORwBps+WhBFKc2kxfoFpQAjxBndbZKr4fRmMkv47XN0BghC/K1qwodB1otbe4oF23vUTFDokw==
-
prismjs@^1.27.0:
version "1.29.0"
resolved "https://registry.yarnpkg.com/prismjs/-/prismjs-1.29.0.tgz#f113555a8fa9b57c35e637bba27509dcf802dd12"