function ServerQueueMonitor({ serverStatus, queueStatus }) { return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center w-full h-full", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-black font-bold text-4xl mb-8 font-bangers", __source: { fileName: "", lineNumber: 4, columnNumber: 7 }, __self: this }, "FORTNITE WAITINGROOM"), /*#__PURE__*/ React.createElement("div", { className: "flex space-x-8", __source: { fileName: "", lineNumber: 5, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-[400px] p-8 bg-white bg-opacity-75 rounded-lg shadow-lg border border-gray-300", __source: { fileName: "", lineNumber: 6, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-black font-bold text-2xl mb-4 font-bangers", __source: { fileName: "", lineNumber: 7, columnNumber: 11 }, __self: this }, "SERVER STATUS"), /*#__PURE__*/ React.createElement("p", { className: `text-2xl mb-4 font-bangers font-bold ${serverStatus.online ? 'text-green-500' : 'text-red-500'}`, __source: { fileName: "", lineNumber: 8, columnNumber: 11 }, __self: this }, serverStatus.online ? 'ONLINE' : 'OFFLINE'), /*#__PURE__*/ React.createElement("div", { className: "text-gray-700 font-roboto text-lg", __source: { fileName: "", lineNumber: 11, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "flex justify-between mb-2", __source: { fileName: "", lineNumber: 12, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 12, columnNumber: 54 }, __self: this }, "MESSAGE:"), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 12, columnNumber: 75 }, __self: this }, serverStatus.message)), /*#__PURE__*/ React.createElement("p", { className: "flex justify-between mb-8", __source: { fileName: "", lineNumber: 13, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 13, columnNumber: 54 }, __self: this }, "SINCE:"), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 13, columnNumber: 73 }, __self: this }, serverStatus.since)), /*#__PURE__*/ React.createElement("h3", { className: "text-black font-bold text-xl mb-2 font-bangers", __source: { fileName: "", lineNumber: 14, columnNumber: 13 }, __self: this }, "SCHEDULED DOWNTIME:"), /*#__PURE__*/ React.createElement("p", { className: "flex justify-between mb-4", __source: { fileName: "", lineNumber: 15, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 15, columnNumber: 54 }, __self: this }, "DOWNTIME START:"), /*#__PURE__*/ React.createElement("span", { className: "text-red-500", __source: { fileName: "", lineNumber: 15, columnNumber: 82 }, __self: this }, serverStatus.downtimeStart)), /*#__PURE__*/ React.createElement("p", { className: "flex justify-between", __source: { fileName: "", lineNumber: 16, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 16, columnNumber: 49 }, __self: this }, "UPDATED:"), /*#__PURE__*/ React.createElement("span", { className: "text-red-500", __source: { fileName: "", lineNumber: 16, columnNumber: 70 }, __self: this }, serverStatus.updated)))), /*#__PURE__*/ React.createElement("div", { className: "w-[400px] p-8 bg-white bg-opacity-75 rounded-lg shadow-lg border border-gray-300", __source: { fileName: "", lineNumber: 19, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-black font-bold text-2xl mb-4 font-bangers", __source: { fileName: "", lineNumber: 20, columnNumber: 11 }, __self: this }, "QUEUE"), /*#__PURE__*/ React.createElement("p", { className: `text-2xl mb-4 font-bangers font-bold ${queueStatus.enabled ? 'text-green-500' : 'text-red-500'}`, __source: { fileName: "", lineNumber: 21, columnNumber: 11 }, __self: this }, queueStatus.enabled ? 'ENABLED' : 'DISABLED'), /*#__PURE__*/ React.createElement("h3", { className: "text-black font-bold text-xl mb-4 font-bangers", __source: { fileName: "", lineNumber: 24, columnNumber: 11 }, __self: this }, "QUEUETIME:"), /*#__PURE__*/ React.createElement("div", { className: "text-gray-700 font-roboto text-lg", __source: { fileName: "", lineNumber: 25, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "flex justify-between mb-2", __source: { fileName: "", lineNumber: 26, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 26, columnNumber: 54 }, __self: this }, "CURRENT:"), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 26, columnNumber: 75 }, __self: this }, queueStatus.current)), /*#__PURE__*/ React.createElement("p", { className: "flex justify-between mb-2", __source: { fileName: "", lineNumber: 27, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 27, columnNumber: 54 }, __self: this }, "LAST CHANGE:"), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 27, columnNumber: 79 }, __self: this }, queueStatus.lastChange)), /*#__PURE__*/ React.createElement("p", { className: "flex justify-between mb-2", __source: { fileName: "", lineNumber: 28, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 28, columnNumber: 54 }, __self: this }, "HIGHEST:"), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 28, columnNumber: 75 }, __self: this }, queueStatus.highest)), /*#__PURE__*/ React.createElement("p", { className: "flex justify-between", __source: { fileName: "", lineNumber: 29, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 29, columnNumber: 49 }, __self: this }, "ON:"), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 29, columnNumber: 65 }, __self: this }, queueStatus.on)))))); } function ServerQueueMonitorStory() { const serverStatus = { online: true, message: 'FORTNITE IS ONLINE.', since: 'UNKNOWN', downtimeStart: 'UNKNOWN', updated: 'UNKNOWN' }; const queueStatus = { enabled: false, current: 'NONE', lastChange: 'UNKNOWN', highest: 'UNKNOWN', on: 'UNKNOWN' }; return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 55, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(ServerQueueMonitor, { serverStatus: serverStatus, queueStatus: queueStatus, __source: { fileName: "", lineNumber: 56, columnNumber: 7 }, __self: this })); } function MainComponent() { const serverStatus = { online: true, message: 'FORTNITE IS ONLINE.', since: 'UNKNOWN', downtimeStart: 'UNKNOWN', updated: 'UNKNOWN' }; const queueStatus = { enabled: false, current: 'NONE', lastChange: 'UNKNOWN', highest: 'UNKNOWN', on: 'UNKNOWN' }; return /*#__PURE__*/ React.createElement("div", { className: "bg-cover bg-center w-full h-screen", style: { backgroundImage: "url('/path/to/background-image.jpg')" }, __source: { fileName: "", lineNumber: 19, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(ServerQueueMonitor, { serverStatus: serverStatus, queueStatus: queueStatus, __source: { fileName: "", lineNumber: 20, columnNumber: 7 }, __self: this })); }