Refactor: Fix type safety and auth

This commit is contained in:
gpt-engineer-app[bot]
2025-10-16 12:54:47 +00:00
parent e79eaf76ba
commit e340f1c489
5 changed files with 162 additions and 42 deletions

View File

@@ -13,10 +13,18 @@ import { RideCard } from '@/components/rides/RideCard';
import { AutocompleteSearch } from '@/components/search/AutocompleteSearch';
import { getCloudflareImageUrl } from '@/lib/cloudflareImageUtils';
interface RideModelWithImages extends RideModel {
card_image_url?: string;
card_image_id?: string;
banner_image_url?: string;
banner_image_id?: string;
technical_specs?: Record<string, any>;
}
export default function RideModelDetail() {
const { manufacturerSlug, modelSlug } = useParams<{ manufacturerSlug: string; modelSlug: string }>();
const navigate = useNavigate();
const [model, setModel] = useState<RideModel | null>(null);
const [model, setModel] = useState<RideModelWithImages | null>(null);
const [manufacturer, setManufacturer] = useState<Company | null>(null);
const [rides, setRides] = useState<Ride[]>([]);
const [loading, setLoading] = useState(true);
@@ -47,7 +55,7 @@ export default function RideModelDetail() {
.maybeSingle();
if (modelError) throw modelError;
setModel(modelData as RideModel);
setModel(modelData as RideModelWithImages);
if (modelData) {
// Fetch rides using this model
@@ -162,13 +170,6 @@ export default function RideModelDetail() {
);
}
const extendedModel = model as RideModel & {
card_image_url?: string;
card_image_id?: string;
banner_image_url?: string;
banner_image_id?: string;
};
return (
<div className="min-h-screen bg-background">
<Header />
@@ -183,10 +184,10 @@ export default function RideModelDetail() {
{/* Hero Section */}
<div className="mb-8">
{(extendedModel.banner_image_url || extendedModel.banner_image_id) && (
{(model.banner_image_url || model.banner_image_id) && (
<div className="relative w-full h-64 mb-6 rounded-lg overflow-hidden">
<img
src={extendedModel.banner_image_url || getCloudflareImageUrl(extendedModel.banner_image_id, 'banner')}
src={model.banner_image_url || (model.banner_image_id ? getCloudflareImageUrl(model.banner_image_id, 'banner') : '')}
alt={model.name}
className="w-full h-full object-cover"
/>
@@ -242,12 +243,12 @@ export default function RideModelDetail() {
</Card>
)}
{(model as any).technical_specs && Object.keys((model as any).technical_specs).length > 0 && (
{model.technical_specs && typeof model.technical_specs === 'object' && Object.keys(model.technical_specs).length > 0 && (
<Card>
<CardContent className="pt-6">
<h2 className="text-2xl font-semibold mb-4">Technical Specifications</h2>
<div className="grid md:grid-cols-2 gap-4">
{Object.entries((model as any).technical_specs as Record<string, any>).map(([key, value]) => (
{Object.entries(model.technical_specs as Record<string, any>).map(([key, value]) => (
<div key={key} className="flex justify-between py-2 border-b">
<span className="font-medium capitalize">{key.replace(/_/g, ' ')}</span>
<span className="text-muted-foreground">{String(value)}</span>