function MainComponent() { const [operation, setOperation] = React.useState(''); const descriptions = { "Port Scan": "Scanning the target network to identify open ports and services. This operation helps in finding potential security vulnerabilities.", "Nearby Network Devices": "Listing all devices currently connected to the network. It provides a clear view of all the devices that could potentially be accessed.", "Ping": "Checking the availability of a network resource. This operation measures the round-trip time for messages sent from the originating host to a destination computer.", "Hop Count": "Determining the number of routers between your computer and the target. Useful for understanding the path packets take through the network.", "Network Devices": "Gathering details about each device on the network, including MAC addresses, IP addresses, and device types. This offers a comprehensive overview of the network's structure." }; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center min-h-screen bg-[#0A0A0A] text-white", __source: { fileName: "", lineNumber: 13, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-4xl font-bold mb-10 font-roboto", __source: { fileName: "", lineNumber: 14, columnNumber: 7 }, __self: this }, "Network Security Analyzer"), /*#__PURE__*/ React.createElement("div", { className: "space-y-4 text-center mb-10", __source: { fileName: "", lineNumber: 15, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>setOperation('Port Scan'), className: "px-8 py-4 bg-[#007bff] text-white rounded font-roboto shadow-xl", __source: { fileName: "", lineNumber: 16, columnNumber: 9 }, __self: this }, "Port Scan"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setOperation('Nearby Network Devices'), className: "px-8 py-4 bg-[#28a745] text-white rounded font-roboto shadow-xl", __source: { fileName: "", lineNumber: 17, columnNumber: 9 }, __self: this }, "Nearby Network Devices"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setOperation('Ping'), className: "px-8 py-4 bg-[#ffc107] text-white rounded font-roboto shadow-xl", __source: { fileName: "", lineNumber: 18, columnNumber: 9 }, __self: this }, "Ping"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setOperation('Hop Count'), className: "px-8 py-4 bg-[#dc3545] text-white rounded font-roboto shadow-xl", __source: { fileName: "", lineNumber: 19, columnNumber: 9 }, __self: this }, "Hop Count"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setOperation('Network Devices'), className: "px-8 py-4 bg-[#6c757d] text-white rounded font-roboto shadow-xl", __source: { fileName: "", lineNumber: 20, columnNumber: 9 }, __self: this }, "Network Devices")), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 22, columnNumber: 7 }, __self: this }, operation && /*#__PURE__*/ React.createElement("div", { className: "text-left p-8 max-w-2xl w-full bg-[#16181D] rounded-lg shadow-2xl", __source: { fileName: "", lineNumber: 24, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl mb-6 font-bold font-roboto", __source: { fileName: "", lineNumber: 25, columnNumber: 13 }, __self: this }, operation), /*#__PURE__*/ React.createElement("p", { className: "font-roboto", __source: { fileName: "", lineNumber: 26, columnNumber: 13 }, __self: this }, descriptions[operation])))); }