TP-52973 | added type

src/Pages/Incidents/ActivityLog/index.tsx

@@ -1,14 +1,14 @@
 import { FC } from 'react';
 import { useSelector } from 'react-redux';
 import Typography from '@navi/web-ui/lib/primitives/Typography';
+import { IncidentPageState } from '@src/types';
 import IncidentCreated from '../StepperAssets/IncidentCreated';
 import IncidentChange from '../StepperAssets/IncidentChange';
 import styles from './ActivityLog.module.scss';
 
 const ActivityLog: FC = () => {
-  //To do: add type here
   const incidentLog = useSelector(
-    (state: any) => state.incidentLog.incidentLogData,
+    (state: IncidentPageState) => state.incidentLog.incidentLogData,
   );
   const lastChangeIndex = (incidentLog?.data?.logs || [])
     .slice()

src/Pages/Incidents/DescriptionContent/index.tsx

@@ -4,17 +4,16 @@ import { Typography, Avatar } from '@navi/web-ui/lib/primitives';
 import SlackIcon from '@src/assets/SlackIcon';
 import ConfluenceIcon from '@src/assets/ConfluenceIcon';
 import GoToLinkIcon from '@src/assets/GoToLinkIcon';
-import { IncidentDatatype, ParticipantsDatatype } from '@src/types';
+import { IncidentPageState } from '@src/types';
 import JiraLinks from '../JiraLinks';
 import styles from './DescriptionContent.module.scss';
 
 const DescriptionContent: React.FC = () => {
-  //Todo: add type here
   const { description, slackChannel, incidentName, rcaLink } = useSelector(
-    (state: any) => state.incidentLog.incidentData,
+    (state: IncidentPageState) => state.incidentLog.incidentData,
   );
   const incidentParticipants = useSelector(
-    (state: any) => state.incidentLog.participantsData,
+    (state: IncidentPageState) => state.incidentLog.participantsData,
   );
 
   const renderParticipantList = (type: string): JSX.Element => {

src/Pages/Incidents/Dropdowns/AllDailogBox.tsx

@@ -18,6 +18,7 @@ import {
   setOpenDialogUpdate,
 } from '@src/slices/IncidentSlice';
 import { ApiService } from '@src/services/api';
+import { IncidentPageState } from '@src/types';
 import {
   actionTypes,
   SLACK_BASE_URL,
@@ -34,27 +35,27 @@ import styles from '../Incidents.module.scss';
 
 const AllDailogBox: FC = () => {
   const [state, dispatch] = useReducer(reducer, initialState);
-  //TODO: add type here
+
   const openNotParticipants = useSelector(
-    (state: any) => state.incidentLog.openDialognotParticipants,
+    (state: IncidentPageState) => state.incidentLog.openDialognotParticipants,
   );
   const openDuplicate = useSelector(
-    (state: any) => state.incidentLog.openDialogDuplicate,
+    (state: IncidentPageState) => state.incidentLog.openDialogDuplicate,
   );
   const openResolve = useSelector(
-    (state: any) => state.incidentLog.openDialogResolve,
+    (state: IncidentPageState) => state.incidentLog.openDialogResolve,
   );
   const openUpdate = useSelector(
-    (state: any) => state.incidentLog.openDialogUpdate,
+    (state: IncidentPageState) => state.incidentLog.openDialogUpdate,
   );
   const UpdateData = useSelector(
-    (state: any) => state.incidentLog.updateDetails,
+    (state: IncidentPageState) => state.incidentLog.updateDetails,
   );
   const selectedOption = useSelector(
-    (state: any) => state.incidentLog.selectedOptions,
+    (state: IncidentPageState) => state.incidentLog.selectedOptions,
   );
   const incidentData = useSelector(
-    (state: any) => state.incidentLog.incidentData,
+    (state: IncidentPageState) => state.incidentLog.incidentData,
   );
   const { updateIncident, startIncidentSearch } = useIncidentApis();
   const incidentId = incidentData?.id?.toString();

src/Pages/Incidents/Dropdowns/index.tsx

@@ -6,6 +6,7 @@ import { ArrowDownIcon } from '@navi/web-ui/lib/icons';
 import { SelectPicker } from '@navi/web-ui/lib/components';
 import { SelectPickerOptionProps } from '@navi/web-ui/lib/components/SelectPicker/types';
 import useOutsideClick from '@src/services/hooks/useOustideClick';
+import { Participant } from '@src/types';
 import {
   setOpenDialogDuplicate,
   setOpenDialogResolve,
@@ -14,6 +15,7 @@ import {
   setUpdateDetails,
   setSelectedOptions,
 } from '@src/slices/IncidentSlice';
+import { IncidentPageState } from '@src/types';
 import AllDailogBox from './AllDailogBox';
 import { generateOptions, getCurrentData, getUpdateTypeText } from '../utils';
 import {
@@ -30,12 +32,12 @@ import styles from '../Incidents.module.scss';
 
 const Dropdowns: FC = () => {
   const reduxDispatch = useDispatch();
-  //ToDO: add type here
+
   const incidentData = useSelector(
-    (state: any) => state.incidentLog.incidentData,
+    (state: IncidentPageState) => state.incidentLog.incidentData,
   );
   const incidentParticipants = useSelector(
-    (state: any) => state.incidentLog?.participantsData,
+    (state: IncidentPageState) => state.incidentLog?.participantsData,
   );
   const headerData = useSelector((state: any) => state.incidentLog.headerData);
 
@@ -61,9 +63,9 @@ const Dropdowns: FC = () => {
     ...(incidentParticipants?.participants || []),
     ...(incidentParticipants?.others || []),
   ];
-  //To do: add types here
+
   const isUserParticipantList = participantsList?.some(
-    (participant: any) => participant.email === userEmail,
+    (participant: Participant) => participant.email === userEmail,
   );
   const severityMap = headerData?.severities?.reduce((map, severity) => {
     map[severity.value] = severity.label;

src/Pages/Incidents/Header/index.tsx

@@ -7,6 +7,7 @@ import Button from '@navi/web-ui/lib/primitives/Button';
 import ArrowBackIcon from '@navi/web-ui/lib/icons/ArrowBackIcon';
 import CopyIcon from '@src/assets/CopyIcon';
 import { handleCopyUrlToClipboard } from '@src/services/globalUtils';
+import { IncidentPageState } from '@src/types';
 import styles from './Header.module.scss';
 
 const Header: FC = () => {
@@ -14,9 +15,8 @@ const Header: FC = () => {
   const handleBacktoDashboard = (): void => {
     navigate(-1);
   };
-  //ToDO: add type here
   const incidentData = useSelector(
-    (state: any) => state.incidentLog.incidentData,
+    (state: IncidentPageState) => state.incidentLog.incidentData,
   );
 
   return (

src/Pages/Incidents/JiraLinks/index.tsx

@@ -14,6 +14,7 @@ import CopyIcon from '@src/assets/CopyIcon';
 import LoadingIcon from '@src/assets/LoadingIcon';
 import { ApiService } from '@src/services/api';
 import { handleCopyClick } from '@src/services/globalUtils';
+import { IncidentPageState } from '@src/types';
 import { truncateText, linkSanitization } from '../utils';
 import useIncidentApis from '../useIncidentApis';
 import {
@@ -22,22 +23,24 @@ import {
   reducer,
   JIRA_VALIDATION,
 } from '../DescriptionContent/DescriptionContentProps';
-import { LINK_JIRA_INCIDENT, UNLINK_JIRA_INCIDENT } from '../constants';
+import {
+  LINK_JIRA_INCIDENT,
+  UNLINK_JIRA_INCIDENT,
+  JiraLinkPayload,
+} from '../constants';
 import styles from '../DescriptionContent/DescriptionContent.module.scss';
 
 const JiraLinks: FC = () => {
   const [state, dispatch] = useReducer(reducer, initialState);
-  //TODO: add type here
   const { id, jiraLinks } = useSelector(
-    (state: any) => state.incidentLog.incidentData,
+    (state: IncidentPageState) => state.incidentLog.incidentData,
   );
 
-  const storedEmail = localStorage.getItem('email-id');
+  const storedEmail = localStorage.getItem('email-id') || '';
   useEffect(() => {
     dispatch({ type: ActionType.SET_JIRA_LINKS, payload: jiraLinks || [] });
   }, [jiraLinks]);
 
-  //TODO: add type here
   const handleApiError = (error: any): void => {
     const errorMessage =
       error?.response?.data?.error?.message || 'An error occurred.';
@@ -46,8 +49,7 @@ const JiraLinks: FC = () => {
 
   const { startIncidentSearch } = useIncidentApis();
 
-  //TODO: add type here
-  const addJiraLink = (payload: any): void => {
+  const addJiraLink = (payload: JiraLinkPayload): void => {
     handleCloseIconClick();
     dispatch({ type: ActionType.SET_SHOW_LINKED_TICKETS, payload: true });
     const endPoint = LINK_JIRA_INCIDENT;
@@ -59,8 +61,7 @@ const JiraLinks: FC = () => {
       .catch(handleApiError);
   };
 
-  //TODO: add type here
-  const removeJiraLink = (payload: any): void => {
+  const removeJiraLink = (payload: JiraLinkPayload): void => {
     const endPoint = UNLINK_JIRA_INCIDENT;
     ApiService.post(endPoint, payload)
       .then(response => {

src/Pages/Incidents/UpdateIncidentBox/index.tsx

@@ -2,13 +2,13 @@ import { FC } from 'react';
 import { useSelector } from 'react-redux';
 import { Tooltip, Typography } from '@navi/web-ui/lib/primitives';
 import { AlertOutlineIcon } from '@navi/web-ui/lib/icons';
+import { IncidentPageState } from '@src/types';
 import Dropdowns from '../Dropdowns';
 import styles from '../Incidents.module.scss';
 
 const UpdateIncidentBox: FC = () => {
-  //To do: add types here
   const incidentParticipants = useSelector(
-    (state: any) => state.incidentLog.participantsData,
+    (state: IncidentPageState) => state.incidentLog.participantsData,
   );
   const { emailId: userEmail } =
     JSON.parse(localStorage.getItem('user-data') || '{}') || {};

src/Pages/Incidents/constants.ts

@@ -69,6 +69,12 @@ export interface ResponseType {
   data: '';
   status: number;
 }
+export interface JiraLinkPayload {
+  incident_id: number;
+  jira_link: string;
+  user: string;
+}
+
 export const actionTypes = {
   SET_INCIDENT_DATA: 'SET_INCIDENT_DATA',
   SET_HEADER_DATA: 'SET_HEADER_DATA',

src/types/index.d.ts

@@ -103,7 +103,7 @@ export interface HeaderDatatype {
   teams: Team[];
 }
 
-interface Participant {
+export interface Participant {
   id: string;
   name: string;
   email?: string;
@@ -152,3 +152,16 @@ interface ChangeType {
   from: string;
   attribute: string;
 }
+
+export interface IncidentPageState {
+  incidentLog: IncidentLogData;
+  incidentData: IncidentDatatype;
+  headerData: HeaderDatatype;
+  participantsData: ParticipantsDatatype;
+  updateDetails: UpdateDetailsType;
+  openDialogUpdate: boolean;
+  openDialogDuplicate: boolean;
+  openDialogResolve: boolean;
+  openDialognotParticipants: boolean;
+  selectedOptions: SelectPickerOptionProps | SelectPickerOptionProps[];
+}