diff --git a/resources/scripts/components/screens/ServerError.tsx b/resources/scripts/components/screens/ServerError.tsx index 16596a256..97f091c4d 100644 --- a/resources/scripts/components/screens/ServerError.tsx +++ b/resources/scripts/components/screens/ServerError.tsx @@ -1,17 +1,30 @@ import React from 'react'; import PageContentBlock from '@/components/elements/PageContentBlock'; +import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; +import { faArrowLeft } from '@fortawesome/free-solid-svg-icons/faArrowLeft'; interface Props { title?: string; message: string; + onBack?: () => void; } -export default ({ title, message }: Props) => ( +export default ({ title, message, onBack }: Props) => (
-
+
+ {typeof onBack === 'function' && +
+ +
+ } -

{ title || 'Something went wrong!' }

+

{title || 'Something went wrong!'}

{message}

diff --git a/resources/scripts/components/server/files/FileEditContainer.tsx b/resources/scripts/components/server/files/FileEditContainer.tsx index 36664396c..afb1fa00c 100644 --- a/resources/scripts/components/server/files/FileEditContainer.tsx +++ b/resources/scripts/components/server/files/FileEditContainer.tsx @@ -2,7 +2,7 @@ import React, { lazy, useEffect, useState } from 'react'; import { ServerContext } from '@/state/server'; import getFileContents from '@/api/server/files/getFileContents'; import useRouter from 'use-react-router'; -import { Actions, useStoreActions, useStoreState } from 'easy-peasy'; +import { Actions, useStoreActions } from 'easy-peasy'; import { ApplicationStore } from '@/state'; import { httpErrorToHuman } from '@/api/http'; import SpinnerOverlay from '@/components/elements/SpinnerOverlay'; @@ -13,10 +13,12 @@ import FileNameModal from '@/components/server/files/FileNameModal'; import Can from '@/components/elements/Can'; import FlashMessageRender from '@/components/FlashMessageRender'; import PageContentBlock from '@/components/elements/PageContentBlock'; +import ServerError from '@/components/screens/ServerError'; const LazyAceEditor = lazy(() => import(/* webpackChunkName: "editor" */'@/components/elements/AceEditor')); export default () => { + const [ error, setError ] = useState(''); const { action } = useParams(); const { history, location: { hash } } = useRouter(); const [ loading, setLoading ] = useState(action === 'edit'); @@ -31,12 +33,12 @@ export default () => { if (action !== 'new') { useEffect(() => { setLoading(true); - clearFlashes('files:view'); + setError(''); getFileContents(uuid, hash.replace(/^#/, '')) .then(setContent) .catch(error => { console.error(error); - addError({ key: 'files:view', message: httpErrorToHuman(error) }); + setError(httpErrorToHuman(error)); }) .then(() => setLoading(false)); }, [ uuid, hash ]); @@ -49,9 +51,10 @@ export default () => { setLoading(true); clearFlashes('files:view'); - fetchFileContent().then(content => { - return saveFileContents(uuid, name || hash.replace(/^#/, ''), content); - }) + fetchFileContent() + .then(content => { + return saveFileContents(uuid, name || hash.replace(/^#/, ''), content); + }) .then(() => { if (name) { history.push(`/server/${id}/files/edit#/${name}`); @@ -67,6 +70,15 @@ export default () => { .then(() => setLoading(false)); }; + if (error) { + return ( + history.goBack()} + /> + ); + } + return (