From ff3f26829b43cd3e16a927aa899aa52af6b9b5ed Mon Sep 17 00:00:00 2001
From: mortale2004 <114370142+mortale2004@users.noreply.github.com>
Date: Tue, 24 Sep 2024 16:01:00 +0530
Subject: [PATCH] fix: Greeting in the home page (#1204)

---
 src/app/(main)/(pages)/home/page.tsx | 14 ++------------
 src/components/Greeting.tsx          | 18 ++++++++++++++++++
 2 files changed, 20 insertions(+), 12 deletions(-)
 create mode 100644 src/components/Greeting.tsx

diff --git a/src/app/(main)/(pages)/home/page.tsx b/src/app/(main)/(pages)/home/page.tsx
index 281c8b9ea..d095f57b9 100644
--- a/src/app/(main)/(pages)/home/page.tsx
+++ b/src/app/(main)/(pages)/home/page.tsx
@@ -1,3 +1,4 @@
+import { Greeting } from '@/components/Greeting';
 import { MyCourses } from '@/components/MyCourses';
 import { Redirect } from '@/components/Redirect';
 import SearchBar from '@/components/search/SearchBar';
@@ -10,22 +11,11 @@ export default async function MyCoursesPage() {
     return <Redirect to={'/'} />;
   }
 
-  // Get the current hour
-  const currentHour = new Date().getHours();
-
-  // Determine the appropriate greeting based on the time of day
-  let greeting = 'Good Morning';
-  if (currentHour >= 12 && currentHour < 18) {
-    greeting = 'Good Afternoon';
-  } else if (currentHour >= 18 || currentHour < 5) {
-    greeting = 'Good Evening';
-  }
-
   return (
     <main className="flex flex-col gap-4 pb-16 pt-8">
       <div className="flex flex-col justify-between gap-4 lg:flex-row">
         <h1 className="text-wrap text-3xl font-extrabold capitalize tracking-tighter md:text-4xl">
-          {greeting} {session.user.name}
+          <Greeting /> {session.user.name}
         </h1>
         <SearchBar />
       </div>
diff --git a/src/components/Greeting.tsx b/src/components/Greeting.tsx
new file mode 100644
index 000000000..d52ecc7e3
--- /dev/null
+++ b/src/components/Greeting.tsx
@@ -0,0 +1,18 @@
+'use client';
+
+export const Greeting = () => {
+  // Get the current hour
+  const currentHour = new Date().getHours();
+
+  // Determine the appropriate greeting based on the time of day
+  let greeting = 'Good Morning';
+  if (currentHour >= 12 && currentHour < 18) {
+    greeting = 'Good Afternoon';
+  } else if (currentHour >= 18 || currentHour < 5) {
+    greeting = 'Good Evening';
+  } else {
+    greeting = 'Surprise to see you here!';
+  }
+
+  return greeting;
+};