Skip to content

Add handling on missing file #2346

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 3 commits into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
11 changes: 10 additions & 1 deletion public/locales/en/files.json
Original file line number Diff line number Diff line change
Expand Up @@ -153,5 +153,14 @@
"pleaseWait": "Please wait while the initial 20 copies of the updated IPNS record are stored with the help of DHT peers…"
},
"noPinsInProgress": "All done, no remote pins in progress.",
"remotePinningInProgress": "Remote pinning in progress:"
"remotePinningInProgress": "Remote pinning in progress:",
"previewNotFound": {
"title": "IPFS can't find this item",
"helpTitle": "These are common troubleshooting steps might help:",
"helpListItemPathTypo": "Are there typos in the path you entered?",
"helpListItemFileMoved": "Was the file moved, renamed, or deleted?",
"helpListItemBookmarkMigrated": "Did you copy a URL or bookmark from another computer? If so, you'll need to",
"helpListItemBookmarkMigratedLink": "point this instance at that computer's node",
"backButton": "Go to Home"
}
}
10 changes: 7 additions & 3 deletions src/files/FilesPage.js
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ import withTour from '../components/tour/withTour.js'
import InfoBoxes from './info-boxes/InfoBoxes.js'
import FilePreview from './file-preview/FilePreview.js'
import FilesList from './files-list/FilesList.js'
import FileNotFound from './file-not-found/FileNotFound.js'
import { getJoyrideLocales } from '../helpers/i8n.js'

// Icons
Expand Down Expand Up @@ -228,7 +229,7 @@ const FilesPage = ({

<MainView t={t} files={files} remotePins={remotePins} pendingPins={pendingPins} failedPins={failedPins} doExploreUserProvidedPath={doExploreUserProvidedPath}/>

<Preview files={files} onDownload={() => onDownload([files])} />
<Preview files={files} path={filesPathInfo.path} t={t} onDownload={() => onDownload([files])} />

<InfoBoxes isRoot={filesPathInfo.isMfs && filesPathInfo.isRoot}
isCompanion={false}
Expand Down Expand Up @@ -264,11 +265,14 @@ const FilesPage = ({
)
}

const Preview = ({ files, onDownload }) => {
const Preview = ({ files, path, t, onDownload }) => {
if (files && files.type === 'file') {
return (<FilePreview {...files} onDownload={onDownload} />)
}
return (<div/>)

return (
<FileNotFound path={path} t={t} />
)
}

export default connect(
Expand Down
32 changes: 32 additions & 0 deletions src/files/file-not-found/FileNotFound.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,32 @@
import React from 'react'

import Button from '../../components/button/button'

import GlyphAttention from '../../icons/GlyphAttention.js'
import { withTranslation } from 'react-i18next'

const FileNotFound = ({ path, t }) => {
return (
<div
className='mb3 pa4-l pa2 mw9 center'
style={{ background: 'rgba(251, 251, 251)' }}
>
<div className='flex flex-row items-center mb3'>
<GlyphAttention style={{ height: 76 }} className='fill-red mr' role='presentation' />
<div className='red fw6 truncate'>{t('previewNotFound.title')}</div>
</div>
<div className='mb3 charcoal fw6 truncate'>{path}</div>
<div className='mb3'>{t('previewNotFound.helpTitle')}</div>
<ul>
<li>{t('previewNotFound.helpListItemPathTypo')}</li>
<li>{t('previewNotFound.helpListItemFileMoved')}</li>
<li>{t('previewNotFound.helpListItemBookmarkMigrated')} <a href="#/peers">{t('previewNotFound.helpListItemBookmarkMigratedLink')}</a>.</li>
</ul>
<a href="#/files">
<Button className='ma2 tc' bg='bg-teal'>{t('previewNotFound.backButton')}</Button>
</a>
</div>
)
}

export default withTranslation('files')(FileNotFound)
Loading