Merge branch 'main' of https://github.com/AWS-Cloud-School-6/AIWA-MCP…

…-Frontend
AWS-Cloud-School-6 · Nov 27, 2024 · aebe00f · aebe00f
2 parents fdfbfd3 + 91e9096
commit aebe00f
Show file tree

Hide file tree

Showing 16 changed files with 1,137 additions and 101 deletions.
diff --git a/aiwa-mcp-frontend/src/Console/Features/Instance/Instance.js b/aiwa-mcp-frontend/src/Console/Features/Instance/Instance.js
@@ -3,12 +3,66 @@ import { Flex, Heading } from '@aws-amplify/ui-react';
 import EC2Table from "./table/EC2Table";
 import SidebarEc2 from "./Sidebar/SidebarEc2";
 import NavBar from '../../NavBar/NavBar';
+import { NotificationContainer, NotificationManager } from 'react-notifications';
+import axios from 'axios';
+import { AWS_API_URL, GCP_API_URL } from '../../../index';
+
+export const fetchEC2AndGCPData = async (currentUser, selectedCompany, projectId, accessKey) => {
+  try {
+    const [ec2Response, gcpResponse] = await Promise.all([
+      accessKey
+        ? axios.get(
+          `${AWS_API_URL}/ec2/describe?userId=${currentUser.id}&companyName=${selectedCompany}`
+          )
+        : Promise.resolve({data: {}}),
+      projectId
+        ? axios.get(
+            `${GCP_API_URL}/vm/describe?projectId=${projectId}&userId=${currentUser.id}`
+          )
+        : Promise.resolve({ data: {} }),
+    ]);
+
+    // EC2 데이터 처리
+    const processedEC2s =
+      ec2Response.data.list?.map((ec2) => ({
+        instanceId: ec2.instanceId || "N/A",
+        state: ec2.state || "Unknown",
+        name: ec2.tags?.["Name"] || "-",
+        publicIpAddress: ec2.publicIpAddress || "N/A",
+        privateIpAddress: ec2.privateIpAddress || "N/A",
+        type: "AWS",
+      })) || [];
+
+    // GCP 데이터 처리
+    const processedGCPs =
+      gcpResponse.data.list?.map((vm) => ({
+        name: vm.name || "N/A",
+        status: vm.status || "Unknown",
+        internalIp: vm.networkInterfaces
+          ?.map(ni => ni.internalIp)
+          .filter(Boolean)
+          .join(',') || "N/A",
+        externalIp: vm.networkInterfaces
+          ?.map(ni => ni.externalIp)
+          .filter(Boolean)
+          .join(', ') || "N/A",
+        type: "GCP",
+      })) || [];
+
+    // EC2와 GCP 데이터를 통합
+    return [...processedEC2s, ...processedGCPs];
+  } catch (error) {
+    console.error("Error fetching EC2 or GCP data:", error);
+    throw error;
+  }
+};
 
 function Instance() {
     return (
-        <div>
+        <div style={{ height: '100vh', display: 'flex', flexDirection: 'column' }}>
             <NavBar />
-            <Flex direction="row">
+            <NotificationContainer />
+            <Flex direction="row"  style={{ flex: 1, overflow: 'hidden' }}>
                 <SidebarEc2 />
                 <Flex direction="column" style={{ width: '100%', padding: '20px' }}>
                     <Flex justifyContent="space-between" alignItems="center" marginBottom="20px">

diff --git a/aiwa-mcp-frontend/src/Console/Features/Instance/Sidebar/SidebarEc2.module.css b/aiwa-mcp-frontend/src/Console/Features/Instance/Sidebar/SidebarEc2.module.css
@@ -1,4 +1,4 @@
-.sidebarVpc {
+.sidebarEc2 {
     display: flex;
     align-items: center;
     gap: 10px;

diff --git a/aiwa-mcp-frontend/src/Console/Features/Instance/index.js b/aiwa-mcp-frontend/src/Console/Features/Instance/index.js
@@ -6,16 +6,19 @@ import AWS_instance_launch from './AWS_instance_launch'; // AWS subpage
 import GCP_instance_launch from './GCP_instance_launch'; // GCP subpage
 import ENI from './eni/eni';
 import Securitygroup from './securityGroup/Securitygroup';
+import { NotificationProvider } from '../NotificationContext';
 
 function InstanceRoutes() {
     return (
-        <Routes>
-            <Route path="/" element={<Instance />} /> {/* Main EC2 Console */}
-            <Route path="aws" element={<AWS_instance_launch />} /> {/* AWS Subpage */}
-            <Route path="gcp" element={<GCP_instance_launch />} /> {/* GCP Subpage */}
-            <Route path="/eni" element={<ENI />} /> {/* Main EC2 Console */}
-            <Route path="/securitygroup" element={<Securitygroup/>} />  {}
-        </Routes>
+        <NotificationProvider>
+            <Routes>
+                <Route path="/" element={<Instance />} /> {/* Main EC2 Console */}
+                <Route path="aws" element={<AWS_instance_launch />} /> {/* AWS Subpage */}
+                <Route path="gcp" element={<GCP_instance_launch />} /> {/* GCP Subpage */}
+                <Route path="/eni" element={<ENI />} /> {/* Main EC2 Console */}
+                <Route path="/securitygroup" element={<Securitygroup/>} />  {}
+            </Routes>
+        </NotificationProvider>
     );
 }
 

diff --git a/aiwa-mcp-frontend/src/Console/Features/Instance/table/ActionButtons.jsx b/aiwa-mcp-frontend/src/Console/Features/Instance/table/ActionButtons.jsx
@@ -6,12 +6,7 @@ function ActionButtons({ selectedCount, onEdit, onDelete }) {
 
   return (
     <div className={styles.actionButtons} style={{ display: 'flex', flexDirection: 'row' }}>
-      { (
-        <button onClick={onEdit} className={styles.EC2Button} style={{ marginRight: '10px' }}>
-          Create
-        </button>
-      )}
-      <button onClick={onDelete} className={styles.EC2Button}>
+      <button onClick={onDelete} disabled={selectedCount !== 1} className={styles.AddVPCButton}>
         Delete
       </button>
     </div>