From c4583424dfbb3584ea1c77de5b3ad209438d775a Mon Sep 17 00:00:00 2001 From: spencerwooo Date: Thu, 24 Feb 2022 15:49:11 +0800 Subject: [PATCH] readable link only on customise panel --- components/CustomEmbedLinkMenu.tsx | 67 +++++++++++++++------------- components/DownloadBtnGtoup.tsx | 5 +-- components/FolderGridLayout.tsx | 7 ++- components/FolderListLayout.tsx | 9 +--- components/previews/VideoPreview.tsx | 5 +-- 5 files changed, 44 insertions(+), 49 deletions(-) diff --git a/components/CustomEmbedLinkMenu.tsx b/components/CustomEmbedLinkMenu.tsx index 1a09669..c454801 100644 --- a/components/CustomEmbedLinkMenu.tsx +++ b/components/CustomEmbedLinkMenu.tsx @@ -1,5 +1,4 @@ import { Dispatch, Fragment, SetStateAction, useRef, useState } from 'react' -import toast from 'react-hot-toast' import { useTranslation } from 'next-i18next' import { Dialog, Transition } from '@headlessui/react' import { FontAwesomeIcon } from '@fortawesome/react-fontawesome' @@ -9,6 +8,24 @@ import { getBaseUrl } from '../utils/getBaseUrl' import { getStoredToken } from '../utils/protectedRouteHandler' import { getReadablePath } from '../utils/getReadablePath' +function LinkContainer({ title, value }: { title: string; value: string }) { + const clipboard = useClipboard({ copiedTimeout: 1000 }) + return ( + <> +

{title}

+
+
{value}
+ +
+ + ) +} + export default function CustomEmbedLinkMenu({ path, menuOpen, @@ -19,7 +36,6 @@ export default function CustomEmbedLinkMenu({ setMenuOpen: Dispatch> }) { const { t } = useTranslation() - const clipboard = useClipboard() const hashedToken = getStoredToken(path) @@ -79,39 +95,30 @@ export default function CustomEmbedLinkMenu({

{t('Filename')}

setName(e.target.value)} /> -

{t('Default')}

-
- {`${getBaseUrl()}/api/raw/?path=${readablePath}${hashedToken ? `&odpt=${hashedToken}` : ''}`} -
-

{t('Customised')}

-
- {`${getBaseUrl()}/api/name/`} - {name} - {`/?path=${readablePath}${hashedToken ? `&odpt=${hashedToken}` : ''}`} -
-
-
- + + + +
diff --git a/components/DownloadBtnGtoup.tsx b/components/DownloadBtnGtoup.tsx index 030e295..24eed57 100644 --- a/components/DownloadBtnGtoup.tsx +++ b/components/DownloadBtnGtoup.tsx @@ -9,7 +9,6 @@ import Image from 'next/image' import { useRouter } from 'next/router' import { getBaseUrl } from '../utils/getBaseUrl' -import { getReadablePath } from '../utils/getReadablePath' import { getStoredToken } from '../utils/protectedRouteHandler' import CustomEmbedLinkMenu from './CustomEmbedLinkMenu' @@ -92,9 +91,7 @@ const DownloadButtonGroup = () => { /> */} { - clipboard.copy( - `${getBaseUrl()}/api/raw/?path=${getReadablePath(asPath)}${hashedToken ? `&odpt=${hashedToken}` : ''}` - ) + clipboard.copy(`${getBaseUrl()}/api/raw/?path=${asPath}${hashedToken ? `&odpt=${hashedToken}` : ''}`) toast.success(t('Copied direct link to clipboard.')) }} btnColor="pink" diff --git a/components/FolderGridLayout.tsx b/components/FolderGridLayout.tsx index d8bc309..9e4cbac 100644 --- a/components/FolderGridLayout.tsx +++ b/components/FolderGridLayout.tsx @@ -8,7 +8,6 @@ import { useTranslation } from 'next-i18next' import { getBaseUrl } from '../utils/getBaseUrl' import { formatModifiedDateTime } from '../utils/fileDetails' -import { getReadablePath } from '../utils/getReadablePath' import { Checkbox, ChildIcon, ChildName, Downloading } from './FileListing' import { getStoredToken } from '../utils/protectedRouteHandler' @@ -115,7 +114,7 @@ const FolderGridLayout = ({ title={t('Copy folder permalink')} className="cursor-pointer rounded px-1.5 py-1 hover:bg-gray-300 dark:hover:bg-gray-600" onClick={() => { - clipboard.copy(`${getBaseUrl()}${getReadablePath(getItemPath(c.name))}`) + clipboard.copy(`${getBaseUrl()}${getItemPath(c.name)}`) toast(t('Copied folder permalink.'), { icon: '👌' }) }} > @@ -140,7 +139,7 @@ const FolderGridLayout = ({ className="cursor-pointer rounded px-1.5 py-1 hover:bg-gray-300 dark:hover:bg-gray-600" onClick={() => { clipboard.copy( - `${getBaseUrl()}/api/raw/?path=${getReadablePath(getItemPath(c.name))}${ + `${getBaseUrl()}/api/raw/?path=${getItemPath(c.name)}${ hashedToken ? `&odpt=${hashedToken}` : '' }` ) @@ -152,7 +151,7 @@ const FolderGridLayout = ({ diff --git a/components/FolderListLayout.tsx b/components/FolderListLayout.tsx index 6abaf9c..b0a1b94 100644 --- a/components/FolderListLayout.tsx +++ b/components/FolderListLayout.tsx @@ -8,7 +8,6 @@ import { useTranslation } from 'next-i18next' import { getBaseUrl } from '../utils/getBaseUrl' import { humanFileSize, formatModifiedDateTime } from '../utils/fileDetails' -import { getReadablePath } from '../utils/getReadablePath' import { Downloading, Checkbox, ChildIcon, ChildName } from './FileListing' import { getStoredToken } from '../utils/protectedRouteHandler' @@ -109,9 +108,7 @@ const FolderListLayout = ({ title={t('Copy folder permalink')} className="cursor-pointer rounded px-1.5 py-1 hover:bg-gray-300 dark:hover:bg-gray-600" onClick={() => { - clipboard.copy( - `${getBaseUrl()}${getReadablePath(`${path === '/' ? '' : path}/${encodeURIComponent(c.name)}`)}` - ) + clipboard.copy(`${getBaseUrl()}${`${path === '/' ? '' : path}/${encodeURIComponent(c.name)}`}`) toast(t('Copied folder permalink.'), { icon: '👌' }) }} > @@ -139,9 +136,7 @@ const FolderListLayout = ({ className="cursor-pointer rounded px-1.5 py-1 hover:bg-gray-300 dark:hover:bg-gray-600" onClick={() => { clipboard.copy( - `${getBaseUrl()}/api/raw/?path=${getReadablePath(getItemPath(c.name))}${ - hashedToken ? `&odpt=${hashedToken}` : '' - }` + `${getBaseUrl()}/api/raw/?path=${getItemPath(c.name)}${hashedToken ? `&odpt=${hashedToken}` : ''}` ) toast.success(t('Copied raw file permalink.')) }} diff --git a/components/previews/VideoPreview.tsx b/components/previews/VideoPreview.tsx index 4d6dbcf..4d9953f 100644 --- a/components/previews/VideoPreview.tsx +++ b/components/previews/VideoPreview.tsx @@ -12,7 +12,6 @@ import { useClipboard } from 'use-clipboard-copy' import { getBaseUrl } from '../../utils/getBaseUrl' import { getExtension } from '../../utils/getFileIcon' -import { getReadablePath } from '../../utils/getReadablePath' import { getStoredToken } from '../../utils/protectedRouteHandler' import { DownloadButton } from '../DownloadBtnGtoup' @@ -143,9 +142,7 @@ const VideoPreview: FC<{ file: OdFileObject }> = ({ file }) => { /> */} { - clipboard.copy( - `${getBaseUrl()}/api/raw/?path=${getReadablePath(asPath)}${hashedToken ? `&odpt=${hashedToken}` : ''}` - ) + clipboard.copy(`${getBaseUrl()}/api/raw/?path=${asPath}${hashedToken ? `&odpt=${hashedToken}` : ''}`) toast.success(t('Copied direct link to clipboard.')) }} btnColor="pink"