feat | add current days of year

Author: qitpydev

src/data.ts

@@ -39,17 +39,17 @@ const ContactData = {
 
 const InfoData = {
     paragraphHeader: [
-        "Hi, i am Quyet by name - here is something about me ✌️."
+        "Hi, my name is Quyet and here's a little bit about me! ✌️"
     ],
     paragraphBody: [
-        `🍀 I am a Python Developer, with ${getWorkingTimes()} in Web Development`,
-        "🍀 I love computer, technology and animals",
-        "🍀 Currently, DevOps is my main field",
-        "Always and always welcome new kind friends!",
+        `🍀 I have ${getWorkingTimes()} of experience in web development.`,
+        "🍀 I love computer, technology and animals.",
+        "🍀 Currently, I'm focused on DevOps as my primary field.",
     ],
     paragraphFooter: [
-        "Welcome to come here with me ♥️",
-        "Hope you have a nice day ♥️"
+        "I'm always happy to make new friends!",
+        "Please feel free to reach out to me. ♥️",
+        "Wishing you a wonderful day! ♥️",
     ]
 };
 

src/pages/Portfolio/common/function/functions.ts

@@ -119,6 +119,21 @@ export function getWeekNumber(): number {
     return week_number
 }
 
+// count the number of day in current year at this time
+export function getDayNumber(): number {
+    let currentDate: any = new Date();
+    let currentYear: any = currentDate.getFullYear();
+    let firstDayOfYear: any = new Date(currentYear, 0, 1);
+    return Math.ceil((currentDate - firstDayOfYear) / (1000 * 60 * 60 * 24));
+}
+
+// count number of all the days in current year
+export function getDaysOfYear(): number {
+    let today = new Date();
+    let currentYear = today.getFullYear();
+    return (currentYear % 4 === 0) ? 366 : 365;
+}
+
 /**
  * when user click outside of the header,
  *  close the header popup

src/pages/Portfolio/features/components/ExploreMore/ExploreMore.tsx

@@ -1,15 +1,17 @@
 import React from 'react'
-import { getWeekNumber } from '../../../common/function/functions'
+import { getWeekNumber, getDayNumber, getDaysOfYear } from '../../../common/function/functions'
 import './ExploreMore.scss'
 
 import ProgressBar from "@ramonak/react-progress-bar";
 
 function ExploreMore() {
-  const week_str = `Current week: ${getWeekNumber()} / 52`
-  const percent = Math.floor(getWeekNumber() / 52 * 100)
+  const week_str =  `Current week: ${getWeekNumber()} / 52`
+  const day_str =   `Current day: ${getDayNumber()} / ${getDaysOfYear()}`
+  const percent = Math.floor(getDayNumber() / getDaysOfYear() * 100)
   return (<>
     <div className='weekly-progress'>
       <span>{week_str}</span>
+      <span>{day_str}</span>
       <ProgressBar
         completed={percent}
         labelSize={"10px"}