add loading all page & change bugs

components/dashboard/userAccount/ContentTabs.js

@@ -1,6 +1,6 @@
 'use client'
 
-import { useState } from "react";
+import { useEffect, useState } from "react";
 
 // Tabs
 import Turns from "./tabs/turns";
@@ -17,15 +17,23 @@ const listTab = ['حساب کاربری', 'نوبت های من', 'تراکنش
 
 function ContentTabs({ user, value, setValue, isOpenSide, setIsOpenSide }) {
 
+    const [loading, setLoading] = useState(true);
     const [isTurnsDetails, setIsTurnsDetails] = useState(false);
     const handleChange = (event, newValue) => setValue(newValue);
 
+    useEffect(() => {
+        setTimeout(() => {
+            setLoading(true);
+        }, 2000);
+    }, []);
+
+
     const components = [
         <DetailUser user={user} />,
-        <Turns user={user} setIsTurnsDetails={setIsTurnsDetails} />,
-        <Transactions user={user} />,
-        <Comments user={user} />,
-        <Messages user={user} />
+        <Turns user={user} loading={loading} setIsTurnsDetails={setIsTurnsDetails} />,
+        <Transactions user={user} loading={loading} />,
+        <Comments user={user} loading={loading} />,
+        <Messages user={user} loading={loading} />
     ];
 
     return (
@@ -43,7 +51,7 @@ function ContentTabs({ user, value, setValue, isOpenSide, setIsOpenSide }) {
                 <p className="text-[#525252] text-[14px] font-bold">{isTurnsDetails ? 'جزئیات نوبت ' : listTab[value]}</p>
             </Button>
             {isTurnsDetails ?
-                <IsTurnsDetails user={user} setIsTurnsDetails={setIsTurnsDetails} /> : (
+                <IsTurnsDetails loading={loading} user={user} setIsTurnsDetails={setIsTurnsDetails} /> : (
                     <>
                         <div className='!hidden md:!flex !w-full'>
                             <Tabs