show only the first item in appo list & update appo item text && change key in /doctors page URL && handle setting and updating data on first modal filter load

app/component/date/dateTime/hours/List.js

@@ -3,6 +3,7 @@ import React from "react";
 
 function List({ appo, hour, setHour, value }) {
   const list = appo && appo[value ? "evening" : "morning"];
+  const checkHour = (item) => JSON.stringify(item) === JSON.stringify(hour);
 
   if (list && list.length) {
     return (
@@ -14,14 +15,14 @@ function List({ appo, hour, setHour, value }) {
               disabled={!item.status === "available"}
               className={`
                           !w-full !rounded-[8px] !bg-[#EFEFEF] !flex !justify-center !items-center !py-[10px] !px-[14px] !h-[40px] md:!h-[42px] lg:!h-[44px]
-                          ${JSON.stringify(item) === JSON.stringify(hour) ? "!bg-[#F79463] " : ""}
+                          ${checkHour(item) ? "!bg-[#F79463] " : ""}
                       `}
             >
               <p
                 className={`
                           text-[16px] font-semibold text-[#525252]
                           ${item.status === "available" ? "text-[#525252]" : "text-[#D7D7D7]"}
-                          ${JSON.stringify(item) === JSON.stringify(hour) ? "!text-[#FAFAFA] " : ""}
+                          ${checkHour(item) ? "!text-[#FAFAFA] " : ""}
                       `}
               >
                 {item.time}