Fix: Resolve type errors in page components

src/lib/typeAssertions.ts

@@ -0,0 +1,22 @@
+/**
+ * Type assertion helpers for TypeScript strict mode compatibility
+ * These help bridge database types (null) with application types (undefined)
+ */
+
+export function nullToUndefined<T>(value: T | null): T | undefined {
+  return value === null ? undefined : value;
+}
+
+export function convertNullsToUndefined<T extends Record<string, any>>(obj: T): { [K in keyof T]: T[K] extends (infer U | null) ? (U | undefined) : T[K] } {
+  const result: any = {};
+  for (const key in obj) {
+    const value = obj[key];
+    result[key] = value === null ? undefined : value;
+  }
+  return result;
+}
+
+// Type guard for checking if value is not null/undefined
+export function isDefined<T>(value: T | null | undefined): value is T {
+  return value !== null && value !== undefined;
+}

src/pages/DesignerRides.tsx

@@ -41,7 +41,7 @@ export default function DesignerRides() {
       const { data: designerData, error: designerError } = await supabase
         .from('companies')
         .select('*')
-        .eq('slug', designerSlug)
+        .eq('slug', designerSlug || '')
         .eq('company_type', 'designer')
         .maybeSingle();
 
@@ -85,7 +85,7 @@ export default function DesignerRides() {
 
         const { data: ridesData, error: ridesError } = await query;
         if (ridesError) throw ridesError;
-        setRides(ridesData || []);
+        setRides((ridesData || []) as any);
       }
     } catch (error) {
       console.error('Error fetching data:', error);
@@ -110,8 +110,8 @@ export default function DesignerRides() {
     description: designer 
       ? `Explore ${filteredRides.length} rides designed by ${designer.name}` 
       : undefined,
-    imageUrl: designer?.banner_image_url || filteredRides[0]?.banner_image_url,
-    imageId: designer?.banner_image_id || filteredRides[0]?.banner_image_id,
+    imageUrl: designer?.banner_image_url ?? filteredRides[0]?.banner_image_url ?? undefined,
+    imageId: designer?.banner_image_id ?? filteredRides[0]?.banner_image_id ?? undefined,
     type: 'website',
     enabled: !!designer && !loading
   });
@@ -129,11 +129,12 @@ export default function DesignerRides() {
 
       const submissionData: RideSubmissionData = {
         ...data,
+        description: data.description ?? undefined,
         designer_id: designer.id,
       };
 
       const { submitRideCreation } = await import('@/lib/entitySubmissionHelpers');
-      await submitRideCreation(submissionData, user.id);
+      await submitRideCreation(submissionData as any, user!.id);
       
       toast({
         title: "Ride Submitted",

src/pages/Designers.tsx

@@ -47,7 +47,7 @@ export default function Designers() {
 
   const handleCreateSubmit = async (data: any) => {
     try {
-      await submitCompanyCreation(data, 'designer', user.id);
+      await submitCompanyCreation(data, 'designer', user!.id);
       toast({
         title: "Designer Submitted",
         description: "Your submission has been sent for review."
@@ -168,8 +168,8 @@ export default function Designers() {
   useOpenGraph({
     title: 'Ride Designers - ThrillWiki',
     description: `Browse ${filteredCompanies.length} ride designers worldwide`,
-    imageUrl: filteredCompanies[0]?.banner_image_url,
-    imageId: filteredCompanies[0]?.banner_image_id,
+    imageUrl: filteredCompanies[0]?.banner_image_url ?? undefined,
+    imageId: filteredCompanies[0]?.banner_image_id ?? undefined,
     type: 'website',
     enabled: !loading
   });

src/pages/ManufacturerDetail.tsx

@@ -47,9 +47,9 @@ export default function ManufacturerDetail() {
   // Update Open Graph meta tags
   useOpenGraph({
     title: manufacturer?.name || '',
-    description: manufacturer?.description || (manufacturer ? `${manufacturer.name} - Ride Manufacturer${manufacturer.headquarters_location ? ` based in ${manufacturer.headquarters_location}` : ''}` : ''),
-    imageUrl: manufacturer?.banner_image_url,
-    imageId: manufacturer?.banner_image_id,
+    description: manufacturer?.description ?? (manufacturer ? `${manufacturer.name} - Ride Manufacturer${manufacturer.headquarters_location ? ` based in ${manufacturer.headquarters_location}` : ''}` : ''),
+    imageUrl: manufacturer?.banner_image_url ?? undefined,
+    imageId: manufacturer?.banner_image_id ?? undefined,
     type: 'profile',
     enabled: !!manufacturer
   });
@@ -72,7 +72,7 @@ export default function ManufacturerDetail() {
       const { data, error } = await supabase
         .from('companies')
         .select('*')
-        .eq('slug', slug)
+        .eq('slug', slug || '')
         .eq('company_type', 'manufacturer')
         .maybeSingle();
 
@@ -209,10 +209,10 @@ export default function ManufacturerDetail() {
               <picture>
                 <source 
                   media="(max-width: 768px)" 
-                  srcSet={getBannerUrls(manufacturer.banner_image_id).mobile || manufacturer.banner_image_url} 
+                  srcSet={(getBannerUrls(manufacturer.banner_image_id ?? undefined).mobile || manufacturer.banner_image_url) ?? undefined} 
                 />
                 <img 
-                  src={getBannerUrls(manufacturer.banner_image_id).desktop || manufacturer.banner_image_url} 
+                  src={(getBannerUrls(manufacturer.banner_image_id ?? undefined).desktop || manufacturer.banner_image_url) ?? undefined} 
                   alt={manufacturer.name}
                   className="w-full h-full object-cover"
                   loading="eager"
@@ -256,12 +256,12 @@ export default function ManufacturerDetail() {
                   </div>
                 </div>
                 
-                {manufacturer.average_rating > 0 && (
+                {(manufacturer.average_rating ?? 0) > 0 && (
                   <div className="bg-black/30 backdrop-blur-md rounded-lg p-6 text-center">
                     <div className="flex items-center gap-2 text-white mb-2">
                       <Star className="w-6 h-6 fill-yellow-400 text-yellow-400" />
                       <span className="text-3xl font-bold">
-                        {manufacturer.average_rating.toFixed(1)}
+                        {(manufacturer.average_rating ?? 0).toFixed(1)}
                       </span>
                     </div>
                     <div className="text-white/90 text-sm">
@@ -395,14 +395,14 @@ export default function ManufacturerDetail() {
                 id: manufacturer.id,
                 name: manufacturer.name,
                 slug: manufacturer.slug,
-                description: manufacturer.description,
+                description: manufacturer.description ?? undefined,
               company_type: 'manufacturer',
               person_type: (manufacturer.person_type || 'company') as 'company' | 'individual' | 'firm' | 'organization',
-              website_url: manufacturer.website_url,
-                founded_year: manufacturer.founded_year,
-                headquarters_location: manufacturer.headquarters_location,
-                banner_image_url: manufacturer.banner_image_url,
-                card_image_url: manufacturer.card_image_url
+              website_url: manufacturer.website_url ?? undefined,
+                founded_year: manufacturer.founded_year ?? undefined,
+                headquarters_location: manufacturer.headquarters_location ?? undefined,
+                banner_image_url: manufacturer.banner_image_url ?? undefined,
+                card_image_url: manufacturer.card_image_url ?? undefined
               }}
               onSubmit={handleEditSubmit}
               onCancel={() => setIsEditModalOpen(false)}