Merge pull request #30 from piypil/#docker_zap_in_to

zap docker
piypil · Nov 5, 2023 · 76fac28 · 76fac28
2 parents 4cd88b9 + 892e35f
commit 76fac28
Show file tree

Hide file tree

Showing 19 changed files with 1,067 additions and 186 deletions.
diff --git a/.gitignore b/.gitignore
@@ -9,11 +9,11 @@ media
 my_lilie
 models
 uploads
-project_scann
+project_scan
 lun903_python
 
 # Environments 
-.env 
+.env
 .venv 
 env/ 
 venv/ 

diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
@@ -18,7 +18,7 @@ function App() {
             <Route path='/about' element={<AboutPage />} />
             <Route path='/projects' element={<DashbordPage />} />
             <Route path='/results/:fileHash' element={<ProjectResultsPage />} />
-            <Route path='/results-dast/:fileHash' element={<ProjectResultsPageDAST />} />
+            <Route path='/results-dast/:uuid' element={<ProjectResultsPageDAST />} />
           </Routes>
         </ConfigProvider>
       </BrowserRouter>

diff --git a/frontend/src/components/ScanDAST.tsx b/frontend/src/components/ScanDAST.tsx
@@ -24,13 +24,18 @@ export function ScanDAST() {
         },
         body: JSON.stringify({ url, projectName }),
       });
-      const data = await response.json();
+      const textResponse = await response.text();
+      console.log("Raw server response:", textResponse);
+
+      const data = JSON.parse(textResponse);
       if (response.ok) {
         message.success(data.message || 'Scan started successfully!');
       } else {
+        console.error("Server Response:", data); 
         message.error(data.error || 'Error starting scan.');
       }
     } catch (error) {
+      console.error("Fetch Error:", error);
       message.error('Error starting scan.');
     }
   };
@@ -57,7 +62,7 @@ export function ScanDAST() {
           name="url"
           rules={[{ required: true, type: 'url', warningOnly: true }, { type: 'string', min: 6 }]}
         >
-          <Input placeholder="Input target" />
+          <Input placeholder="http://host.docker.internal:port" />
         </Form.Item>
         <Form.Item
           name="projectName"
@@ -83,7 +88,10 @@ export function ScanDAST() {
             </div>
           </Space>
           <div style={{ display: 'flex', alignItems: 'center' }}>
-            <Button type="primary" htmlType="submit">
+            <Button
+              type="primary"
+              onClick={() => form.submit()}
+            >
               ПУСК
             </Button>
             <Button icon={<SettingOutlined />} onClick={toggleModal} style={{ marginLeft: '8px' }}></Button>

diff --git a/frontend/src/components/TableViewDAST.tsx b/frontend/src/components/TableViewDAST.tsx
@@ -1,116 +1,111 @@
 import React, { useEffect, useState } from 'react';
-import { Space, Table, Spin, Modal, Button } from 'antd';
-import { ExclamationCircleOutlined } from '@ant-design/icons';
+import { Space, Table, Spin, notification, Button } from 'antd';
+import { ExclamationCircleOutlined, DownloadOutlined, DeleteOutlined } from '@ant-design/icons';
 import type { ColumnsType } from 'antd/es/table';
 import axios from 'axios';
-import { Link } from 'react-router-dom';
 import moment from 'moment';
 import { useTheme } from '../components/ThemeContext';
-
-const { confirm } = Modal;
+import { Link } from 'react-router-dom';
 
 const API_BASE_URL = process.env.REACT_APP_API_URL;
 
-interface ProjectData {
-  id: number;
+interface DASTData {
+  uuid: string;
   project_name: string;
   url: string;
   scan_date: string;
   results: any;
 }
 
 export function TableViewDAST() {
-  const [data, setData] = useState<ProjectData[]>([]);
+  const [data, setData] = useState<DASTData[]>([]);
   const [loading, setLoading] = useState<boolean>(true);
   const { theme } = useTheme();
 
-  const deleteRecord = (id: number) => {
-    // Надо добавить удаление записи
-    console.log('Delete record with id:', id);
-  }
-
-  const showDeleteConfirm = (id: number) => {
-    confirm({
-      title: 'Are you sure delete this record?',
-      icon: <ExclamationCircleOutlined />,
-      onOk() {
-        deleteRecord(id);
-      },
-      onCancel() {
-        console.log('Cancel');
-      },
+  const handleError = (message: string) => {
+    notification.error({
+      message: "Error",
+      description: message
     });
-  }
+  };
 
-  const columns: ColumnsType<ProjectData> = [
+  const columns: ColumnsType<DASTData> = [
     {
       title: 'Project',
       dataIndex: 'project_name',
       key: 'project_name',
-      render: (project_name, record) => (
+      render: (name, record) => (
         <Space size="middle">
-          <Link to={`/results-dast/${record.id}`}>{project_name}</Link>
+          <Link to={`/results-dast/${record.uuid}`}>{name}</Link>
         </Space>
       ),
     },
     {
       title: 'ID',
-      dataIndex: 'id',
-      key: 'id',
+      dataIndex: 'uuid',
+      key: 'uuid',
     },
     {
       title: 'URL',
       dataIndex: 'url',
       key: 'url',
-      render: (url) => (
-        <a href={url} target="_blank" rel="noopener noreferrer">{url}</a>
-      ),
     },
     {
       title: 'Scan Date',
       dataIndex: 'scan_date',
+      key: 'scan_date',
       render: (date) => moment(date).format('YYYY.MM.DD -> HH:mm'),
     },
     {
       title: 'Action',
       key: 'action',
       render: (_, record) => (
         <Space size="middle">
-          <Button danger onClick={() => showDeleteConfirm(record.id)}>
-            Delete
+          <a target="_blank" rel="noopener noreferrer">
+            <DownloadOutlined /> Download
+          </a>
+          <Button>
+            <DeleteOutlined /> Delete
           </Button>
         </Space>
       ),
-    },
+      },
   ];
 
   useEffect(() => {
     axios
-      .get(`${API_BASE_URL}/scanned-projects/`)
+      .get(`${API_BASE_URL}/dast-projects/`)
       .then((response) => {
         setData(response.data);
         setLoading(false);
       })
       .catch((error) => {
-        console.log(error);
+        handleError('Error fetching DAST data.');
+        console.error(error);
         setLoading(false);
       });
   }, []);
 
   const tableClassName = theme === 'dark' ? 'dark-theme' : '';
 
   if (loading) {
-    return <Spin size="large" />;
+    return (
+      <div style={{ textAlign: 'center', marginTop: '5rem' }}>
+        <Spin size="large" />
+      </div>
+    );
   }
 
   return (
-    <Table
-      className={tableClassName}
-      columns={columns}
-      dataSource={data}
-      rowKey={(record) => record.id.toString()}
-    />
-  );
+    <div style={{ padding: '1rem' }}>
+      <Table
+        className={tableClassName}
+        columns={columns}
+        dataSource={data}
+        rowKey={(record) => record.uuid}
+      />
+    </div>
+  )
 }
 
 export default TableViewDAST;
diff --git a/frontend/src/components/TableViewSAST.tsx b/frontend/src/components/TableViewSAST.tsx
@@ -87,8 +87,8 @@ export function TableViewSAST() {
           </Button>
         </Space>
       ),
-    },
-  ];
+      },
+    ];
 
   useEffect(() => {
     axios