refactor: Update project card to use img tag instead of Next.js Image…

… component
grubengraeber · Aug 18, 2024 · f98f1b5 · f98f1b5
1 parent 132f6b6
commit f98f1b5
Show file tree

Hide file tree

Showing 2 changed files with 53 additions and 55 deletions.
diff --git a/app/components/projects/kanban-board/project-card.tsx b/app/components/projects/kanban-board/project-card.tsx
@@ -15,7 +15,8 @@ const ProjectCard: React.FC<ProjectCardProps> = ({ project }: {project: Project}
   return (
         <Card className='my-2'>
             <CardHeader>
-      <Image src={`${project.banner}`} alt={project.title} className="w-full h-40 object-cover rounded-t-lg" width={100} height={50} />
+      {/* <Image src={project.banner} alt={project.title} className="w-full h-40 object-cover rounded-t-lg" width={100} height={50} /> */}
+      <img src={project.banner} alt={project.title} className="w-full h-40 object-cover rounded-t-lg" />
             <CardTitle>
             {project.title}
             </CardTitle>

diff --git a/app/projects/page.tsx b/app/projects/page.tsx
@@ -1,6 +1,5 @@
 "use client"
 
-import { NextPage } from 'next'
 import Project from '../data/project';
 import KanbanBoard from '../components/projects/kanban-board/kanban-board';
 import { ProjectStatus } from '../data/project-status';
@@ -10,66 +9,64 @@ import UnderConstruction from '../components/under-construction';
 
 
 
-const projectData: Project[] = [
-    // Example project data
-    new Project(
-      'ExampleProject1',
-      'This is an example project 1.',
-      'http://thispersondoesnotexist.com',
-      new Date(),
-      ProjectStatus.PLANNED,
-      [new Technology(
-        'Java',
-        TechnologyType.PROGRAMMING_LANGUAGE,
-        "https://www.java.com/",
-        0.7
-      ), 
-      new Technology(
-        'Spring',
-        TechnologyType.BACKEND_FRAMEWORK,
-        "https://spring.io/",
-        0.9
-      )
-    ],
-      'https://blog.example.com/1',
-      'http://example.com/1'
-    ),
-    new Project(
-      'ExampleProject2',
-      'This is an example project 2.',
-      "https://random.imagecdn.app/500/150",
-      new Date(),
-      ProjectStatus.PLANNED,
-      [new Technology(
-        'Typescript',
-        TechnologyType.PROGRAMMING_LANGUAGE,
-        'https://www.typescriptlang.org/',
-        0.8
-      ), 
-      new Technology(
-        'Nuxt',
-        TechnologyType.WEB_FRAMEWORK,
-        'https://nuxt.com/',
-        0.6
-      )
-    ],
-      'https://blog.example.com/2',
-      'https://example.com/2'
-    ),
-    // Add more projects as needed
-  ];
 
 // TODO: language
-const ProjectsPage: NextPage = () => {
+export default function ProjectsPage() {
+  const projectData: Project[] = [
+      // Example project data
+      new Project(
+        'ExampleProject1',
+        'This is an example project 1.',
+        'http://thispersondoesnotexist.com',
+        new Date(),
+        ProjectStatus.PLANNED,
+        [new Technology(
+          'Java',
+          TechnologyType.PROGRAMMING_LANGUAGE,
+          "https://www.java.com/",
+          0.7
+        ), 
+        new Technology(
+          'Spring',
+          TechnologyType.BACKEND_FRAMEWORK,
+          "https://spring.io/",
+          0.9
+        )
+      ],
+        'https://blog.example.com/1',
+        'http://example.com/1'
+      ),
+      new Project(
+        'ExampleProject2',
+        'This is an example project 2.',
+        "https://random.imagecdn.app/500/150",
+        new Date(),
+        ProjectStatus.PLANNED,
+        [new Technology(
+          'Typescript',
+          TechnologyType.PROGRAMMING_LANGUAGE,
+          'https://www.typescriptlang.org/',
+          0.8
+        ), 
+        new Technology(
+          'Nuxt',
+          TechnologyType.WEB_FRAMEWORK,
+          'https://nuxt.com/',
+          0.6
+        )
+      ],
+        'https://blog.example.com/2',
+        'https://example.com/2'
+      ),
+      // Add more projects as needed
+    ];
 
     return (
         <div className="container mx-auto p-4">
-     {/*  <h1 className="text-3xl font-bold mb-4">Projects</h1>
+      {/* <h1 className="text-3xl font-bold mb-4">Projects</h1>
       <KanbanBoard projects={projectData} /> */} {/* TODO */}
       <UnderConstruction />
     </div>
     )
 
-}
-
-export default ProjectsPage
+}