Fixed : undefined behaviour

Author: BangKartavya

src/pages/resources/components/ResourceCard.tsx

@@ -11,10 +11,10 @@ import { RepoType } from "@/types/index";
 import { Building } from "lucide-react";
 
 interface CenterCardProps {
-    repo: RepoType;
+    resource: RepoType;
 }
 
-const ResourceCard = ({ repo }: CenterCardProps) => {
+const ResourceCard = ({ resource }: CenterCardProps) => {
 
     const handleRedirect = (url: string) => {
         if (!url) return;
@@ -28,25 +28,29 @@ const ResourceCard = ({ repo }: CenterCardProps) => {
     }
 
     return (
-        
-        <Card className="mb-4 overflow-hidden border-0 shadow-md" onClick={() => handleRedirect(repo.url)}>
-            <Accordion type="single" className="w-full">
-                <AccordionItem value={repo.url} className="border-0">
-                    <AccordionTrigger className="cursor-pointer bg-white hover:bg-gray-50 px-6 py-4 text-left">
-                        <div className="flex flex-1 items-center justify-center">
-                            <div className="flex items-center space-x-4">
-                                <div className="flex h-10 w-10 items-center justify-center rounded-full bg-primary/10">
-                                    <Building className="h-5 w-5 text-primary" />
-                                </div>
-                                <div>
-                                    <h3 className="font-medium text-lg text-center">{repo.name}</h3>
+        resource ?
+            (<Card className="mb-4 overflow-hidden border-0 shadow-md" onClick={() => handleRedirect(resource.url)}>
+                <Accordion type="single" className="w-full">
+                    <AccordionItem value={resource.url} className="border-0">
+                        <AccordionTrigger className="cursor-pointer bg-white hover:bg-gray-50 px-6 py-4 text-left">
+                            <div className="flex flex-1 items-center justify-center">
+                                <div className="flex items-center space-x-4">
+                                    <div className="flex h-10 w-10 items-center justify-center rounded-full bg-primary/10">
+                                        <Building className="h-5 w-5 text-primary" />
+                                    </div>
+                                    <div>
+                                        <h3 className="font-medium text-lg text-center">{resource.name}</h3>
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                    </AccordionTrigger>
-                </AccordionItem>
-            </Accordion>
-        </Card>
+                        </AccordionTrigger>
+                    </AccordionItem>
+                </Accordion>
+            </Card>) : (
+                <div>
+                    <h1>undefined</h1>
+                </div>
+            )
     );
 };
 

src/pages/resources/index.tsx

@@ -1,7 +1,7 @@
 import PageLayout from '@/components/layout/PageLayout'
 import React, { useEffect, useState } from 'react'
 import ResourceCard from './components/ResourceCard';
-import { RepoType } from '@/types';
+import { FormResourceType, RepoType } from '@/types';
 import PageHead from '@/components/layout/PageHead';
 import { getResourceData } from '@/lib/supabase/actions/resources.actions';
 import { toast } from '@/hooks/use-toast';
@@ -18,6 +18,8 @@ const ResourcePage = () => {
         const fetch = async () => {
             const { data, error } = await getResourceData();
 
+            console.log(data);
+
             if (error) {
                 toast({
                     title: "Error",
@@ -49,11 +51,11 @@ const ResourcePage = () => {
                 />
                 <section className="py-24" id="events">
                     <PageSection
-                        title="Upcoming Events"
-                        subtitle="Join us at our upcoming events and be part of our community."
+                        title="Resources"
+                        subtitle="Feel Free to look at the resources"
                     >
-                        {data.length > 0 && data.map((repo) => (
-                            <ResourceCard repo={repo} key={repo.name} />
+                        {data.length > 0 && data.map((resource: FormResourceType) => (
+                            <ResourceCard resource={resource} key={resource.name} />
                         ))}
                     </PageSection>
                 </section>