Wrap forms with error boundaries

2025-12-24 05:31:13 -05:00 · 2025-11-05 21:33:14 +00:00
parent fa3dfcfdee
commit 524f6a65e8
13 changed files with 161 additions and 116 deletions
--- a/src/pages/DesignerRides.tsx
+++ b/src/pages/DesignerRides.tsx
@@ -18,6 +18,7 @@ import { useAuthModal } from '@/hooks/useAuthModal';
 import { useDocumentTitle } from '@/hooks/useDocumentTitle';
 import { useOpenGraph } from '@/hooks/useOpenGraph';
 import { handleNonCriticalError } from '@/lib/errorHandler';
+import { SubmissionErrorBoundary } from '@/components/error/SubmissionErrorBoundary';

 export default function DesignerRides() {
  const { designerSlug } = useParams<{ designerSlug: string }>();
@@ -329,10 +330,12 @@ export default function DesignerRides() {

      <Dialog open={isCreateModalOpen} onOpenChange={setIsCreateModalOpen}>
        <DialogContent className="max-w-4xl max-h-[90vh] overflow-y-auto">
-          <RideForm
-            onSubmit={handleCreateSubmit}
-            onCancel={() => setIsCreateModalOpen(false)}
-          />
+          <SubmissionErrorBoundary>
+            <RideForm
+              onSubmit={handleCreateSubmit}
+              onCancel={() => setIsCreateModalOpen(false)}
+            />
+          </SubmissionErrorBoundary>
        </DialogContent>
      </Dialog>
    </div>
--- a/src/pages/Designers.tsx
+++ b/src/pages/Designers.tsx
@@ -26,6 +26,7 @@ import { useAuthModal } from '@/hooks/useAuthModal';
 import { getErrorMessage } from '@/lib/errorHandler';
 import { useDocumentTitle } from '@/hooks/useDocumentTitle';
 import { useOpenGraph } from '@/hooks/useOpenGraph';
+import { SubmissionErrorBoundary } from '@/components/error/SubmissionErrorBoundary';

 export default function Designers() {
  useDocumentTitle('Designers');
@@ -359,7 +360,9 @@ export default function Designers() {
      </main>
      <Dialog open={isCreateModalOpen} onOpenChange={setIsCreateModalOpen}>
        <DialogContent className="max-w-4xl max-h-[90vh] overflow-y-auto">
-          <DesignerForm onSubmit={handleCreateSubmit} onCancel={() => setIsCreateModalOpen(false)} />
+          <SubmissionErrorBoundary>
+            <DesignerForm onSubmit={handleCreateSubmit} onCancel={() => setIsCreateModalOpen(false)} />
+          </SubmissionErrorBoundary>
        </DialogContent>
      </Dialog>
    </div>
--- a/src/pages/ManufacturerModels.tsx
+++ b/src/pages/ManufacturerModels.tsx
@@ -18,6 +18,7 @@ import { useAuthModal } from '@/hooks/useAuthModal';
 import { useDocumentTitle } from '@/hooks/useDocumentTitle';
 import { useOpenGraph } from '@/hooks/useOpenGraph';
 import { handleNonCriticalError } from '@/lib/errorHandler';
+import { SubmissionErrorBoundary } from '@/components/error/SubmissionErrorBoundary';

 interface RideModelWithCount extends RideModel {
  ride_count: number;
@@ -295,11 +296,13 @@ export default function ManufacturerModels() {

      <Dialog open={isCreateModalOpen} onOpenChange={setIsCreateModalOpen}>
        <DialogContent className="max-w-4xl max-h-[90vh] overflow-y-auto">
-          <RideModelForm
-            manufacturerName={manufacturer.name}
-            onSubmit={handleCreateSubmit}
-            onCancel={() => setIsCreateModalOpen(false)}
-          />
+          <SubmissionErrorBoundary>
+            <RideModelForm
+              manufacturerName={manufacturer.name}
+              onSubmit={handleCreateSubmit}
+              onCancel={() => setIsCreateModalOpen(false)}
+            />
+          </SubmissionErrorBoundary>
        </DialogContent>
      </Dialog>
    </div>
--- a/src/pages/ManufacturerRides.tsx
+++ b/src/pages/ManufacturerRides.tsx
@@ -18,6 +18,7 @@ import { useAuthModal } from '@/hooks/useAuthModal';
 import { useDocumentTitle } from '@/hooks/useDocumentTitle';
 import { useOpenGraph } from '@/hooks/useOpenGraph';
 import { handleNonCriticalError } from '@/lib/errorHandler';
+import { SubmissionErrorBoundary } from '@/components/error/SubmissionErrorBoundary';

 export default function ManufacturerRides() {
  const { manufacturerSlug } = useParams<{ manufacturerSlug: string }>();
@@ -329,10 +330,12 @@ export default function ManufacturerRides() {

      <Dialog open={isCreateModalOpen} onOpenChange={setIsCreateModalOpen}>
        <DialogContent className="max-w-4xl max-h-[90vh] overflow-y-auto">
-          <RideForm
-            onSubmit={handleCreateSubmit}
-            onCancel={() => setIsCreateModalOpen(false)}
-          />
+          <SubmissionErrorBoundary>
+            <RideForm
+              onSubmit={handleCreateSubmit}
+              onCancel={() => setIsCreateModalOpen(false)}
+            />
+          </SubmissionErrorBoundary>
        </DialogContent>
      </Dialog>
    </div>
--- a/src/pages/Manufacturers.tsx
+++ b/src/pages/Manufacturers.tsx
@@ -26,6 +26,7 @@ import { useAuthModal } from '@/hooks/useAuthModal';
 import { getErrorMessage } from '@/lib/errorHandler';
 import { useDocumentTitle } from '@/hooks/useDocumentTitle';
 import { useOpenGraph } from '@/hooks/useOpenGraph';
+import { SubmissionErrorBoundary } from '@/components/error/SubmissionErrorBoundary';

 export default function Manufacturers() {
  useDocumentTitle('Manufacturers');
@@ -374,10 +375,12 @@ export default function Manufacturers() {
      {/* Create Modal */}
      <Dialog open={isCreateModalOpen} onOpenChange={setIsCreateModalOpen}>
        <DialogContent className="max-w-4xl max-h-[90vh] overflow-y-auto">
-          <ManufacturerForm
-            onSubmit={handleCreateSubmit}
-            onCancel={() => setIsCreateModalOpen(false)}
-          />
+          <SubmissionErrorBoundary>
+            <ManufacturerForm
+              onSubmit={handleCreateSubmit}
+              onCancel={() => setIsCreateModalOpen(false)}
+            />
+          </SubmissionErrorBoundary>
        </DialogContent>
      </Dialog>
    </div>
--- a/src/pages/Operators.tsx
+++ b/src/pages/Operators.tsx
@@ -26,6 +26,7 @@ import { useAuthModal } from '@/hooks/useAuthModal';
 import { getErrorMessage } from '@/lib/errorHandler';
 import { useDocumentTitle } from '@/hooks/useDocumentTitle';
 import { useOpenGraph } from '@/hooks/useOpenGraph';
+import { SubmissionErrorBoundary } from '@/components/error/SubmissionErrorBoundary';

 const Operators = () => {
  useDocumentTitle('Operators');
@@ -377,10 +378,12 @@ const Operators = () => {
        {/* Create Modal */}
        <Dialog open={isCreateModalOpen} onOpenChange={setIsCreateModalOpen}>
          <DialogContent className="max-w-4xl max-h-[90vh] overflow-y-auto">
-            <OperatorForm
-              onSubmit={handleCreateSubmit}
-              onCancel={() => setIsCreateModalOpen(false)}
-            />
+            <SubmissionErrorBoundary>
+              <OperatorForm
+                onSubmit={handleCreateSubmit}
+                onCancel={() => setIsCreateModalOpen(false)}
+              />
+            </SubmissionErrorBoundary>
          </DialogContent>
        </Dialog>
      </main>
--- a/src/pages/ParkDetail.tsx
+++ b/src/pages/ParkDetail.tsx
@@ -26,6 +26,7 @@ import { usePhotoCount } from '@/hooks/photos/usePhotoCount';
 const RideForm = lazy(() => import('@/components/admin/RideForm').then(m => ({ default: m.RideForm })));
 const ParkForm = lazy(() => import('@/components/admin/ParkForm').then(m => ({ default: m.ParkForm })));
 import { getErrorMessage } from '@/lib/errorHandler';
+import { SubmissionErrorBoundary } from '@/components/error/SubmissionErrorBoundary';
 import { useUserRole } from '@/hooks/useUserRole';
 import { Edit } from 'lucide-react';
 import { VersionIndicator } from '@/components/versioning/VersionIndicator';
@@ -610,10 +611,13 @@ export default function ParkDetail() {
              </DialogDescription>
            </DialogHeader>
            <Suspense fallback={<AdminFormSkeleton />}>
-              <RideForm
-                onSubmit={handleRideSubmit}
-                onCancel={() => setIsAddRideModalOpen(false)}
-              />
+              <SubmissionErrorBoundary>
+                <RideForm
+                  onSubmit={handleRideSubmit}
+                  onCancel={() => setIsAddRideModalOpen(false)}
+                  initialData={{ park_id: park.id }}
+                />
+              </SubmissionErrorBoundary>
            </Suspense>
          </DialogContent>
        </Dialog>
@@ -628,28 +632,30 @@ export default function ParkDetail() {
              </DialogDescription>
            </DialogHeader>
            <Suspense fallback={<AdminFormSkeleton />}>
-              <ParkForm
-                onSubmit={handleEditParkSubmit}
-                onCancel={() => setIsEditParkModalOpen(false)}
-                initialData={{
-                  id: park?.id,
-                  name: park?.name,
-                  slug: park?.slug,
-                  description: park?.description ?? undefined,
-                  park_type: park?.park_type,
-                  status: park?.status,
-                  opening_date: park?.opening_date ?? undefined,
-                  closing_date: park?.closing_date ?? undefined,
-                  website_url: park?.website_url ?? undefined,
-                  phone: park?.phone ?? undefined,
-                  email: park?.email ?? undefined,
-                  operator_id: park?.operator?.id,
-                  property_owner_id: park?.property_owner?.id,
-                  banner_image_url: park?.banner_image_url ?? undefined,
-                  card_image_url: park?.card_image_url ?? undefined
-                }}
-                isEditing={true}
-              />
+              <SubmissionErrorBoundary>
+                <ParkForm
+                  onSubmit={handleEditParkSubmit}
+                  onCancel={() => setIsEditParkModalOpen(false)}
+                  initialData={{
+                    id: park?.id,
+                    name: park?.name,
+                    slug: park?.slug,
+                    description: park?.description ?? undefined,
+                    park_type: park?.park_type,
+                    status: park?.status,
+                    opening_date: park?.opening_date ?? undefined,
+                    closing_date: park?.closing_date ?? undefined,
+                    website_url: park?.website_url ?? undefined,
+                    phone: park?.phone ?? undefined,
+                    email: park?.email ?? undefined,
+                    operator_id: park?.operator?.id,
+                    property_owner_id: park?.property_owner?.id,
+                    banner_image_url: park?.banner_image_url ?? undefined,
+                    card_image_url: park?.card_image_url ?? undefined
+                  }}
+                  isEditing={true}
+                />
+              </SubmissionErrorBoundary>
            </Suspense>
          </DialogContent>
        </Dialog>
--- a/src/pages/ParkOwners.tsx
+++ b/src/pages/ParkOwners.tsx
@@ -20,6 +20,7 @@ import { useAuthModal } from '@/hooks/useAuthModal';
 import { getErrorMessage } from '@/lib/errorHandler';
 import { useDocumentTitle } from '@/hooks/useDocumentTitle';
 import { useOpenGraph } from '@/hooks/useOpenGraph';
+import { SubmissionErrorBoundary } from '@/components/error/SubmissionErrorBoundary';

 const ParkOwners = () => {
  useDocumentTitle('Property Owners');
@@ -242,10 +243,12 @@ const ParkOwners = () => {
        {/* Create Modal */}
        <Dialog open={isCreateModalOpen} onOpenChange={setIsCreateModalOpen}>
          <DialogContent className="max-w-4xl max-h-[90vh] overflow-y-auto">
-            <PropertyOwnerForm
-              onSubmit={handleCreateSubmit}
-              onCancel={() => setIsCreateModalOpen(false)}
-            />
+            <SubmissionErrorBoundary>
+              <PropertyOwnerForm
+                onSubmit={handleCreateSubmit}
+                onCancel={() => setIsCreateModalOpen(false)}
+              />
+            </SubmissionErrorBoundary>
          </DialogContent>
        </Dialog>
      </main>
--- a/src/pages/ParkRides.tsx
+++ b/src/pages/ParkRides.tsx
@@ -18,6 +18,7 @@ import { getErrorMessage, handleNonCriticalError } from '@/lib/errorHandler';
 import { useAuthModal } from '@/hooks/useAuthModal';
 import { useDocumentTitle } from '@/hooks/useDocumentTitle';
 import { useOpenGraph } from '@/hooks/useOpenGraph';
+import { SubmissionErrorBoundary } from '@/components/error/SubmissionErrorBoundary';

 export default function ParkRides() {
  const { parkSlug } = useParams<{ parkSlug: string }>();
@@ -353,12 +354,14 @@ export default function ParkRides() {
        {/* Create Modal */}
        <Dialog open={isCreateModalOpen} onOpenChange={setIsCreateModalOpen}>
          <DialogContent className="max-w-4xl max-h-[90vh] overflow-y-auto">
-            <RideForm
-              onSubmit={handleCreateSubmit as any}
-              onCancel={() => setIsCreateModalOpen(false)}
-              isEditing={false}
-              initialData={{ park_id: park.id }}
-            />
+            <SubmissionErrorBoundary>
+              <RideForm
+                onSubmit={handleCreateSubmit as any}
+                onCancel={() => setIsCreateModalOpen(false)}
+                isEditing={false}
+                initialData={{ park_id: park.id }}
+              />
+            </SubmissionErrorBoundary>
          </DialogContent>
        </Dialog>
      </main>
--- a/src/pages/Parks.tsx
+++ b/src/pages/Parks.tsx
@@ -39,6 +39,7 @@ import { useAuthModal } from "@/hooks/useAuthModal";
 import { useOpenGraph } from "@/hooks/useOpenGraph";
 import { useParks } from "@/hooks/parks/useParks";
 import { Pagination } from "@/components/common/Pagination";
+import { SubmissionErrorBoundary } from "@/components/error/SubmissionErrorBoundary";

 export interface FilterState {
  search: string;
@@ -583,7 +584,9 @@ export default function Parks() {
                Add a new park to the database. Your submission will be reviewed before being published.
              </DialogDescription>
            </DialogHeader>
-            <ParkForm onSubmit={handleParkSubmit} onCancel={() => setIsAddParkModalOpen(false)} isEditing={false} />
+            <SubmissionErrorBoundary>
+              <ParkForm onSubmit={handleParkSubmit} onCancel={() => setIsAddParkModalOpen(false)} isEditing={false} />
+            </SubmissionErrorBoundary>
          </DialogContent>
        </Dialog>
      </main>
--- a/src/pages/RideModelRides.tsx
+++ b/src/pages/RideModelRides.tsx
@@ -17,6 +17,7 @@ import { toast } from '@/hooks/use-toast';
 import { getErrorMessage, handleNonCriticalError } from '@/lib/errorHandler';
 import type { Ride, Company, RideModel } from "@/types/database";
 import { useDocumentTitle } from '@/hooks/useDocumentTitle';
+import { SubmissionErrorBoundary } from '@/components/error/SubmissionErrorBoundary';

 export default function RideModelRides() {
  const { manufacturerSlug, modelSlug } = useParams<{ manufacturerSlug: string; modelSlug: string }>();
@@ -293,10 +294,12 @@ export default function RideModelRides() {
        {/* Create Modal */}
        <Dialog open={isCreateModalOpen} onOpenChange={setIsCreateModalOpen}>
          <DialogContent className="max-w-4xl max-h-[90vh] overflow-y-auto">
-            <RideForm
-              onSubmit={handleCreateSubmit}
-              onCancel={() => setIsCreateModalOpen(false)}
-            />
+            <SubmissionErrorBoundary>
+              <RideForm
+                onSubmit={handleCreateSubmit}
+                onCancel={() => setIsCreateModalOpen(false)}
+              />
+            </SubmissionErrorBoundary>
          </DialogContent>
        </Dialog>
      </div>
--- a/src/pages/Rides.tsx
+++ b/src/pages/Rides.tsx
@@ -26,6 +26,7 @@ import { useDocumentTitle } from '@/hooks/useDocumentTitle';
 import { useOpenGraph } from '@/hooks/useOpenGraph';
 import { useRides } from '@/hooks/rides/useRides';
 import { Pagination } from '@/components/common/Pagination';
+import { SubmissionErrorBoundary } from '@/components/error/SubmissionErrorBoundary';

 export default function Rides() {
  useDocumentTitle('Rides & Attractions');
@@ -529,11 +530,13 @@ export default function Rides() {
        {/* Create Modal */}
        <Dialog open={isCreateModalOpen} onOpenChange={setIsCreateModalOpen}>
          <DialogContent className="max-w-4xl max-h-[90vh] overflow-y-auto">
-            <RideForm
-              onSubmit={handleCreateSubmit}
-              onCancel={() => setIsCreateModalOpen(false)}
-              isEditing={false}
-            />
+            <SubmissionErrorBoundary>
+              <RideForm
+                onSubmit={handleCreateSubmit}
+                onCancel={() => setIsCreateModalOpen(false)}
+                isEditing={false}
+              />
+            </SubmissionErrorBoundary>
          </DialogContent>
        </Dialog>
      </main>