create header

client/src/Pages/Maintenance/index.tsx

@@ -1,11 +1,13 @@
 import { BasePageWithStates } from "@/Components/v2/design-elements";
+import { HeaderCreate } from "@/Components/v2/common";
 import { useTranslation } from "react-i18next";
 import { useGet } from "@/Hooks/UseApi";
 import { MaintenanceWindowTable } from "./MaintenanceWindowTable";
-import { useState, useCallback } from "react";
+import { useState } from "react";
 import { useSelector } from "react-redux";
 import type { RootState } from "@/Types/state";
 import type { MaintenanceWindow } from "@/Types/MaintenanceWindow";
+import { useIsAdmin } from "@/Hooks/useIsAdmin";
 
 interface MaintenanceWindowsResponse {
 	maintenanceWindows: MaintenanceWindow[];
@@ -14,12 +16,13 @@ interface MaintenanceWindowsResponse {
 
 const MaintenanceWindowPage = () => {
 	const { t } = useTranslation();
+	const isAdmin = useIsAdmin();
 	const [page, setPage] = useState(0);
 	const rowsPerPage = useSelector(
 		(state: RootState) => state?.ui?.maintenance?.rowsPerPage ?? 5
 	);
 
-	const { data, isLoading, error, refetch } = useGet<MaintenanceWindowsResponse>(
+	const { data, isLoading, isValidating, error, refetch } = useGet<MaintenanceWindowsResponse>(
 		`/maintenance-window/team?page=${page}&rowsPerPage=${rowsPerPage}`
 	);
 
@@ -38,6 +41,11 @@ const MaintenanceWindowPage = () => {
 			actionButtonText={t("pages.maintenanceWindow.fallback.actionButton")}
 			actionLink="/maintenance/create"
 		>
+			<HeaderCreate
+				path="/maintenance/create"
+				isLoading={isLoading || isValidating}
+				isAdmin={isAdmin}
+			/>
 			<MaintenanceWindowTable
 				maintenanceWindows={maintenanceWindows}
 				maintenanceWindowCount={maintenanceWindowCount}