Fix Resolution Search Bug and Mobile UI Enhancements

.gitignore

@@ -59,3 +59,6 @@ aef_index.csv
 *.log
 deno.json
 edge_function/
+
+# clerk configuration (can include secrets)
+/.clerk/

app/actions.tsx

@@ -82,9 +82,18 @@ async function submit(formData?: FormData, skip?: boolean) {
   }
 
   if (action === 'resolution_search') {
-    const file_mapbox = formData?.get('file_mapbox') as File;
-    const file_google = formData?.get('file_google') as File;
-    const file = (formData?.get('file') as File) || file_mapbox || file_google;
+    const isFile = (val: any): val is File => {
+      return val && typeof val === 'object' && typeof val.arrayBuffer === 'function' && val.size > 0;
+    };
+
+    const file_mapbox_raw = formData?.get('file_mapbox');
+    const file_google_raw = formData?.get('file_google');
+    const file_raw = formData?.get('file');
+
+    const file_mapbox = isFile(file_mapbox_raw) ? file_mapbox_raw : null;
+    const file_google = isFile(file_google_raw) ? file_google_raw : null;
+    const file = isFile(file_raw) ? file_raw : (file_mapbox || file_google);
+
     const timezone = (formData?.get('timezone') as string) || 'UTC';
     const lat = formData?.get('latitude') ? parseFloat(formData.get('latitude') as string) : undefined;
     const lng = formData?.get('longitude') ? parseFloat(formData.get('longitude') as string) : undefined;
@@ -95,10 +104,10 @@ async function submit(formData?: FormData, skip?: boolean) {
     }
 
     const mapboxBuffer = file_mapbox ? await file_mapbox.arrayBuffer() : null;
-    const mapboxDataUrl = mapboxBuffer ? `data:${file_mapbox.type};base64,${Buffer.from(mapboxBuffer).toString('base64')}` : null;
+    const mapboxDataUrl = (file_mapbox && mapboxBuffer) ? `data:${file_mapbox.type};base64,${Buffer.from(mapboxBuffer).toString('base64')}` : null;
 
     const googleBuffer = file_google ? await file_google.arrayBuffer() : null;
-    const googleDataUrl = googleBuffer ? `data:${file_google.type};base64,${Buffer.from(googleBuffer).toString('base64')}` : null;
+    const googleDataUrl = (file_google && googleBuffer) ? `data:${file_google.type};base64,${Buffer.from(googleBuffer).toString('base64')}` : null;
 
     const buffer = await file.arrayBuffer();
     const dataUrl = `data:${file.type};base64,${Buffer.from(buffer).toString('base64')}`;

app/globals.css

@@ -145,9 +145,9 @@
   .mobile-icons-bar-content {
     display: flex;
     gap: 8px;
-    padding: 0 5px;
-    width: 100%;
-    justify-content: center;
+    padding: 0 10px;
+    min-width: max-content;
+    justify-content: flex-start;
   }
 
   .mobile-icons-bar-content > * {

components/chat-panel.tsx

@@ -280,7 +280,7 @@ export const ChatPanel = forwardRef<ChatPanelRef, ChatPanelProps>(({ messages, i
             disabled={isUploading}
             data-testid="chat-input"
             className={cn(
-              'resize-none w-full min-h-12 rounded-fill border border-input pl-14 pr-12 pt-3 pb-1 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50',
+              'resize-none w-full min-h-12 rounded-full border border-input pl-14 pr-12 pt-3 pb-1 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50',
               isMobile
                 ? 'mobile-chat-input input bg-background'
                 : 'bg-muted'

lib/utils/index.ts

@@ -41,7 +41,7 @@ export async function getModel(requireVision: boolean = false) {
             baseURL: 'https://api.x.ai/v1',
           });
           try {
-            return xai('grok-2-1212');
+            return xai(requireVision ? 'grok-2-vision-1212' : 'grok-2-1212');
           } catch (error) {
             console.error('Selected model "Grok 4.2" is configured but failed to initialize.', error);
             throw new Error('Failed to initialize selected model.');
@@ -86,7 +86,7 @@ export async function getModel(requireVision: boolean = false) {
       baseURL: 'https://api.x.ai/v1',
     });
     try {
-      return xai('grok-latest');
+      return xai(requireVision ? 'grok-2-vision-1212' : 'grok-latest');
     } catch (error) {
       console.warn('xAI API unavailable, falling back to next provider:');
     }