adding the ui of the scan feature

src/main/api/project.ts

@@ -165,3 +165,12 @@ export function projectDetails(projectName: string) {
     throw new Error('Project Cannot be created');
   }
 }
+
+export function projectScan(projectName: string) {
+  try {
+    const db = connectJson(`${PROJECT_DIR}/${projectName}/cf_scan.json`);
+    return db.read();
+  } catch (error) {
+    return 'error';
+  }
+}

src/main/main.ts

@@ -22,6 +22,7 @@ import {
   createProjectDir,
   createRequestToUrlScanner,
   projectDetails,
+  projectScan,
   readDirectoryNames,
 } from './api/project';
 import { liveSubDomains, screenwin } from './recon/httpx';
@@ -105,6 +106,12 @@ ipcMain.handle('get-project-details', async (event, args) => {
   return data;
 });
 
+ipcMain.handle('get-project-scan', async (event, args) => {
+  const projectName = args[0];
+  const data = projectScan(projectName);
+  return data;
+});
+
 ipcMain.handle('list-projects', async (event) => {
   const dirs = readDirectoryNames();
   return dirs;

src/main/preload.ts

@@ -16,6 +16,7 @@ export type Channels =
   | 'api-call'
   | 'find-secrets'
   | 'extra-links'
+  | 'get-project-scan'
   | 'open-link';
 
 const electronHandler = {

src/renderer/views/project/status.tsx

@@ -9,12 +9,21 @@ import { ProjectDetails } from '../../types';
 export default function Status() {
   const { projectSlug } = useParams();
   const [project, setProjects] = useState<ProjectDetails>();
+  const [scan, setScan] = useState<any>();
   const list = async () => {
     try {
       const projectNames = await window.electron.ipcRenderer.invoke(
         'get-project-details',
         projectSlug,
       );
+      const projectScan = await window.electron.ipcRenderer.invoke(
+        'get-project-scan',
+        projectSlug,
+      );
+      if (projectScan !== 'error') {
+        setScan(projectScan);
+        console.log(projectScan);
+      }
       setProjects(projectNames);
     } catch (error) {
       console.error('Error listing projects:', error);
@@ -25,8 +34,48 @@ export default function Status() {
     list();
   }, []);
   return (
-    <div className="grid grid-flow-row grid-cols-2 gap-20 container py-10">
-      {project && <StatusCard {...project} />}
+    <div className="container py-10">
+      {scan && (
+        <div className="flex flex-col gap-2">
+          <h1 className="text-xl font-bold">Target Information</h1>
+          <div>
+            <h1>Tech Stack</h1>
+            <ul className="grid grid-flow-cols grid-cols-2 gap-2 py-2 px-1.5 border-2 rounded">
+              {scan &&
+                scan.scan.meta.processors.tech.map((tech: any) => {
+                  return (
+                    <li className="flex items-center space-x-2">
+                      <img
+                        className="h-6 w-6"
+                        alt={tech.name}
+                        src={`https://www.google.com/s2/favicons?domain=${tech.website}&sz=128`}
+                      />
+                      <h1 className="text-xs font-bold">{tech.name}</h1>
+                    </li>
+                  );
+                })}
+            </ul>
+          </div>
+          <div>
+            <h1>Target Ips</h1>
+            <ul className="grid grid-flow-cols grid-cols-2 gap-2 py-2 px-1.5 border-2 rounded">
+              {scan &&
+                Object.entries(scan.scan.ips).map(([key, value]) => {
+                  return (
+                    <li className="flex items-center space-x-2">
+                      <h1 className="text-xs font-bold">
+                        {value.ipVersion}: {key}
+                      </h1>
+                    </li>
+                  );
+                })}
+            </ul>
+          </div>
+        </div>
+      )}
+      <div className="grid grid-flow-row grid-cols-2 gap-20">
+        {project && <StatusCard {...project} />}
+      </div>
     </div>
   );
 }