Merge pull request #4163 from overleaf/ae-handle-import-from-project-errors

Display a message if there's an error loading the list of projects/files/entities

GitOrigin-RevId: dae3ab2b5f33d3c286064dec05567a80cbc23a0e

services/web/frontend/js/features/file-tree/components/file-tree-create/modes/file-tree-import-from-project.js

@@ -155,8 +155,7 @@ export default function FileTreeImportFromProject() {
 function SelectProject({ projectId, selectedProject, setSelectedProject }) {
   const { t } = useTranslation()
 
-  // NOTE: unhandled error
-  const { data, loading } = useUserProjects()
+  const { data, error, loading } = useUserProjects()
 
   const filteredData = useMemo(() => {
     if (!data) {
@@ -166,6 +165,10 @@ function SelectProject({ projectId, selectedProject, setSelectedProject }) {
     return data.filter(item => item._id !== projectId)
   }, [data, projectId])
 
+  if (error) {
+    return <ErrorMessage error={error} />
+  }
+
   return (
     <FormGroup className="form-controls" controlId="project-select">
       <ControlLabel>{t('select_a_project')}</ControlLabel>
@@ -218,8 +221,11 @@ function SelectProjectOutputFile({
 }) {
   const { t } = useTranslation()
 
-  // NOTE: unhandled error
-  const { data, loading } = useProjectOutputFiles(selectedProjectId)
+  const { data, error, loading } = useProjectOutputFiles(selectedProjectId)
+
+  if (error) {
+    return <ErrorMessage error={error} />
+  }
 
   return (
     <FormGroup
@@ -272,8 +278,11 @@ function SelectProjectEntity({
 }) {
   const { t } = useTranslation()
 
-  // NOTE: unhandled error
-  const { data, loading } = useProjectEntities(selectedProjectId)
+  const { data, error, loading } = useProjectEntities(selectedProjectId)
+
+  if (error) {
+    return <ErrorMessage error={error} />
+  }
 
   return (
     <FormGroup