feat: 회의 생성페이지 webShare api

src/hooks/useShareLink.ts

@@ -0,0 +1,34 @@
+import { useParams } from 'react-router-dom';
+import { notify } from 'utils/toast/copyLinkToast';
+
+const useShareLink = () => {
+  const { meetingId } = useParams();
+
+  const inviteURL = `${window.location.origin}/meet/${meetingId}`;
+  const shareData = {
+    title: 'ASAP',
+    text: '회의 시간을 입력해주세요',
+    url: inviteURL,
+  };
+
+  const handleCopyToClipboard = async () => {
+    try {
+      await navigator.clipboard.writeText(inviteURL);
+      notify();
+    } catch {
+      alert('링크복사에 실패했습니다. \n 다시 시도해주세요.');
+    }
+  };
+
+  const handleWebShare = async () => {
+    if (navigator.share) {
+      navigator.share(shareData);
+    } else {
+      handleCopyToClipboard();
+    }
+  };
+
+  return { inviteURL, handleCopyToClipboard, handleWebShare };
+};
+
+export default useShareLink;

src/components/common/moleculesComponents/Header.tsx

@@ -5,8 +5,8 @@ import { BackIc, ExitIc, HambergerIc, LinkIc, MainLogoIc } from 'components/Icon
 import { useScheduleStepContext } from 'pages/selectSchedule/contexts/useScheduleStepContext';
 import { ScheduleStepType } from 'pages/selectSchedule/types';
 import CopyToClipboard from 'react-copy-to-clipboard';
-import { useParams } from 'react-router';
-import { useNavigate } from 'react-router-dom';
+import { useNavigate, useParams } from 'react-router-dom';
+import useShareLink from 'src/\bhooks/useShareLink';
 import styled from 'styled-components';
 import { theme } from 'styles/theme';
 
@@ -23,6 +23,10 @@ interface HeaderProps {
 
 function Header({ position, setFunnelStep }: HeaderProps) {
   const { scheduleStep, setScheduleStep } = useScheduleStepContext();
+  const { meetingId } = useParams();
+
+  const {inviteURL, handleWebShare} = useShareLink();
+
   const navigationOptions = [
     {
       title: '회의 일정 정하기',
@@ -57,30 +61,8 @@ function Header({ position, setFunnelStep }: HeaderProps) {
       }
     }
   };
+  console.log(window.location.origin);
 
-  const { meetingId } = useParams();
-
-  const shareData = {
-    title: "ASAP",
-    text: "회의 시간을 입력해주세요",
-    url: `${import.meta.env.VITE_WEB_IP}/meet/${meetingId}`,
-  };
-
-  const handleWebShare=async()=>{
-    // if (navigator.share && navigator.canShare(shareData)) {
-    //   console.log("test");
-      try{
-        await navigator.share(shareData);
-      }
-      catch(err){
-        alert(err + "지원하지 않는 브라우저");
-      }
-  //  } else {
-  //    alert("out");
-  //  }
-//test
-
-  }
   return (
     <>
       <HeaderWrapper>
@@ -129,8 +111,9 @@ function Header({ position, setFunnelStep }: HeaderProps) {
           {(position==="completeCreateMeeting" || position==="cueCard" || position==="confirmMeet") &&
             <LinkIcWrapper>
              {/* <IconSection onClick={notify}> */}
-             <IconSection onClick={handleWebShare}>
-            <CopyToClipboard text={ position==="cueCard" ? `${import.meta.env.VITE_WEB_IP}/q-card/${meetingId}`:`${import.meta.env.VITE_WEB_IP}/meet/${meetingId}` }>
+           <IconSection onClick={handleWebShare}>
+
+            <CopyToClipboard text={ position==="cueCard" ? `${import.meta.env.VITE_WEB_IP}/q-card/${meetingId}`:inviteURL }>
           <LinkIc/>
           </CopyToClipboard>
           </IconSection>

src/pages/selectSchedule/components/selectPriority/PriorityDropdown.tsx

@@ -132,7 +132,6 @@ function PriorityDropdown() {
       return updatedInput;
     });
   };
-  //test
   return (
     <PriorityDropdownWrapper>
       {isOpenDropDown.map((item, idx) => (