k8s redesign complete

frontend/src/features/vehicles/hooks/useVehicles.ts

@@ -3,6 +3,7 @@
  */
 
 import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query';
+import { useAuth0 } from '@auth0/auth0-react';
 import { vehiclesApi } from '../api/vehicles.api';
 import { CreateVehicleRequest, UpdateVehicleRequest } from '../types/vehicles.types';
 import toast from 'react-hot-toast';
@@ -17,17 +18,20 @@ interface ApiError {
 }
 
 export const useVehicles = () => {
+  const { isAuthenticated, isLoading } = useAuth0();
   return useQuery({
     queryKey: ['vehicles'],
     queryFn: vehiclesApi.getAll,
+    enabled: isAuthenticated && !isLoading,
   });
 };
 
 export const useVehicle = (id: string) => {
+  const { isAuthenticated, isLoading } = useAuth0();
   return useQuery({
     queryKey: ['vehicles', id],
     queryFn: () => vehiclesApi.getById(id),
-    enabled: !!id,
+    enabled: !!id && isAuthenticated && !isLoading,
   });
 };
 
@@ -75,4 +79,4 @@ export const useDeleteVehicle = () => {
       toast.error(error.response?.data?.error || 'Failed to delete vehicle');
     },
   });
-};
+};

frontend/src/features/vehicles/mobile/VehicleMobileCard.tsx

@@ -17,7 +17,7 @@ const CarThumb: React.FC<{ color?: string }> = ({ color = "#F2EAEA" }) => (
     sx={{ 
       height: 120, 
       bgcolor: color, 
-      borderRadius: 3, 
+      borderRadius: 2, 
       mb: 2,
       display: 'flex',
       alignItems: 'center',
@@ -38,7 +38,7 @@ export const VehicleMobileCard: React.FC<VehicleMobileCardProps> = ({
   return (
     <Card 
       sx={{ 
-        borderRadius: 18, 
+        borderRadius: 2, 
         overflow: 'hidden', 
         minWidth: compact ? 260 : 'auto',
         width: compact ? 260 : '100%'
@@ -62,4 +62,4 @@ export const VehicleMobileCard: React.FC<VehicleMobileCardProps> = ({
       </CardActionArea>
     </Card>
   );
-};
+};