mirror of
https://github.com/AppFlowy-IO/AppFlowy.git
synced 2024-08-30 18:12:39 +00:00
fix: some file block issues (#6085)
This commit is contained in:
parent
c4cdcbff73
commit
7541dff00e
@ -1,17 +1,15 @@
|
|||||||
import { FieldURLType } from '@/application/collab.type';
|
|
||||||
import { notify } from '@/components/_shared/notify';
|
import { notify } from '@/components/_shared/notify';
|
||||||
import RightTopActionsToolbar from '@/components/editor/components/block-actions/RightTopActionsToolbar';
|
import RightTopActionsToolbar from '@/components/editor/components/block-actions/RightTopActionsToolbar';
|
||||||
import { EditorElementProps, FileNode } from '@/components/editor/editor.type';
|
import { EditorElementProps, FileNode } from '@/components/editor/editor.type';
|
||||||
import { copyTextToClipboard } from '@/utils/copy';
|
import { copyTextToClipboard } from '@/utils/copy';
|
||||||
import { downloadFile } from '@/utils/download';
|
import { downloadFile } from '@/utils/download';
|
||||||
import { renderDate } from '@/utils/time';
|
|
||||||
import React, { forwardRef, memo, useCallback, useMemo, useState } from 'react';
|
import React, { forwardRef, memo, useCallback, useMemo, useState } from 'react';
|
||||||
import { ReactComponent as FileIcon } from '@/assets/file_upload.svg';
|
import { ReactComponent as FileIcon } from '@/assets/file_upload.svg';
|
||||||
import { useTranslation } from 'react-i18next';
|
import { useTranslation } from 'react-i18next';
|
||||||
|
|
||||||
export const FileBlock = memo(
|
export const FileBlock = memo(
|
||||||
forwardRef<HTMLDivElement, EditorElementProps<FileNode>>(({ node, children, ...attributes }, ref) => {
|
forwardRef<HTMLDivElement, EditorElementProps<FileNode>>(({ node, children, ...attributes }, ref) => {
|
||||||
const { url, name, url_type, uploaded_at } = useMemo(() => node.data || {}, [node.data]);
|
const { url, name } = useMemo(() => node.data || {}, [node.data]);
|
||||||
|
|
||||||
const className = useMemo(() => {
|
const className = useMemo(() => {
|
||||||
const classList = ['w-full bg-bg-body py-2'];
|
const classList = ['w-full bg-bg-body py-2'];
|
||||||
@ -41,20 +39,6 @@ export const FileBlock = memo(
|
|||||||
}
|
}
|
||||||
}, [url, name]);
|
}, [url, name]);
|
||||||
|
|
||||||
const uploadTypePrefix = useMemo(() => {
|
|
||||||
const time = renderDate(uploaded_at, 'MMM DD, YYYY', false);
|
|
||||||
|
|
||||||
if (url_type === FieldURLType.Upload) {
|
|
||||||
return t('web.fileBlock.uploadedAt', {
|
|
||||||
time,
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
return t('web.fileBlock.linkedAt', {
|
|
||||||
time,
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}, [uploaded_at, url_type, t]);
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
{...attributes}
|
{...attributes}
|
||||||
@ -75,9 +59,6 @@ export const FileBlock = memo(
|
|||||||
{url ?
|
{url ?
|
||||||
<>
|
<>
|
||||||
<div className={'w-full truncate'}>{name?.trim() || t('document.title.placeholder')}</div>
|
<div className={'w-full truncate'}>{name?.trim() || t('document.title.placeholder')}</div>
|
||||||
<div className={'text-xs'}>
|
|
||||||
{uploadTypePrefix}
|
|
||||||
</div>
|
|
||||||
</> :
|
</> :
|
||||||
<div className={'text-text-caption'}>
|
<div className={'text-text-caption'}>
|
||||||
{t('web.fileBlock.empty')}
|
{t('web.fileBlock.empty')}
|
||||||
|
Loading…
Reference in New Issue
Block a user