Skip to content

Commit

Permalink
Merge pull request #848 from MuhammadKhalilzadeh/104-feb-23-enhanced-…
Browse files Browse the repository at this point in the history 
…components

104 feb 23 enhanced components
  • Loading branch information
@MuhammadKhalilzadeh
MuhammadKhalilzadeh authored Feb 24, 2025
2 parents 09f62a8 + f56f0b8 commit 8e753b5
Show file tree
Hide file tree
Showing 116 changed files with 1,992 additions and 4,158 deletions.
11 changes: 4 additions & 7 deletions Clients/src/App.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,3 +1,7 @@
/**
* This file is currently in use
*/

import { Route, Routes } from "react-router-dom";
import "./App.css";
import { ThemeProvider } from "@emotion/react";
Expand All @@ -7,7 +11,6 @@ import light from "./presentation/themes/light";
import dark from "./presentation/themes/dark";
import { CssBaseline } from "@mui/material";
import Home from "./presentation/pages/Home";
// import Assessment from "./presentation/pages/Assessment";
import Vendors from "./presentation/pages/Vendors";
import Setting from "./presentation/pages/SettingsPage";
import Team from "./presentation/pages/Team";
Expand All @@ -23,11 +26,9 @@ import FileManager from "./presentation/pages/FileManager";

