Donation fix copyable (#118)

* Button linck bank * button linck * images avatar page plug * link --------- Co-authored-by: Максим Коробков <[email protected]>
korobprog · Nov 30, 2023 · 78eaf71 · 78eaf71
1 parent e36023e
commit 78eaf71
Show file tree

Hide file tree

Showing 6 changed files with 43 additions and 4 deletions.
diff --git a/packages/common/src/components/forms/profile/PageForm.tsx b/packages/common/src/components/forms/profile/PageForm.tsx
@@ -18,6 +18,7 @@ import { InfoCircleOutlined } from "@ant-design/icons";
 import telegram from "common/src/images/telegram.svg";
 import whats from "common/src/images/whatsapp.svg";
 import email from "common/src/images/email.svg";
+import link from "common/src/images/link_b.svg";
 import { CurrentUser } from "common/src/services/api/useCurrentUser";
 import logo from "../../../images/book-danation.svg";
 import printPdfDonations from "./printPdfDonations";
@@ -206,12 +207,33 @@ export const PageForm = (props: Props) => {
             width={30}
             preview={false}
           />
+          <Form.Item name="socialeMail">
+            <Input
+              disabled={disabled}
+              placeholder="eMail"
+              suffix={
+                <Tooltip title="Пример: [email protected]">
+                  <InfoCircleOutlined style={{ color: "rgba(0,0,0,.45)" }} />
+                </Tooltip>
+              }
+            />
+          </Form.Item>
+        </Space>
+        <Space>
+          <Image
+            style={{ position: "absolute", top: -10, left: 5 }}
+            alt="link"
+            src={link}
+            height={30}
+            width={30}
+            preview={false}
+          />
           <Form.Item name="socialLink">
             <Input
               disabled={disabled}
               placeholder="другие ссылки"
               suffix={
-                <Tooltip title="Пример: mymail@mail.com">
+                <Tooltip title="Пример: www.exemple.com">
                   <InfoCircleOutlined style={{ color: "rgba(0,0,0,.45)" }} />
                 </Tooltip>
               }

diff --git a/packages/common/src/images/link_a.svg b/packages/common/src/images/link_a.svg
diff --git a/packages/common/src/images/link_b.svg b/packages/common/src/images/link_b.svg
diff --git a/packages/common/src/services/api/donation.ts b/packages/common/src/services/api/donation.ts
@@ -12,6 +12,7 @@ export type DonationPageDoc = {
   banks: BankItem[];
   socialTelegram?: string;
   socialWhats?: string;
+  socialeMail?: string;
   socialLink?: string;
   avatar?: string;
   userName?: string;

diff --git a/packages/donation/src/pages/page.tsx b/packages/donation/src/pages/page.tsx
@@ -10,6 +10,7 @@ import { apiRefs } from "common/src/services/api/refs";
 import telegram from "common/src/images/telegram.svg";
 import whats from "common/src/images/whatsapp.svg";
 import email from "common/src/images/email.svg";
+import link from "common/src/images/link_b.svg";
 import logo from "common/src/images/logo.png";
 
 export const Page = () => {
@@ -19,6 +20,7 @@ export const Page = () => {
     socialTelegram: "",
     socialWhats: "",
     socialLink: "",
+    socialeMail: "",
     avatar: "",
     userName: "",
     greetingText: "",
@@ -31,7 +33,8 @@ export const Page = () => {
   );
   const initialValues = donationPageDocData || initialPageDoc;
 
-  const { socialTelegram, socialWhats, socialLink, avatar, userName, greetingText } = initialValues;
+  const { socialTelegram, socialWhats, socialLink, avatar, userName, greetingText, socialeMail } =
+    initialValues;
 
   const downloadQRCode = () => {
     const canvas = document.getElementById("myqrcode")?.querySelector<HTMLCanvasElement>("canvas");
@@ -123,7 +126,9 @@ export const Page = () => {
               alignItems: "flex-start",
             }}
           >
-            {socialTelegram || socialWhats || socialLink ? <Text>My contacts</Text> : null}
+            {socialTelegram || socialWhats || socialeMail || socialLink ? (
+              <Text>My contacts</Text>
+            ) : null}
             {!telegram || socialTelegram ? (
               <Paragraph>
                 <Image alt="socialTelegram" src={telegram} height={30} width={30} preview={false} />
@@ -140,10 +145,18 @@ export const Page = () => {
                 </Link>
               </Paragraph>
             ) : null}
-            {!email || socialLink ? (
+            {!email || socialeMail ? (
               <Paragraph>
                 <Image alt="socialLink" src={email} height={30} width={30} preview={false} />
                 <Link style={{ marginLeft: 5 }} href={`mailto:${socialLink}`} target="_blank">
+                  {socialeMail}
+                </Link>
+              </Paragraph>
+            ) : null}
+            {!link || socialLink ? (
+              <Paragraph>
+                <Image alt="socialLink" src={link} height={30} width={30} preview={false} />
+                <Link style={{ marginLeft: 5 }} href={socialLink} target="_blank">
                   {socialLink}
                 </Link>
               </Paragraph>

diff --git a/packages/tracker/src/pages/donationsPage.tsx b/packages/tracker/src/pages/donationsPage.tsx
@@ -21,6 +21,7 @@ const PageDonations = ({ currentUser }: Props) => {
     active: false,
     socialTelegram: "",
     socialWhats: "",
+    socialeMail: "",
     socialLink: "",
     avatar: "",
     userName: "",