diff --git a/src/app/(withAuth)/layout.js b/src/app/(withAuth)/layout.js
index 60ac863..35e60c5 100644
--- a/src/app/(withAuth)/layout.js
+++ b/src/app/(withAuth)/layout.js
@@ -2,6 +2,7 @@
 import WithAuthMiddleware from "@/core/middlewares/withAuth";
 import LoadingHardPage from "@/core/components/LoadingHardPage";
 import { useAuth } from "@/lib/contexts/auth";
+import { Typography, Stack } from "@mui/material";
 
 const Layout = ({ children }) => {
     const { isAuth, initAuthState, errorState } = useAuth();
@@ -9,9 +10,16 @@ const Layout = ({ children }) => {
     if (!initAuthState && !isAuth)
         return (
             <LoadingHardPage
-                authState={!!errorState}
+                authState={errorState.status}
                 label={
-                    !!errorState ? "مشکلی در احراز هویت رخ داده است . دقایقی بعد امتحان کنید!!!" : "درحال احراز هویت..."
+                    errorState.status ? (
+                        <Stack justifyContent={"center"} alignItems={"center"}>
+                            <Typography variant={"body1"}>{errorState.message}</Typography>
+                            <Typography variant={"body1"}> کد : {errorState.status}</Typography>
+                        </Stack>
+                    ) : (
+                        <Typography variant={"body1"}>درحال احراز هویت...</Typography>
+                    )
                 }
                 loading={true}
             />
diff --git a/src/core/components/DataTable/filter/FilterButton.jsx b/src/core/components/DataTable/filter/FilterButton.jsx
index 2d22501..79cc879 100644
--- a/src/core/components/DataTable/filter/FilterButton.jsx
+++ b/src/core/components/DataTable/filter/FilterButton.jsx
@@ -1,8 +1,17 @@
 "use client";
 import FilterAltIcon from "@mui/icons-material/FilterAlt";
-import { IconButton, Tooltip } from "@mui/material";
+import { IconButton, Tooltip, Badge } from "@mui/material";
+import useDataTable from "@/lib/hooks/useDataTable";
 
 function FilterButton({ drawerState, setDrawerState }) {
+    const { filterData } = useDataTable();
+    const isValueEmpty = (value) => {
+        if (Array.isArray(value)) {
+            return value.length === 0 || value.every((v) => v === "");
+        }
+        return value === "" || value === null || value === undefined;
+    };
+    const filteredFilterData = Object.values(filterData).filter((filter) => !isValueEmpty(filter.value));
     return (
         <Tooltip title="فیلتر">
             <IconButton
@@ -11,10 +20,18 @@ function FilterButton({ drawerState, setDrawerState }) {
                 }}
                 aria-label="filter table"
             >
-                <FilterAltIcon />
+                <Badge
+                    badgeContent={filteredFilterData.length}
+                    color="primary"
+                    anchorOrigin={{
+                        vertical: "top",
+                        horizontal: "left",
+                    }}
+                >
+                    <FilterAltIcon />
+                </Badge>
             </IconButton>
         </Tooltip>
     );
 }
-
 export default FilterButton;
diff --git a/src/core/components/DataTable/filter/index.jsx b/src/core/components/DataTable/filter/index.jsx
index 8d26594..32a09a8 100644
--- a/src/core/components/DataTable/filter/index.jsx
+++ b/src/core/components/DataTable/filter/index.jsx
@@ -1,5 +1,4 @@
 "use client";
-
 import { useState } from "react";
 import FilterButton from "@/core/components/DataTable/filter/FilterButton";
 import FilterBody from "@/core/components/DataTable/filter/FilterBody";
diff --git a/src/core/components/DataTable/hide/HideButton.jsx b/src/core/components/DataTable/hide/HideButton.jsx
index de919fe..fa93857 100644
--- a/src/core/components/DataTable/hide/HideButton.jsx
+++ b/src/core/components/DataTable/hide/HideButton.jsx
@@ -1,9 +1,14 @@
 "use client";
-
 import ViewColumnIcon from "@mui/icons-material/ViewColumn";
-import { IconButton, Tooltip } from "@mui/material";
+import { IconButton, Tooltip, Badge } from "@mui/material";
+import useDataTable from "@/lib/hooks/useDataTable";
+import { flattenObjectOfObjects } from "@/core/utils/flattenObjectOfObjects";
 
 function HideButton({ drawerState, setDrawerState }) {
+    const { hideData } = useDataTable();
+    const flattenHideData = flattenObjectOfObjects(hideData);
+    const falseCount = Object.values(flattenHideData).filter((value) => value === false).length;
+
     return (
         <Tooltip title="نمایش/مخفی کردن ستون ها">
             <IconButton
@@ -12,7 +17,16 @@ function HideButton({ drawerState, setDrawerState }) {
                 }}
                 aria-label="hide table column"
             >
-                <ViewColumnIcon />
+                <Badge
+                    badgeContent={falseCount}
+                    color="primary"
+                    anchorOrigin={{
+                        vertical: "top",
+                        horizontal: "left",
+                    }}
+                >
+                    <ViewColumnIcon />
+                </Badge>
             </IconButton>
         </Tooltip>
     );
diff --git a/src/core/components/DataTable/toolbar/TopToolbar.js b/src/core/components/DataTable/toolbar/TopToolbar.js
index a4d9db7..cdbbf4c 100644
--- a/src/core/components/DataTable/toolbar/TopToolbar.js
+++ b/src/core/components/DataTable/toolbar/TopToolbar.js
@@ -63,7 +63,7 @@ const DataTable_TopToolbar = ({
                     gap: "0.5rem",
                     justifyContent: "space-between",
                     alignItems: "center",
-                    py: "0.5rem",
+                    p: "0.5rem",
                     position: stackAlertBanner ? "relative" : "absolute",
                     right: 0,
                     top: 0,
diff --git a/src/core/components/LoadingHardPage.jsx b/src/core/components/LoadingHardPage.jsx
index c126c5c..0f66f9c 100644
--- a/src/core/components/LoadingHardPage.jsx
+++ b/src/core/components/LoadingHardPage.jsx
@@ -52,9 +52,7 @@ const LoadingHardPage = ({
                             )}
                         </LoadingImage>
                     )}
-                    <Typography variant={"body2"} sx={{ color: authState ? "error.main" : "primary.main" }}>
-                        {label}
-                    </Typography>
+                    <Stack sx={{ color: authState ? "error.main" : "primary.main" }}>{label}</Stack>
                 </Stack>
             </Backdrop>
             {children}
diff --git a/src/lib/contexts/auth.js b/src/lib/contexts/auth.js
index 818daaf..eac1d6d 100644
--- a/src/lib/contexts/auth.js
+++ b/src/lib/contexts/auth.js
@@ -27,7 +27,7 @@ const authReducer = (state, action) => {
 const AuthContext = createContext();
 
 export const AuthProvider = ({ children }) => {
-    const [errorState, setErrorState] = useState(null);
+    const [errorState, setErrorState] = useState({ status: null, message: "" });
     const [state, dispatch] = useReducer(authReducer, initAuth);
 
     const clearUser = useCallback(() => {
@@ -66,7 +66,8 @@ export const AuthProvider = ({ children }) => {
                 changeInitAuth(true);
                 return;
             }
-            setErrorState(true);
+            let status = error.response && error.response.status ? error.response.status : "نامشخص";
+            setErrorState({ status, message: " مشکلی در احراز هویت رخ داده است . دقایقی بعد امتحان کنید!!!" });
         }
     }, [clearUser, changeUser, changeAuthState, changeInitAuth]);