Feature/edit findings audit

frontend/src/components/navbar/AuditSidebar.tsx

@@ -1,5 +1,6 @@
 /* eslint-disable import/extensions */
 /* eslint-disable sonarjs/no-duplicate-string */
+import { CheckIcon } from '@heroicons/react/20/solid';
 import clsx from 'clsx';
 import { t } from 'i18next';
 import {
@@ -34,6 +35,7 @@ type Finding = {
   category: string;
   severity: string;
   identifier: string;
+  status: number;
 };
 
 type SortOption = {
@@ -313,6 +315,11 @@ const AuditSidebar = ({
                   >
                     {finding.name}
                   </span>
+                  {finding.status === 0 && !isCollapsed ? (
+                    <span>
+                      <CheckIcon className="h-6 w-6 text-gray-500" />
+                    </span>
+                  ) : null}
                 </li>
               </Link>
             ))}

frontend/src/i18n/en-US/index.ts

@@ -202,6 +202,7 @@ export default {
     passwordsDontMatch: 'Passwords do not match',
     errorGeneratingPdf: 'Failed exporting audit to pdf',
     errorSavingAuditCustomSections: 'Failed saving the audit custom sections',
+    failedDeleteFinding: 'Failed to delete the finding',
     createUser: 'Error creating user',
     confirmPasswordDifferents: 'Passwords do not match',
   },

frontend/src/routes/audits/edit/AuditContext.tsx

@@ -0,0 +1,41 @@
+import React, { createContext } from 'react';
+
+type FindingType = {
+  id: number;
+  name: string;
+  category: string;
+  severity: string;
+  identifier: string;
+  status: number;
+};
+
+type AuditContextType = {
+  title: string;
+  auditType: string;
+  locale: string;
+  handlerFindings: () => Promise<FindingType[]>;
+};
+
+const defaultContextValue: AuditContextType = {
+  title: '',
+  auditType: '',
+  locale: '',
+  handlerFindings: () => Promise.resolve([]),
+};
+
+type AuditContextProps = {
+  children: React.ReactNode;
+  value: AuditContextType;
+};
+
+export const AuditContext =
+  createContext<AuditContextType>(defaultContextValue);
+
+export const AuditProvider: React.FC<AuditContextProps> = ({
+  children,
+  value,
+}) => {
+  return (
+    <AuditContext.Provider value={value}>{children}</AuditContext.Provider>
+  );
+};

frontend/src/routes/audits/edit/AuditRoot.tsx

@@ -9,6 +9,7 @@ import { getCustomSections, Section } from '@/services/data';
 
 import AuditSidebar from '../../../components/navbar/AuditSidebar';
 import { AuditSection, Finding, getAuditById } from '../../../services/audits';
+import { AuditProvider } from './AuditContext';
 
 export const AuditRoot = () => {
   const { t } = useTranslation();
@@ -27,6 +28,7 @@ export const AuditRoot = () => {
       category: string;
       severity: string;
       identifier: string;
+      status: number;
     }[]
   >([]);
 
@@ -70,6 +72,9 @@ export const AuditRoot = () => {
   const [auditSections, setAuditSections] = useState<AuditSection[]>([]);
   const [sections, setSections] = useState<Section[]>([]);
   const [isListVisible, setIsListVisible] = useState(false);
+  const [nameAudit, setNameAudit] = useState<string>('');
+  const [auditType, setAuditType] = useState<string>('');
+  const [currentLanguage, setCurrentLanguage] = useState<string>('');
 
   useEffect(() => {
     getCustomSections()
@@ -108,12 +113,18 @@ export const AuditRoot = () => {
             return {
               id: finding.identifier,
               name: finding.title,
+              //TODO: Change hardcoded category to the real category
               category: 'No Category',
               severity: cvssStringToSeverity(finding.cvssv3),
               identifier: finding._id,
+              status: finding.status,
             };
           }),
         );
+        // handlerFindings(audit.datas.findings);
+        setNameAudit(audit.datas.name);
+        setAuditType(audit.datas.auditType);
+        setCurrentLanguage(audit.datas.language);
       })
       .catch(console.error);
   }, [auditId, sections]);
@@ -127,6 +138,31 @@ export const AuditRoot = () => {
 
   const connectedUsers: { id: number; name: string; online: boolean }[] = [];
 
+  const handlerFindings = async () => {
+    try {
+      const audit = await getAuditById(auditId);
+      const findingsData = audit.datas.findings.map((findingIter: Finding) => ({
+        id: findingIter.identifier,
+        name: findingIter.title,
+        category: 'No Category',
+        severity: cvssStringToSeverity(findingIter.cvssv3),
+        identifier: findingIter._id,
+        status: findingIter.status,
+      }));
+      setFindings(findingsData);
+      return findingsData;
+    } catch (error) {
+      console.error(error);
+      return [];
+    }
+  };
+
+  const auditData = {
+    title: nameAudit,
+    auditType,
+    locale: currentLanguage,
+  };
+
   return (
     <div className="flex overflow-hidden">
       <AuditSidebar
@@ -149,7 +185,9 @@ export const AuditRoot = () => {
         sortOrderOptions={sortOrderOptions}
       />
       <div className="flex-1 overflow-auto">
-        <Outlet />
+        <AuditProvider value={{ ...auditData, handlerFindings }}>
+          <Outlet />
+        </AuditProvider>
       </div>
     </div>
   );

frontend/src/routes/audits/edit/findings/add/add.tsx

@@ -16,6 +16,7 @@ import {
   getLanguages,
   getVulnByLanguage,
 } from '../../../../../services/audits';
+import { useAuditContext } from '../../useAuditContext';
 import DivWrapper from './DivWrapper';
 import NewVulnButton from './NewVulnButton';
 
@@ -42,6 +43,8 @@ let dataLanguage: { status: string; datas: Language[] } = {
   datas: [],
 };
 export const Add = () => {
+  const { handlerFindings } = useAuditContext();
+
   const [languages, setLanguages] = useState<ListItem[]>([]);
   const [currentLanguage, setCurrentLanguage] = useState<ListItem | null>(null);
   const [loadingLanguages, setLoadingLanguages] = useState<boolean>(true);
@@ -130,23 +133,26 @@ export const Add = () => {
   }, [currentLanguage, setTableData, dataLanguage]);
 
   const handleAddVuln = useCallback(
-    (item: TableData) => {
-      addVuln(
-        item.id,
-        auditId ?? '',
-        currentLanguage ? currentLanguage.value : 'en',
-      )
-        .then(res => {
-          if (res.status === 'success') {
-            setNewVulnTitle('');
-            toast.success(t('msg.findingCreateOk'));
-          } else {
-            toast.error(res.datas);
-          }
-        })
-        .catch(console.error);
+    async (item: TableData) => {
+      try {
+        const res = await addVuln(
+          item.id,
+          auditId ?? '',
+          currentLanguage ? currentLanguage.value : 'en',
+        );
+
+        if (res.status === 'success') {
+          setNewVulnTitle('');
+          toast.success(t('msg.findingCreateOk'));
+          await handlerFindings();
+        } else {
+          toast.error(res.datas);
+        }
+      } catch (error) {
+        console.error(error);
+      }
     },
-    [auditId, currentLanguage],
+    [auditId, currentLanguage, handlerFindings],
   );
 
   const rowActions = [