diff --git a/src/app/page.tsx b/src/app/page.tsx
index 1f5ee90..a50179b 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -1,7 +1,7 @@
'use client'
import Image from "next/image";
-import { useState } from 'react'
+import { useEffect, useState } from 'react'
import { Dialog, DialogPanel } from '@headlessui/react'
import { Bars3Icon, XMarkIcon } from '@heroicons/react/24/outline'
import { CloudArrowUpIcon, LockClosedIcon, ServerIcon, FingerPrintIcon } from '@heroicons/react/20/solid'
@@ -138,9 +138,9 @@ export default function Example() {
+ {/*
+
+
*/}
{/*
+
@@ -249,25 +262,6 @@ function Centered2x2Grid() {
}
-const productFeatures = [
- {
- name: 'Push to deploy.',
- description:
- 'Lorem ipsum, dolor sit amet consectetur adipisicing elit. Maiores impedit perferendis suscipit eaque, iste dolor cupiditate blanditiis ratione.',
- icon: CloudArrowUpIcon,
- },
- {
- name: 'SSL certificates.',
- description: 'Anim aute id magna aliqua ad ad non deserunt sunt. Qui irure qui lorem cupidatat commodo.',
- icon: LockClosedIcon,
- },
- {
- name: 'Database backups.',
- description: 'Ac tincidunt sapien vehicula erat auctor pellentesque rhoncus. Et magna sit morbi lobortis.',
- icon: ServerIcon,
- },
-]
-
function FeatureSection() {
return (
@@ -308,115 +302,70 @@ function FeatureSection() {
+ interface Course {
+ application_url: string;
+ date: string;
+ description: string;
+ location: string;
+ status: string;
+ }
+
+ export function CoursesList() {
+ const [courses, setCourses] = useState
([]);
+ const [loading, setLoading] = useState(true);
+ const [error, setError] = useState(null);
+
+ useEffect(() => {
+ const fetchCourses = async () => {
+ try {
+ const url = 'https://seahorse-app-db78s.ondigitalocean.app/api/courses'
+ const response = await fetch(url); // Replace with your API endpoint
+ if (!response.ok) {
+ throw new Error('Network response was not ok');
+ }
+ const data = await response.json();
+ setCourses(data);
+ } catch (error) {
+ setError(error instanceof Error ? error.message : 'An error occurred');
+ } finally {
+ setLoading(false);
+ }
+ };
+
+ fetchCourses();
+ }, []);
+
+ if (loading) {
+ return Loading...
;
+ }
+
+ if (error) {
+ return Error: {error}
;
+ }
+
+ return (
+
+ {courses.map((course) => (
+ -
+
+
{course.date}
+
{course.description}
+
{course.status}
+
{course.location}
+
+
+
+ ))}
+
+ );
+ }
+
-
-
-
-
-// import Image from "next/image";
-
-// export default function Home() {
-// return (
-//
-//
-//
-// Get started by editing
-// src/app/page.tsx
-//
-//
-//
-
-//
-//
-// Ananapa for Young People
-//
-//
-
-//
-//
-// );
-// }