feat: Lazy load admin forms

This commit is contained in:
gpt-engineer-app[bot]
2025-10-21 18:43:38 +00:00
parent 70a8534da7
commit 6a70267a57
9 changed files with 358 additions and 222 deletions

View File

@@ -1,4 +1,4 @@
import { useState, useEffect } from 'react';
import { useState, useEffect, lazy, Suspense } from 'react';
import { useParams, useNavigate } from 'react-router-dom';
import { Header } from '@/components/layout/Header';
import { trackPageView } from '@/lib/viewTracking';
@@ -8,11 +8,14 @@ import { Badge } from '@/components/ui/badge';
import { Card, CardContent } from '@/components/ui/card';
import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
import { Dialog, DialogContent } from '@/components/ui/dialog';
import { AdminFormSkeleton } from '@/components/loading/PageSkeletons';
import { ArrowLeft, MapPin, Star, Globe, Calendar, Edit, Factory, FerrisWheel } from 'lucide-react';
import { Company } from '@/types/database';
import { supabase } from '@/integrations/supabase/client';
import { ManufacturerForm } from '@/components/admin/ManufacturerForm';
import { ManufacturerPhotoGallery } from '@/components/companies/ManufacturerPhotoGallery';
// Lazy load admin form
const ManufacturerForm = lazy(() => import('@/components/admin/ManufacturerForm').then(m => ({ default: m.ManufacturerForm })));
import { useAuth } from '@/hooks/useAuth';
import { useUserRole } from '@/hooks/useUserRole';
import { toast } from '@/hooks/use-toast';
@@ -371,23 +374,25 @@ export default function ManufacturerDetail() {
{/* Edit Modal */}
<Dialog open={isEditModalOpen} onOpenChange={setIsEditModalOpen}>
<DialogContent className="max-w-4xl max-h-[90vh] overflow-y-auto">
<ManufacturerForm
initialData={{
id: manufacturer.id,
name: manufacturer.name,
slug: manufacturer.slug,
description: manufacturer.description,
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
}}
onSubmit={handleEditSubmit}
onCancel={() => setIsEditModalOpen(false)}
/>
<Suspense fallback={<AdminFormSkeleton />}>
<ManufacturerForm
initialData={{
id: manufacturer.id,
name: manufacturer.name,
slug: manufacturer.slug,
description: manufacturer.description,
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
}}
onSubmit={handleEditSubmit}
onCancel={() => setIsEditModalOpen(false)}
/>
</Suspense>
</DialogContent>
</Dialog>
</div>