diff --git a/frontend/src/views/Settings/OrgSettingsPage/components/OrgMembersTable/OrgMembersTable.tsx b/frontend/src/views/Settings/OrgSettingsPage/components/OrgMembersTable/OrgMembersTable.tsx index 5c2a1fc44..38d45b577 100644 --- a/frontend/src/views/Settings/OrgSettingsPage/components/OrgMembersTable/OrgMembersTable.tsx +++ b/frontend/src/views/Settings/OrgSettingsPage/components/OrgMembersTable/OrgMembersTable.tsx @@ -1,4 +1,4 @@ -import { Dispatch, SetStateAction, useMemo, useState } from 'react'; +import { Dispatch, SetStateAction, useEffect, useMemo, useState } from 'react'; import { Controller, useForm } from 'react-hook-form'; import { useRouter } from 'next/router'; import { faCheck, faCopy, faMagnifyingGlass, faPlus, faTrash, faUsers } from '@fortawesome/free-solid-svg-icons'; @@ -27,7 +27,7 @@ import { THead, Tr, UpgradePlanModal} from '@app/components/v2'; -import { usePopUp } from '@app/hooks'; +import { usePopUp, useToggle } from '@app/hooks'; import { useFetchServerStatus } from '@app/hooks/api/serverDetails'; import { OrgUser, Workspace } from '@app/hooks/api/types'; @@ -70,6 +70,7 @@ export const OrgMembersTable = ({ const router = useRouter(); const [searchMemberFilter, setSearchMemberFilter] = useState(''); const {data: serverDetails } = useFetchServerStatus() + const [isInviteLinkCopied, setInviteLinkCopied] = useToggle(false); const { handlePopUpToggle, popUp, handlePopUpOpen, handlePopUpClose } = usePopUp([ 'addMember', 'removeMember', @@ -116,9 +117,17 @@ export const OrgMembersTable = ({ [members, searchMemberFilter] ); + useEffect(() => { + let timer: NodeJS.Timeout; + if (isInviteLinkCopied) { + timer = setTimeout(() => setInviteLinkCopied.off(), 2000); + } + return () => clearTimeout(timer); + }, [isInviteLinkCopied]); + const copyTokenToClipboard = () => { navigator.clipboard.writeText(completeInviteLink as string); - // setIsTokenCopied.on(); + setInviteLinkCopied.on(); }; return ( @@ -303,7 +312,7 @@ export const OrgMembersTable = ({ className="group relative" onClick={copyTokenToClipboard} > - + click to copy @@ -328,4 +337,4 @@ export const OrgMembersTable = ({ /> ); -}; +}; \ No newline at end of file