dify

2025-12-01 17:21:38 +08:00
parent 32fee2b8ab
commit fab8c13cb3
7511 changed files with 996300 additions and 0 deletions
--- a/dify/web/app/components/header/account-setting/members-page/invited-modal/invitation-link.tsx
+++ b/dify/web/app/components/header/account-setting/members-page/invited-modal/invitation-link.tsx
@@ -0,0 +1,60 @@
+'use client'
+import React, { useCallback, useEffect, useState } from 'react'
+import { t } from 'i18next'
+import copy from 'copy-to-clipboard'
+import s from './index.module.css'
+import type { SuccessInvitationResult } from '.'
+import Tooltip from '@/app/components/base/tooltip'
+
+type IInvitationLinkProps = {
+  value: SuccessInvitationResult
+}
+
+const InvitationLink = ({
+  value,
+}: IInvitationLinkProps) => {
+  const [isCopied, setIsCopied] = useState(false)
+
+  const copyHandle = useCallback(() => {
+    // No prefix is needed here because the backend has already processed it
+    copy(`${!value.url.startsWith('http') ? window.location.origin : ''}${value.url}`)
+    setIsCopied(true)
+  }, [value])
+
+  useEffect(() => {
+    if (isCopied) {
+      const timeout = setTimeout(() => {
+        setIsCopied(false)
+      }, 1000)
+
+      return () => {
+        clearTimeout(timeout)
+      }
+    }
+  }, [isCopied])
+
+  return (
+    <div className='flex items-center rounded-lg border border-components-input-border-active bg-components-input-bg-normal py-2 hover:bg-state-base-hover'>
+      <div className="flex h-5 grow items-center">
+        <div className='relative h-full grow text-[13px]'>
+          <Tooltip
+            popupContent={isCopied ? `${t('appApi.copied')}` : `${t('appApi.copy')}`}
+          >
+            <div className='r-0 absolute left-0 top-0 w-full cursor-pointer truncate pl-2 pr-2 text-text-primary' onClick={copyHandle}>{value.url}</div>
+          </Tooltip>
+        </div>
+        <div className="h-4 shrink-0 border bg-divider-regular" />
+        <Tooltip
+          popupContent={isCopied ? `${t('appApi.copied')}` : `${t('appApi.copy')}`}
+        >
+          <div className="shrink-0 px-0.5">
+            <div className={`box-border flex h-[30px] w-[30px] cursor-pointer items-center justify-center rounded-lg hover:bg-state-base-hover ${s.copyIcon} ${isCopied ? s.copied : ''}`} onClick={copyHandle}>
+            </div>
+          </div>
+        </Tooltip>
+      </div>
+    </div>
+  )
+}
+
+export default InvitationLink