FIX | Copy fedback message

.env

@@ -1,10 +1,10 @@
-# REACT_APP_MOD=production
-REACT_APP_MOD=local
+REACT_APP_MOD=production
+# REACT_APP_MOD=local
 
 # Sentry logger setup
 
-# SENTRY_ENVIROMENT=production
-SENTRY_ENVIROMENT=develop
+SENTRY_ENVIROMENT=production
+# SENTRY_ENVIROMENT=develop
 
 # The SENTRY_AUTH_TOKEN variable is picked up by the Sentry Build Plugin.
 # It's used for authentication when uploading source maps.

src/components/Fields/DateField.tsx

@@ -7,6 +7,7 @@ import "moment/locale/uk";
 import "./DateField.scss";
 import _ from "lodash";
 import copySvg from "@/assets/img/copy-icon-1.svg";
+import { copyText } from "@/shared/helpers/copy.helpers";
 
 moment.updateLocale("uk", {
   monthsShort: moment
@@ -46,8 +47,7 @@ export const DateField: FC<IProps> = ({
   enableCopy = false,
 }) => {
   const onCopy = (value) => {
-    navigator.clipboard.writeText(value.toString());
-    message.info("Данні скопійовані!");
+    copyText(value);
   };
   const currValue = useMemo(() => (input?.value ? input.value : value), [
     value,

src/containers/Chats/hooks/use-chat-messages.hook.ts

@@ -21,6 +21,7 @@ import { ChatMessageActionEnum, ChatViewModeEnum } from "../enums";
 import { getChatMessageMenuOptions } from "../configs";
 import { chatMessagesApi } from "@/api";
 import { useChatViewModeState } from "./use-chat-view-mode-state.hook";
+import { copyText } from "@/shared/helpers/copy.helpers";
 
 export const useChatMessages = (
   chatId: number,
@@ -57,15 +58,11 @@ export const useChatMessages = (
     firstMessageId,
   });
 
-  // const afterAction = () => {
-  //   resetList();
-  // };
-
   const onCopy = useCallback((message: IChatMessage) => {
     if (message.type === MessageType.Image) {
-      navigator.clipboard.writeText(message.content.fileUrl);
+      copyText(message.content.fileUrl);
     } else if (message.type === MessageType.Text) {
-      navigator.clipboard.writeText(message.content.message);
+      copyText(message.content.message);
     }
   }, []);
 

src/shared/components/fields/contact-field.component.tsx

@@ -2,7 +2,8 @@ import React, { FC, CSSProperties } from "react";
 import "./styles.scss";
 import { AsYouType } from "libphonenumber-js";
 import copySvg from "@/assets/img/copy-icon-1.svg";
-import { notification } from "@/shared/tools";
+import { copyText } from "@/shared/helpers/copy.helpers";
+
 interface IProps {
   label: string;
   value: string | number;
@@ -29,9 +30,9 @@ export const ContactField: FC<IProps> = ({
   const formattedPhone = value ? new AsYouType().input(value?.toString()) : "";
 
   const onCopy = (event) => {
-    event.stopPropagation();
-    navigator.clipboard.writeText(value.toString());
-    notification.showSuccess("Успішно", "Данні скопійовані!");
+    if (!value) return;
+
+    copyText(value, event);
   };
 
   return (
@@ -47,11 +48,13 @@ export const ContactField: FC<IProps> = ({
         )}
         <div className="images">
           <img src={svgIcon} />
+
           <img
             className="contact-copy"
             src={copySvg}
             alt="copy"
             onClick={onCopy}
+            style={{ opacity: value ? 1 : 0.5 }}
           />
         </div>
       </div>

src/shared/components/fields/functional-email-field.component.tsx

@@ -2,6 +2,7 @@ import React, { FC, CSSProperties } from "react";
 import copySvg from "@/assets/img/copy-icon-1.svg";
 import { message } from "antd";
 import "./styles.scss";
+import { copyText } from "@/shared/helpers/copy.helpers";
 
 interface IProps {
   label: string;
@@ -18,15 +19,8 @@ export const FunctionalEmailField: FC<IProps> = ({
   onClick,
   enableCopy,
 }) => {
-  const onCopy = (value) => {
-    navigator.clipboard.writeText(value.toString());
-    message.info("Данні скопійовані!");
-  };
-
   const handleIconClick = (event) => {
-    event.stopPropagation();
-
-    onCopy(value);
+    copyText(value, event);
   };
 
   return (

src/shared/components/fields/input-field.component.tsx

@@ -2,6 +2,7 @@ import React, { FC, CSSProperties } from "react";
 import { Input, message } from "antd";
 import "./styles.scss";
 import copySvg from "@/assets/img/copy-icon-1.svg";
+import { copyText } from "@/shared/helpers/copy.helpers";
 
 interface IProps {
   label: string;
@@ -31,8 +32,7 @@ export const InputField: FC<IProps> = ({
   enableCopy = false,
 }) => {
   const onCopy = (value) => {
-    navigator.clipboard.writeText(value.toString());
-    message.info("Данні скопійовані!");
+    copyText(value);
   };
 
   return (

src/shared/components/fields/input-mask-field.component.tsx

@@ -4,6 +4,7 @@ import copySvg from "@/assets/img/copy-icon-1.svg";
 import "./styles.scss";
 import { message } from "antd";
 import PhoneInput from "react-phone-input-2";
+import { copyText } from "@/shared/helpers/copy.helpers";
 
 export interface ISelection {
   start: number;
@@ -38,8 +39,7 @@ export const InputMaskField: FC<IProps> = ({
   enableCopy = false,
 }) => {
   const onCopy = (value) => {
-    navigator.clipboard.writeText(value.toString());
-    message.info("Данні скопійовані!");
+    copyText(value);
   };
   return (
     <div className="input-mask-field" style={style}>

src/shared/components/fields/styles.scss

@@ -83,6 +83,7 @@ $border-radius: 10px;
     top: 34px;
     right: 10px;
     cursor: pointer;
+    z-index: 99;
   }
 
   .input-label {
@@ -410,6 +411,11 @@ $border-radius: 10px;
   .contact-copy {
     margin-left: 15px;
     cursor: pointer;
+    position: relative;
+    z-index: 99;
+    &:hover {
+      opacity: 0.5;
+    }
   }
 }
 

src/shared/helpers/copy.helpers.ts

@@ -0,0 +1,8 @@
+import { notification } from "../tools";
+
+export const copyText = (value: any, event?: any) => {
+  if (event) event.stopPropagation();
+
+  navigator.clipboard.writeText(value.toString());
+  notification.showSuccess("Успішно", "Данні скопійовані!");
+};