feat(Maps): enhance missing assets warnings

jakeaturner · jakeaturner · commit b6ac6b1e84cc · 2026-01-15T15:54:59.000-08:00
diff --git a/admin/app/controllers/maps_controller.ts b/admin/app/controllers/maps_controller.ts
@@ -13,7 +13,14 @@ export default class MapsController {
   constructor(private mapService: MapService) {}
 
   async index({ inertia }: HttpContext) {
-    return inertia.render('maps')
+    const baseAssetsCheck = await this.mapService.checkBaseAssetsExist()
+    const regionFiles = await this.mapService.listRegions()
+    return inertia.render('maps', {
+      maps: {
+        baseAssetsExist: baseAssetsCheck,
+        regionFiles: regionFiles.files,
+      },
+    })
   }
 
   async checkBaseAssets({}: HttpContext) {
diff --git a/admin/inertia/components/layout/MissingBaseAssetsAlert.tsx b/admin/inertia/components/layout/MissingBaseAssetsAlert.tsx
diff --git a/admin/inertia/pages/maps.tsx b/admin/inertia/pages/maps.tsx
@@ -3,8 +3,18 @@ import { Head, Link } from '@inertiajs/react'
 import MapComponent from '~/components/maps/MapComponent'
 import StyledButton from '~/components/StyledButton'
 import { IconArrowLeft } from '@tabler/icons-react'
+import { FileEntry } from '../../types/files'
+import AlertWithButton from '~/components/AlertWithButton'
+
+export default function Maps(props: {
+  maps: { baseAssetsExist: boolean; regionFiles: FileEntry[] }
+}) {
+  const alertMessage = !props.maps.baseAssetsExist
+    ? 'The base map assets have not been installed. Please download them first to enable map functionality.'
+    : props.maps.regionFiles.length === 0
+      ? 'No map regions have been downloaded yet. Please download some regions to enable map functionality.'
+      : null
 
-export default function Maps() {
   return (
     <MapsLayout>
       <Head title="Maps" />
@@ -19,7 +29,23 @@ export default function Maps() {
           </StyledButton>
         </Link>
       </div>
-      <div className="w-full h-full flex p-4 justify-center items-center">
+      <div className="w-full min-h-screen flex flex-col items-center justify-center py-4 mx-4">
+        {alertMessage && (
+          <AlertWithButton
+            title={alertMessage}
+            type="warning"
+            variant="solid"
+            className="w-full !mb-4"
+            buttonProps={{
+              variant: 'secondary',
+              children: 'Go to Map Settings',
+              icon: 'Cog6ToothIcon',
+              onClick: () => {
+                window.location.href = '/settings/maps'
+              },
+            }}
+          />
+        )}
         <MapComponent />
       </div>
     </MapsLayout>
diff --git a/admin/inertia/pages/settings/maps.tsx b/admin/inertia/pages/settings/maps.tsx
@@ -5,7 +5,6 @@ import StyledButton from '~/components/StyledButton'
 import { useModals } from '~/context/ModalContext'
 import StyledModal from '~/components/StyledModal'
 import { FileEntry } from '../../../types/files'
-import MissingBaseAssetsAlert from '~/components/layout/MissingBaseAssetsAlert'
 import { useNotifications } from '~/context/NotificationContext'
 import { useState } from 'react'
 import api from '~/lib/api'
@@ -16,6 +15,7 @@ import StyledSectionHeader from '~/components/StyledSectionHeader'
 import CuratedCollectionCard from '~/components/CuratedCollectionCard'
 import { CuratedCollectionWithStatus } from '../../../types/downloads'
 import ActiveDownloads from '~/components/ActiveDownloads'
+import AlertWithButton from '~/components/AlertWithButton'
 
 const CURATED_COLLECTIONS_KEY = 'curated-map-collections'
 
@@ -194,7 +194,19 @@ export default function MapsManager(props: {
             </div>
           </div>
           {!props.maps.baseAssetsExist && (
-            <MissingBaseAssetsAlert loading={downloading} onClickDownload={downloadBaseAssets} />
+            <AlertWithButton
+              title="The base map assets have not been installed. Please download them first to enable map functionality."
+              type="warning"
+              variant="solid"
+              className="my-4"
+              buttonProps={{
+                variant: 'secondary',
+                children: 'Download Base Assets',
+                icon: 'ArrowDownTrayIcon',
+                loading: downloading,
+                onClick: () => downloadBaseAssets(),
+              }}
+            />
           )}
           <StyledSectionHeader title="Curated Map Collections" className="mt-8 !mb-4" />
           <StyledButton
diff --git a/admin/inertia/pages/settings/zim/remote-explorer.tsx b/admin/inertia/pages/settings/zim/remote-explorer.tsx
@@ -66,6 +66,9 @@ export default function ZimRemoteExplorer() {
         const pageParsed = parseInt((pageParam as number).toString(), 10)
         const start = isNaN(pageParsed) ? 0 : pageParsed * 12
         const res = await api.listRemoteZimFiles({ start, count: 12, query: query || undefined })
+        if (!res) {
+          throw new Error('Failed to fetch remote ZIM files.')
+        }
         return res.data
       },
       initialPageParam: 0,
