update class cards

client/src/components/classes/class-card.tsx

@@ -1,4 +1,4 @@
-import { Class } from "@/lib/schema";
+import { StaticClass } from "@/lib/static-data";
 import { Link } from "wouter";
 import FadiaGardenImage from "@assets/fadia-garden_1749836720986.jpg";
 import PilatesClassImage from "@assets/pilates_class_1749837680834.jpeg";
@@ -6,7 +6,7 @@ import FadiaPrivateImage from "@assets/Fadia-7_1749842141071.jpg";
 import FadiaBallImage from "@assets/fadia-ball_1749842241591.jpg";
 
 interface ClassCardProps {
-  classData: Class;
+  classData: StaticClass;
 }
 
 export function ClassCard({ classData }: ClassCardProps) {

client/src/components/classes/classes-section.tsx

@@ -1,20 +1,7 @@
 import { ClassCard } from "./class-card";
-import { useQuery } from "@tanstack/react-query";
-import { Class } from "@/lib/schema";
-import { Skeleton } from "@/components/ui/skeleton";
-import { apiRequest } from "@/lib/queryClient";
-import FadiaClassImage from "../../assets/Fadia-156.jpg";
-
+import { STATIC_CLASSES } from "@/lib/static-data";
 
 export function ClassesSection() {
-  const { data: classes, isLoading, error } = useQuery<Class[]>({
-    queryKey: ["/api/classes"],
-    queryFn: async () => {
-      const res = await apiRequest("GET", "/api/classes");
-      return await res.json();
-    },
-  });
-  
   return (
     <section className="py-20 bg-white">
       <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
@@ -25,39 +12,14 @@ export function ClassesSection() {
           <p className="max-w-3xl mx-auto text-gray-600">Join personalized pilates classes where you'll discover strength, flexibility, and mindfulness.</p>
         </div>
         
-        {/* Class description boxes removed */}
-        
-        {isLoading ? (
-          <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-6">
-            {[1, 2, 3, 4].map((_, i) => (
-              <div key={i} className="bg-white rounded-lg overflow-hidden shadow-lg">
-                <Skeleton className="w-full h-36" />
-                <div className="p-4">
-                  <div className="flex justify-between items-start mb-2">
-                    <Skeleton className="h-5 w-24" />
-                    <Skeleton className="h-5 w-16" />
-                  </div>
-                  <Skeleton className="h-4 w-full mb-1" />
-                  <Skeleton className="h-4 w-full mb-1" />
-                  <Skeleton className="h-4 w-3/4" />
-                </div>
-              </div>
-            ))}
-          </div>
-        ) : error ? (
-          <div className="text-center text-red-500">
-            <p>Error loading classes. Please try again later.</p>
-          </div>
-        ) : (
-          <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-6">
-            {classes?.map((classData) => (
-              <ClassCard 
-                key={classData.id} 
-                classData={classData} 
-              />
-            ))}
-          </div>
-        )}
+        <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-6">
+          {STATIC_CLASSES.map((classData) => (
+            <ClassCard 
+              key={classData.id} 
+              classData={classData} 
+            />
+          ))}
+        </div>
         
         <div className="text-center mt-12">
           <a href="https://www.momoyoga.com/pilates-with-fadia/schedule" target="_blank" rel="noopener noreferrer" className="inline-block">