Sitraka003 · fenohasinalala · Jun 15, 2023 · Jun 15, 2023 · Jun 15, 2023 · Jun 15, 2023
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -18,6 +18,7 @@
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "typescript": "5.1.3",
+    "uuid": "^9.0.0",
     "zustand": "^4.3.8"
   }
 }
diff --git a/src/hooks/useLocalStorage.ts b/src/hooks/useLocalStorage.ts
@@ -1,5 +1,10 @@
-const useLocalStorage = () => {
-
+const useLocalStorage = (item:any|null,localName="localeTask") => {
+  if (item) {
+  localStorage.setItem(localName,item)
+  }else{
+    return localStorage.getItem(localName)
+  }
+
 }
 
 export {

diff --git a/src/pages/index.tsx b/src/pages/index.tsx
@@ -1,5 +1,8 @@
+import { formatDate, timeDifference } from "@/utils";
+import { GetServerSideProps, InferGetServerSidePropsType } from "next";
 import Head from "next/head";
 import { useRouter } from "next/router";
+import { useEffect, useState } from "react";
 
 /**
   Calculates the time difference between the server time and client time.
@@ -10,11 +13,21 @@ import { useRouter } from "next/router";
 const calculateTimeDifference = (server: Date, client: Date) => {};
 
 
-export default function Home() {
+export default function Home({
+  time,
+}: InferGetServerSidePropsType<typeof getServerSideProps>) {
   const router = useRouter();
   const moveToTaskManager = () => {
     router.push("/tasks");
   }
+  const [clientTime,setClientTime] = useState(new Date (Date().toString()))
+  const [serverTime,setServerTime] = useState(new Date(time.servertime))
+  const[diff,setDiff] = useState("")
+  useEffect(() => {
+    setClientTime(new Date (Date().toString()))  
+   setDiff(timeDifference(clientTime,serverTime))
+  }, [])
+
   return (
     <>
       <Head>
@@ -27,15 +40,16 @@ export default function Home() {
         <h1>The easiest exam you will ever find</h1>
         <div>
           {/* Display here the server time (DD-MM-AAAA HH:mm)*/}
+          {}
           <p>
-            Server time:{" "}
+            Server time: {formatDate(serverTime) }
             <span className="serverTime">{/* Replace with the value */}</span>
           </p>
 
           {/* Display here the time difference between the server side and the client side */}
           <p>
             Time diff:{" "}
-            <span className="serverTime">{/* Replace with the value */}</span>
+            <span className="serverTime">{diff}</span>
           </p>
         </div>
 
@@ -46,3 +60,15 @@ export default function Home() {
     </>
   );
 }
+
+
+type ServerTime = {
+  servertime: string
+}
+
+export const getServerSideProps: GetServerSideProps<{
+  time: ServerTime
+}> = async () => {
+  const time = { servertime: Date().toString() }
+  return { props: { time } }
+}
diff --git a/src/store/useTaskManager.ts b/src/store/useTaskManager.ts
@@ -1,7 +1,65 @@
-const useTaskManager = () => {
+import create, { SetState } from 'zustand';
+interface Task {
+  id: string;
+  title: string;
+  completed: boolean;
+}
+
+interface TaskManagerState {
+  tasks: Task[];
+  searchTask: Task[];
+  addTask: (newTask: Task) => void;
+  updateTask: (taskId: string, updatedTask: Partial<Task>) => void;
+  deleteTask: (taskId: string) => void;
+  setSearchTask: (searchText: string) => void;
+}
+
+
+import create, { SetState } from 'zustand';
 
+interface Task {
+  id: string;
+  title: string;
+  completed: boolean;
 }
 
+interface TaskManagerState {
+  tasks: Task[];
+  searchTask: Task[];
+  addTask: (newTask: Task) => void;
+  updateTask: (taskId: string, updatedTask: Partial<Task>) => void;
+  deleteTask: (taskId: string) => void;
+  setSearchTask: (searchText: string) => void;
+}
+
+const useTaskManager = create<TaskManagerState>((set: SetState<TaskManagerState>) => ({
+  tasks: [],
+  searchTask: [],
+  addTask: (newTask) => {
+    set((state) => ({
+      tasks: [...state.tasks, newTask],
+    }));
+  },
+  updateTask: (taskId, updatedTask) => {
+    set((state) => ({
+      tasks: state.tasks.map((task) =>
+        task.id === taskId ? { ...task, ...updatedTask } : task
+      ),
+    }));
+  },
+  deleteTask: (taskId) => {
+    set((state) => ({
+      tasks: state.tasks.filter((task) => task.id !== taskId),
+    }));
+  },
+  setSearchTask: (searchText) => {
+    set((state) => ({
+      searchTask: state.tasks.filter((task) => task.title.includes(searchText)),
+    }));
+  },
+}));
+
+
 export {
   useTaskManager
 }
diff --git a/src/utils/index.ts b/src/utils/index.ts
@@ -10,3 +10,40 @@ const wait = (milliseconds: number) => {
 };
 
 export { wait };
+
+//calcul la difference en 02 dates, puis la formate
+export function timeDifference(date1:Date, date2:Date) {
+  // Convertir les dates en millisecondes
+  var diff = Math.abs(date1.getTime() - date2.getTime());
+
+  // Calculer les valeurs de temps
+  var seconds = Math.floor(diff / 1000);
+  var minutes = Math.floor(seconds / 60);
+  var hours = Math.floor(minutes / 60);
+  var days = Math.floor(hours / 24);
+
+  // Formater la différence
+  var formattedDiff = `${days} jours, ${hours % 24} heures, ${minutes % 60} minutes et ${seconds % 60} secondes`;
+
+  return formattedDiff;
+}
+
+var date1 = new Date('2023-06-13T12:00:00');
+
+//formate une date
+export function formatDate(date:Date) {
+  var day = date.getDate();
+  var month = date.getMonth() + 1; // Les mois commencent à 0, donc on ajoute 1
+  var year = date.getFullYear();
+  var hours = date.getHours();
+  var minutes = date.getMinutes();
+
+  // Ajouter un zéro initial si nécessaire
+  const dayF = (day < 10) ? '0' + day : day;
+  const monthF = (month < 10) ? '0' + month : month;
+  const hoursF = (hours < 10) ? '0' + hours : hours;
+  const minutesF = (minutes < 10) ? '0' + minutes : minutes;
+
+  var formattedDate = dayF + ':' + monthF + ':' + year + ' ' + hoursF + ':' + minutesF;
+  return formattedDate;
+}