From 9c298e83a50f485d23ce3613b0e9a812389c1f66 Mon Sep 17 00:00:00 2001
From: SagarRajput-7 <162284829+SagarRajput-7@users.noreply.github.com>
Date: Fri, 16 May 2025 16:59:52 +0530
Subject: [PATCH] feat: added user role restriction on crud for planned
 downtime feat (#7896)

---
 .../PlannedDowntime/PlannedDowntimeList.tsx   | 44 +++++++++++--------
 1 file changed, 25 insertions(+), 19 deletions(-)

diff --git a/frontend/src/container/PlannedDowntime/PlannedDowntimeList.tsx b/frontend/src/container/PlannedDowntime/PlannedDowntimeList.tsx
index 6202ca8d31..dd42f3d1b7 100644
--- a/frontend/src/container/PlannedDowntime/PlannedDowntimeList.tsx
+++ b/frontend/src/container/PlannedDowntime/PlannedDowntimeList.tsx
@@ -15,8 +15,10 @@ import cx from 'classnames';
 import { useNotifications } from 'hooks/useNotifications';
 import { defaultTo } from 'lodash-es';
 import { CalendarClock, PenLine, Trash2 } from 'lucide-react';
+import { useAppContext } from 'providers/App/App';
 import { ReactNode, useEffect } from 'react';
 import { UseQueryResult } from 'react-query';
+import { USER_ROLES } from 'types/roles';
 
 import {
 	formatDateTime,
@@ -84,6 +86,8 @@ function HeaderComponent({
 	handleEdit: () => void;
 	handleDelete: () => void;
 }): JSX.Element {
+	const { user } = useAppContext();
+	const isCrudEnabled = user?.role !== USER_ROLES.VIEWER;
 	return (
 		<Flex className="header-content" justify="space-between">
 			<Flex gap={8}>
@@ -91,25 +95,27 @@ function HeaderComponent({
 				<Tag>{duration}</Tag>
 			</Flex>
 
-			<div className="action-btn">
-				<PenLine
-					size={14}
-					onClick={(e): void => {
-						e.preventDefault();
-						e.stopPropagation();
-						handleEdit();
-					}}
-				/>
-				<Trash2
-					size={14}
-					color={Color.BG_CHERRY_500}
-					onClick={(e): void => {
-						e.preventDefault();
-						e.stopPropagation();
-						handleDelete();
-					}}
-				/>
-			</div>
+			{isCrudEnabled && (
+				<div className="action-btn">
+					<PenLine
+						size={14}
+						onClick={(e): void => {
+							e.preventDefault();
+							e.stopPropagation();
+							handleEdit();
+						}}
+					/>
+					<Trash2
+						size={14}
+						color={Color.BG_CHERRY_500}
+						onClick={(e): void => {
+							e.preventDefault();
+							e.stopPropagation();
+							handleDelete();
+						}}
+					/>
+				</div>
+			)}
 		</Flex>
 	);
 }