From f02f6c01b791d0ef3ed6b051dd9d35025365a764 Mon Sep 17 00:00:00 2001
From: Struchkov Mark <mark@struchkov.dev>
Date: Sun, 8 Sep 2024 14:38:50 +0300
Subject: [PATCH] _SocialShare.tsx

---
 quartz/components/_SocialShare.tsx | 94 ++++++++++++++----------------
 1 file changed, 44 insertions(+), 50 deletions(-)

diff --git a/quartz/components/_SocialShare.tsx b/quartz/components/_SocialShare.tsx
index 51c317bf4..19f826b40 100644
--- a/quartz/components/_SocialShare.tsx
+++ b/quartz/components/_SocialShare.tsx
@@ -1,4 +1,5 @@
 import { QuartzComponent, QuartzComponentConstructor, QuartzComponentProps } from "./types"
+// If `script` is required but causes type issues, consider fixing the type instead of ignoring.
 // @ts-ignore
 import script from "./scripts/_socialshare.inline"
 import style from "./styles/_socialshare.scss.scss"
@@ -7,71 +8,64 @@ const SocialShare: QuartzComponent = ({ displayClass, fileData }: QuartzComponen
   return (
     <div className="post-share">
       <div className="share-link">
-        <a className="share-icon share-telegram"
-           href="javascript:void(0);"
-           title="Поделиться в Telegram"
-           data-sharer="telegram"
-           data-url="{{url absolute=" true"}}"
-           data-title="{{title}}"
-           data-caption="{{custom_excerpt}}">
+        <a
+          className="share-icon share-telegram"
+          href="#"
+          onClick={(e) => e.preventDefault()}
+          title="Поделиться в Telegram"
+          data-sharer="telegram"
+          data-url={`{{url absolute=true}}`}
+          data-title="{{title}}"
+          data-caption="{{custom_excerpt}}"
+        >
           <span className="svg-social-icon icon-telegram"></span>
         </a>
       </div>
       <div className="share-link">
-        <a className="share-icon share-twitter"
-           href="javascript:void(0);"
-           title="Поделиться в Twitter"
-           data-sharer="twitter"
-           data-url="{{url absolute=" true"}}"
-           data-title="{{title}}">
+        <a
+          className="share-icon share-twitter"
+          href="#"
+          onClick={(e) => e.preventDefault()}
+          title="Поделиться в Twitter"
+          data-sharer="twitter"
+          data-url={`{{url absolute=true}}`}
+          data-title="{{title}}"
+        >
           <span className="svg-social-icon icon-twitter"></span>
         </a>
       </div>
-      <!--    <div class="share-link">-->
-      <!--        <a class="share-icon share-whatsapp"-->
-      <!--           href="javascript:void(0);"-->
-      <!--           title="Поделиться в WhatsApp"-->
-      <!--           data-sharer="whatsapp"-->
-      <!--           data-url="{{url absolute="true"}}"-->
-      <!--           data-title="{{title}}"-->
-      <!--           data-web="">-->
-      <!--            <span class="svg-social-icon icon-whatsapp"></span>-->
-      <!--        </a>-->
-      <!--    </div>-->
-      <!--    <div class="share-link">-->
-      <!--        <a class="share-icon share-vk"-->
-      <!--           href="javascript:void(0);"-->
-      <!--           title="Поделиться в VK"-->
-      <!--           data-sharer="vk"-->
-      <!--           data-url="{{url absolute="true"}}"-->
-      <!--           data-title="{{title}}"-->
-      <!--           data-caption="{{custom_excerpt}}">-->
-      <!--            <span class="svg-social-icon icon-vk"></span>-->
-      <!--        </a>-->
-      <!--    </div>-->
+      {/* Uncomment and fix other sections as needed */}
       <div className="share-link">
-        <a className="share-icon share-pocket"
-           href="javascript:void(0);"
-           title="Поделиться в Pocket"
-           data-title="{{title}}"
-           data-sharer="pocket"
-           data-url="{{url absolute=" true"}}">
+        <a
+          className="share-icon share-pocket"
+          href="#"
+          onClick={(e) => e.preventDefault()}
+          title="Поделиться в Pocket"
+          data-title="{{title}}"
+          data-sharer="pocket"
+          data-url={`{{url absolute=true}}`}
+        >
           <span className="svg-social-icon icon-pocket"></span>
         </a>
       </div>
       <div className="share-link">
-        <a className="share-icon share-skype"
-           href="javascript:void(0);"
-           title="Поделиться в Skype"
-           data-sharer="skype"
-           data-url="{{url absolute=" true"}}"
-           data-title="{{title}}">
+        <a
+          className="share-icon share-skype"
+          href="#"
+          onClick={(e) => e.preventDefault()}
+          title="Поделиться в Skype"
+          data-sharer="skype"
+          data-url={`{{url absolute=true}}`}
+          data-title="{{title}}"
+        >
           <span className="svg-social-icon icon-skype"></span>
         </a>
       </div>
     </div>
   )
 }
-RandomPageButton.css = style
-RandomPageButton.afterDOMLoaded = script
-export default (() => RandomPageButton) satisfies QuartzComponentConstructor
+
+SocialShare.css = style;
+SocialShare.afterDOMLoaded = script;
+
+export default (() => SocialShare) satisfies QuartzComponentConstructor;