import { VerifyWiseContext } from "./application/contexts/VerifyWise.context";
import { useMemo, useState } from "react";
import AllAssessment from "./presentation/pages/Assessment/NewAssessment/AllAssessments";
import { Provider } from "react-redux";
import { PersistGate } from "redux-persist/integration/react";
import { store, persistor } from "./application/redux/store"; // Adjust the path as necessary
// import NewComplianceTracker from "./presentation/pages/ComplianceTracker/NewComplianceTracker";
import useProjectStatus from "./application/hooks/useProjectStatus";
import ProtectedRoute from "./presentation/components/ProtectedRoute";
import { extractUserToken } from "./application/tools/extractToken"; // Import the token extraction function
Expand Down Expand Up @@ -140,10 +141,6 @@ function App() {
/>
{/* <Route path="/assessment" element={<Assessment />} /> */}
<Route path="/assessment" element={<AssessmentTracker />} />
<Route
path="/all-assessments"
element={<AllAssessment initialAssessmentsValues={[]} />}
/>
<Route path="/vendors" element={<Vendors />} />
<Route path="/setting" element={<Setting />} />
<Route path="/team" element={<Team />} />
Expand Down
32 changes: 26 additions & 6 deletions Clients/src/presentation/components/AddNewRiskForm/MitigationSection/index.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,3 +1,7 @@
/**
* This file is currently in use
*/

import {
FC,
useState,
Expand Down Expand Up @@ -108,7 +112,7 @@ const MitigationSection: FC<MitigationSectionProps> = ({
} | null>(null);
const [fileUploadOpen, setFileUploadOpen] = useState(false);

const {users } = useUsers();
const { users } = useUsers();

const handleOnSelectChange = useCallback(
(prop: keyof MitigationFormValues) =>
Expand Down Expand Up @@ -217,7 +221,11 @@ const MitigationSection: FC<MitigationSectionProps> = ({
id="mitigation-status-input"
label="Mitigation status"
placeholder="Select status"
value={mitigationValues.mitigationStatus === 0 ? '' : mitigationValues.mitigationStatus}
value={
mitigationValues.mitigationStatus === 0
? ""
: mitigationValues.mitigationStatus
}
onChange={handleOnSelectChange("mitigationStatus")}
items={mitigationStatusItems}
sx={{
Expand Down Expand Up @@ -247,7 +255,11 @@ const MitigationSection: FC<MitigationSectionProps> = ({
id="current-risk-level-input"
label="Current risk level"
placeholder="Select risk level"
value={mitigationValues.currentRiskLevel === 0 ? '' : mitigationValues.currentRiskLevel}
value={
mitigationValues.currentRiskLevel === 0
? ""
: mitigationValues.currentRiskLevel
}
onChange={handleOnSelectChange("currentRiskLevel")}
items={riskLevelItems}
sx={{
Expand Down Expand Up @@ -326,9 +338,13 @@ const MitigationSection: FC<MitigationSectionProps> = ({
id="approver-input"
label="Approver"
placeholder="Select approver"
value={mitigationValues.approver === 0 ? '' : mitigationValues.approver}
value={
mitigationValues.approver === 0 ? "" : mitigationValues.approver
}
onChange={handleOnSelectChange("approver")}
items={users?.map((user) => ({ _id: user.id, name: user.name })) || []}
items={
users?.map((user) => ({ _id: user.id, name: user.name })) || []
}
sx={{
width: 324,
backgroundColor: theme.palette.background.main,
Expand All @@ -342,7 +358,11 @@ const MitigationSection: FC<MitigationSectionProps> = ({
id="approval-status-input"
label="Approval status"
placeholder="Select status"
value={mitigationValues.approvalStatus === 0 ? '' : mitigationValues.approvalStatus}
value={
mitigationValues.approvalStatus === 0
? ""
: mitigationValues.approvalStatus
}
onChange={handleOnSelectChange("approvalStatus")}
items={approvalStatusItems}
sx={{
Expand Down
20 changes: 16 additions & 4 deletions Clients/src/presentation/components/AddNewRiskForm/RisksSection/index.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,3 +1,7 @@
/**
* This file is currently in use
*/

import {
Stack,
Divider,
Expand Down Expand Up @@ -160,7 +164,9 @@ const RiskSection: FC<RiskSectionProps> = ({
id="action-owner-input"
label="Action owner"
placeholder="Select owner"
value={riskValues.actionOwner === 0 ? '' : riskValues.actionOwner}
value={
riskValues.actionOwner === 0 ? "" : riskValues.actionOwner
}
onChange={handleOnSelectChange("actionOwner")}
items={
users?.map((user) => ({ _id: user.id, name: user.name })) ||
Expand All @@ -171,12 +177,16 @@ const RiskSection: FC<RiskSectionProps> = ({
sx={{
width: "325px",
}}
/>
/>
<Select
id="ai-lifecycle-phase-input"
label="AI lifecycle phase"
placeholder="Select phase"
value={riskValues.aiLifecyclePhase === 0 ? '' : riskValues.aiLifecyclePhase}
value={
riskValues.aiLifecyclePhase === 0
? ""
: riskValues.aiLifecyclePhase
}
onChange={handleOnSelectChange("aiLifecyclePhase")}
items={aiLifecyclePhase}
isRequired
Expand Down Expand Up @@ -215,7 +225,9 @@ const RiskSection: FC<RiskSectionProps> = ({
id="risk-category-input"
label="Risk category"
placeholder="Select category"
value={riskValues.riskCategory === 0 ? '' : riskValues.riskCategory}
value={
riskValues.riskCategory === 0 ? "" : riskValues.riskCategory
}
onChange={handleOnSelectChange("riskCategory")}
items={riskCategorylItems}
isRequired
Expand Down
136 changes: 82 additions & 54 deletions Clients/src/presentation/components/AddNewRiskForm/index.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,8 +1,21 @@
/**
* This file is currently in use
*/

import TabContext from "@mui/lab/TabContext";
import TabList from "@mui/lab/TabList";
import TabPanel from "@mui/lab/TabPanel";
import { Box, Stack, Tab, useTheme, Typography, Button } from "@mui/material";
import { FC, useState, useCallback, useMemo, lazy, Suspense, useContext, useEffect } from "react";
import {
FC,
useState,
useCallback,
useMemo,
lazy,
Suspense,
useContext,
useEffect,
} from "react";
import "./styles.module.css";
import { Likelihood, Severity } from "../RiskLevel/constants";
import {
Expand Down Expand Up @@ -58,7 +71,7 @@ const mitigationInitialState: MitigationFormValues = {
approver: 0,
approvalStatus: 0,
dateOfAssessment: "",
recommendations: ""
recommendations: "",
};

/**
Expand Down Expand Up @@ -99,15 +112,15 @@ const AddNewRiskForm: FC<AddNewRiskFormProps> = ({
const [value, setValue] = useState("risks");
const handleChange = useCallback(
(_: React.SyntheticEvent, newValue: string) => {
console.log(newValue)
console.log(newValue);
setValue(newValue);
},
[]
);

const [searchParams] = useSearchParams();
const projectId = searchParams.get("projectId");
const {inputValues} = useContext(VerifyWiseContext);
const { inputValues } = useContext(VerifyWiseContext);

const tabStyle = useMemo(
() => ({
Expand All @@ -122,14 +135,14 @@ const AddNewRiskForm: FC<AddNewRiskFormProps> = ({
);

useEffect(() => {
if(popupStatus === 'edit'){
if (popupStatus === "edit") {
// riskData
const currentRiskData: RiskFormValues = {
...riskInitialState,
riskName: inputValues.risk_name ?? "",
riskName: inputValues.risk_name ?? "",
actionOwner: parseInt(inputValues.risk_owner) ?? 0,
riskDescription: inputValues.risk_description ?? "",
aiLifecyclePhase: parseInt(inputValues.ai_lifecycle_phase) ?? 0,
riskDescription: inputValues.risk_description ?? "",
aiLifecyclePhase: parseInt(inputValues.ai_lifecycle_phase) ?? 0,
riskCategory: parseInt(inputValues.risk_category) ?? 0,
potentialImpact: inputValues.impact ?? "",
assessmentMapping: inputValues.assessment_mapping,
Expand All @@ -146,20 +159,28 @@ const AddNewRiskForm: FC<AddNewRiskFormProps> = ({
mitigationPlan: inputValues.mitigation_plan,
currentRiskLevel: parseInt(inputValues.current_risk_level) ?? 0,
implementationStrategy: inputValues.implementation_strategy,
deadline: inputValues.deadline ? dayjs(inputValues.deadline).toISOString() : "",
deadline: inputValues.deadline
? dayjs(inputValues.deadline).toISOString()
: "",
doc: inputValues.mitigation_evidence_document,
likelihood: parseInt(inputValues.likelihood_mitigation) ?? 0,
riskSeverity: parseInt(inputValues.risk_severity) ?? 0,
approver: parseInt(inputValues.risk_approval) ?? 0,
approvalStatus: parseInt(inputValues.approval_status) ?? 0,
dateOfAssessment: inputValues.date_of_assessment ? dayjs(inputValues.date_of_assessment).toISOString() : "",
}
dateOfAssessment: inputValues.date_of_assessment
? dayjs(inputValues.date_of_assessment).toISOString()
: "",
};
setRiskValues(currentRiskData);
setMitigationValues(currentMitigationData)
setMitigationValues(currentMitigationData);
}
}, [popupStatus])
}, [popupStatus]);

const validateForm = useCallback((): { isValid: boolean, errors: RiskFormErrors, mitigationErrors: MitigationFormErrors } => {
const validateForm = useCallback((): {
isValid: boolean;
errors: RiskFormErrors;
mitigationErrors: MitigationFormErrors;
} => {
const newErrors: RiskFormErrors = {};
const newMitigationErrors: MitigationFormErrors = {};

Expand Down Expand Up @@ -300,62 +321,69 @@ const AddNewRiskForm: FC<AddNewRiskFormProps> = ({
// ); // Return true if no errors exist

return {
isValid: Object.keys(newErrors).length === 0 && Object.keys(newMitigationErrors).length === 0,
isValid:
Object.keys(newErrors).length === 0 &&
Object.keys(newMitigationErrors).length === 0,
errors: newErrors,
mitigationErrors: newMitigationErrors
mitigationErrors: newMitigationErrors,
};
}, [riskValues, mitigationValues]);

const riskFormSubmitHandler = async() => {
const riskFormSubmitHandler = async () => {
const { isValid, errors } = validateForm();

// check forms validate
if (isValid) {
const formData = {
"project_id": projectId,
"risk_name": riskValues.riskName,
"risk_owner": riskValues.actionOwner,
"ai_lifecycle_phase": riskValues.aiLifecyclePhase,
"risk_description": riskValues.riskDescription,
"risk_category": riskValues.riskCategory,
"impact": riskValues.potentialImpact,
"assessment_mapping": riskValues.assessmentMapping,
"controls_mapping": riskValues.controlsMapping,
"likelihood": riskValues.likelihood,
"severity": riskValues.riskSeverity,
"risk_level_autocalculated": riskValues.likelihood * riskValues.riskSeverity,
"review_notes": riskValues.reviewNotes,
"mitigation_status": mitigationValues.mitigationStatus,
"current_risk_level": mitigationValues.currentRiskLevel,
"deadline": mitigationValues.deadline,
"mitigation_plan": mitigationValues.mitigationPlan,
"implementation_strategy": mitigationValues.implementationStrategy,
"mitigation_evidence_document": mitigationValues.doc,
"likelihood_mitigation": mitigationValues.likelihood,
"risk_severity": mitigationValues.riskSeverity,
"final_risk_level": mitigationValues.likelihood * mitigationValues.riskSeverity,
"risk_approval": mitigationValues.approver,
"approval_status": mitigationValues.approvalStatus,
"date_of_assessment": mitigationValues.dateOfAssessment
}
project_id: projectId,
risk_name: riskValues.riskName,
risk_owner: riskValues.actionOwner,
ai_lifecycle_phase: riskValues.aiLifecyclePhase,
risk_description: riskValues.riskDescription,
risk_category: riskValues.riskCategory,
impact: riskValues.potentialImpact,
assessment_mapping: riskValues.assessmentMapping,
controls_mapping: riskValues.controlsMapping,
likelihood: riskValues.likelihood,
severity: riskValues.riskSeverity,
risk_level_autocalculated:
riskValues.likelihood * riskValues.riskSeverity,
review_notes: riskValues.reviewNotes,
mitigation_status: mitigationValues.mitigationStatus,
current_risk_level: mitigationValues.currentRiskLevel,
deadline: mitigationValues.deadline,
mitigation_plan: mitigationValues.mitigationPlan,
implementation_strategy: mitigationValues.implementationStrategy,
mitigation_evidence_document: mitigationValues.doc,
likelihood_mitigation: mitigationValues.likelihood,
risk_severity: mitigationValues.riskSeverity,
final_risk_level:
mitigationValues.likelihood * mitigationValues.riskSeverity,
risk_approval: mitigationValues.approver,
approval_status: mitigationValues.approvalStatus,
date_of_assessment: mitigationValues.dateOfAssessment,
};

if(popupStatus !== 'new'){
if (popupStatus !== "new") {
// call update API
try {
const response = await apiServices.put("/projectRisks/" + inputValues.id, formData);
console.log(response)
if (response.status === 200) {
const response = await apiServices.put(
"/projectRisks/" + inputValues.id,
formData
);
console.log(response);
if (response.status === 200) {
closePopup();
onSuccess();
}
} catch (error) {
console.error("Error sending request", error);
}
}else{
} else {
try {
const response = await apiServices.post("/projectRisks", formData);
console.log(response)
if (response.status === 201) {
console.log(response);
if (response.status === 201) {
closePopup();
onSuccess();
}
Expand All @@ -364,10 +392,10 @@ const AddNewRiskForm: FC<AddNewRiskFormProps> = ({
}
}
} else {
if(Object.keys(errors).length){
setValue('risks');
}else{
setValue('mitigation');
if (Object.keys(errors).length) {
setValue("risks");
} else {
setValue("mitigation");
}
}
};
Expand Down
Loading

0 comments on commit 8e753b5

Please sign in to comment.