blank screen
This commit is contained in:
parent
98918d33b3
commit
dd60497e5b
12 changed files with 838 additions and 496 deletions
11
.env
11
.env
|
|
@ -1,3 +1,10 @@
|
|||
# Database Configuration
|
||||
VITE_DB_HOST=db.pandem.fr
|
||||
VITE_DB_USER=proxdash
|
||||
VITE_DB_PASSWORD=proxdash
|
||||
VITE_DB_NAME=proxdash
|
||||
|
||||
VITE_SUPABASE_ANON_KEY=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6InZwZmJzY2psanBtcGJjb2hteHJtIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NDIxNTk1NjIsImV4cCI6MjA1NzczNTU2Mn0.bMHEDr8XS2fFVr38JuCJOF80sWU3P4isQ1DStRuwUiw
|
||||
VITE_SUPABASE_URL=https://vpfbscjljpmpbcohmxrm.supabase.co
|
||||
# InfluxDB Configuration (if needed)
|
||||
VITE_INFLUX_URL=
|
||||
VITE_INFLUX_TOKEN=
|
||||
VITE_INFLUX_ORG=
|
||||
|
|
@ -2,12 +2,12 @@
|
|||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<link rel="icon" type="image/svg+xml" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='%23E06B6C' stroke='%23E06B6C' stroke-width='0' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21.47 4.35l.708-.708a1 1 0 0 0-.708-.708l-.708.708a1 1 0 0 0 .708.708zm.867 13.04a4.98 4.98 0 0 1-1.414 3.536l-1.829-1.829a4.92 4.92 0 0 1-3.364 1.364l-2.121 2.121a4.98 4.98 0 0 1-3.536 1.414 4.98 4.98 0 0 1-3.536-1.414l2.121-2.121a4.92 4.92 0 0 1-1.364-3.364l-1.829-1.829a4.98 4.98 0 0 1-1.414-3.536 4.98 4.98 0 0 1 1.414-3.536l2.121 2.121a4.92 4.92 0 0 1 3.364-1.364l1.829-1.829a4.98 4.98 0 0 1 3.536-1.414 4.98 4.98 0 0 1 3.536 1.414l-2.121 2.121a4.92 4.92 0 0 1 1.364 3.364l1.829 1.829a4.98 4.98 0 0 1 1.414 3.536z'/%3E%3C/svg%3E" />
|
||||
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Proxmox Chooser</title>
|
||||
<title>Vite + React + TS</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="root"></div>
|
||||
<script type="module" src="/src/main.tsx"></script>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
505
package-lock.json
generated
505
package-lock.json
generated
|
|
@ -1,18 +1,19 @@
|
|||
{
|
||||
"name": "vite-react-typescript-starter",
|
||||
"name": "proxmox-dashboard",
|
||||
"version": "0.0.0",
|
||||
"lockfileVersion": 3,
|
||||
"requires": true,
|
||||
"packages": {
|
||||
"": {
|
||||
"name": "vite-react-typescript-starter",
|
||||
"name": "proxmox-dashboard",
|
||||
"version": "0.0.0",
|
||||
"dependencies": {
|
||||
"@supabase/supabase-js": "^2.39.7",
|
||||
"framer-motion": "^11.0.8",
|
||||
"lucide-react": "^0.344.0",
|
||||
"mysql2": "^3.9.2",
|
||||
"react": "^18.3.1",
|
||||
"react-dom": "^18.3.1"
|
||||
"react-dom": "^18.3.1",
|
||||
"recharts": "^2.12.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@eslint/js": "^9.9.1",
|
||||
|
|
@ -292,6 +293,17 @@
|
|||
"@babel/core": "^7.0.0-0"
|
||||
}
|
||||
},
|
||||
"node_modules/@babel/runtime": {
|
||||
"version": "7.26.10",
|
||||
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.26.10.tgz",
|
||||
"integrity": "sha512-2WJMeRQPHKSPemqk/awGrAiuFfzBmOIPXKizAsVhWH9YJqLZ0H+HS4c8loHGgW6utJ3E/ejXQUsiGaQy2NZ9Fw==",
|
||||
"dependencies": {
|
||||
"regenerator-runtime": "^0.14.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=6.9.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@babel/template": {
|
||||
"version": "7.25.7",
|
||||
"resolved": "https://registry.npmjs.org/@babel/template/-/template-7.25.7.tgz",
|
||||
|
|
@ -1313,6 +1325,60 @@
|
|||
"@babel/types": "^7.20.7"
|
||||
}
|
||||
},
|
||||
"node_modules/@types/d3-array": {
|
||||
"version": "3.2.1",
|
||||
"resolved": "https://registry.npmjs.org/@types/d3-array/-/d3-array-3.2.1.tgz",
|
||||
"integrity": "sha512-Y2Jn2idRrLzUfAKV2LyRImR+y4oa2AntrgID95SHJxuMUrkNXmanDSed71sRNZysveJVt1hLLemQZIady0FpEg=="
|
||||
},
|
||||
"node_modules/@types/d3-color": {
|
||||
"version": "3.1.3",
|
||||
"resolved": "https://registry.npmjs.org/@types/d3-color/-/d3-color-3.1.3.tgz",
|
||||
"integrity": "sha512-iO90scth9WAbmgv7ogoq57O9YpKmFBbmoEoCHDB2xMBY0+/KVrqAaCDyCE16dUspeOvIxFFRI+0sEtqDqy2b4A=="
|
||||
},
|
||||
"node_modules/@types/d3-ease": {
|
||||
"version": "3.0.2",
|
||||
"resolved": "https://registry.npmjs.org/@types/d3-ease/-/d3-ease-3.0.2.tgz",
|
||||
"integrity": "sha512-NcV1JjO5oDzoK26oMzbILE6HW7uVXOHLQvHshBUW4UMdZGfiY6v5BeQwh9a9tCzv+CeefZQHJt5SRgK154RtiA=="
|
||||
},
|
||||
"node_modules/@types/d3-interpolate": {
|
||||
"version": "3.0.4",
|
||||
"resolved": "https://registry.npmjs.org/@types/d3-interpolate/-/d3-interpolate-3.0.4.tgz",
|
||||
"integrity": "sha512-mgLPETlrpVV1YRJIglr4Ez47g7Yxjl1lj7YKsiMCb27VJH9W8NVM6Bb9d8kkpG/uAQS5AmbA48q2IAolKKo1MA==",
|
||||
"dependencies": {
|
||||
"@types/d3-color": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/@types/d3-path": {
|
||||
"version": "3.1.1",
|
||||
"resolved": "https://registry.npmjs.org/@types/d3-path/-/d3-path-3.1.1.tgz",
|
||||
"integrity": "sha512-VMZBYyQvbGmWyWVea0EHs/BwLgxc+MKi1zLDCONksozI4YJMcTt8ZEuIR4Sb1MMTE8MMW49v0IwI5+b7RmfWlg=="
|
||||
},
|
||||
"node_modules/@types/d3-scale": {
|
||||
"version": "4.0.9",
|
||||
"resolved": "https://registry.npmjs.org/@types/d3-scale/-/d3-scale-4.0.9.tgz",
|
||||
"integrity": "sha512-dLmtwB8zkAeO/juAMfnV+sItKjlsw2lKdZVVy6LRr0cBmegxSABiLEpGVmSJJ8O08i4+sGR6qQtb6WtuwJdvVw==",
|
||||
"dependencies": {
|
||||
"@types/d3-time": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/@types/d3-shape": {
|
||||
"version": "3.1.7",
|
||||
"resolved": "https://registry.npmjs.org/@types/d3-shape/-/d3-shape-3.1.7.tgz",
|
||||
"integrity": "sha512-VLvUQ33C+3J+8p+Daf+nYSOsjB4GXp19/S/aGo60m9h1v6XaxjiT82lKVWJCfzhtuZ3yD7i/TPeC/fuKLLOSmg==",
|
||||
"dependencies": {
|
||||
"@types/d3-path": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/@types/d3-time": {
|
||||
"version": "3.0.4",
|
||||
"resolved": "https://registry.npmjs.org/@types/d3-time/-/d3-time-3.0.4.tgz",
|
||||
"integrity": "sha512-yuzZug1nkAAaBlBBikKZTgzCeA+k1uy4ZFwWANOfKw5z5LRhV0gNA7gNkKm7HoK+HRN0wX3EkxGk0fpbWhmB7g=="
|
||||
},
|
||||
"node_modules/@types/d3-timer": {
|
||||
"version": "3.0.2",
|
||||
"resolved": "https://registry.npmjs.org/@types/d3-timer/-/d3-timer-3.0.2.tgz",
|
||||
"integrity": "sha512-Ps3T8E8dZDam6fUyNiMkekK3XUsaUEik+idO9/YjPtfj2qruF8tFBXS7XhtE4iIXBLxhmLjP3SXpLhVf21I9Lw=="
|
||||
},
|
||||
"node_modules/@types/estree": {
|
||||
"version": "1.0.6",
|
||||
"resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.6.tgz",
|
||||
|
|
@ -1749,6 +1815,14 @@
|
|||
"postcss": "^8.1.0"
|
||||
}
|
||||
},
|
||||
"node_modules/aws-ssl-profiles": {
|
||||
"version": "1.1.2",
|
||||
"resolved": "https://registry.npmjs.org/aws-ssl-profiles/-/aws-ssl-profiles-1.1.2.tgz",
|
||||
"integrity": "sha512-NZKeq9AfyQvEeNlN0zSYAaWrmBffJh3IELMZfRpJVWgrpEbtEpnjvzqBPf+mxoI287JohRDoa+/nsfqqiZmF6g==",
|
||||
"engines": {
|
||||
"node": ">= 6.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/balanced-match": {
|
||||
"version": "1.0.2",
|
||||
"resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
|
||||
|
|
@ -1909,6 +1983,14 @@
|
|||
"node": ">= 6"
|
||||
}
|
||||
},
|
||||
"node_modules/clsx": {
|
||||
"version": "2.1.1",
|
||||
"resolved": "https://registry.npmjs.org/clsx/-/clsx-2.1.1.tgz",
|
||||
"integrity": "sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA==",
|
||||
"engines": {
|
||||
"node": ">=6"
|
||||
}
|
||||
},
|
||||
"node_modules/color-convert": {
|
||||
"version": "1.9.3",
|
||||
"resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
|
||||
|
|
@ -1974,8 +2056,117 @@
|
|||
"node_modules/csstype": {
|
||||
"version": "3.1.3",
|
||||
"resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz",
|
||||
"integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==",
|
||||
"dev": true
|
||||
"integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw=="
|
||||
},
|
||||
"node_modules/d3-array": {
|
||||
"version": "3.2.4",
|
||||
"resolved": "https://registry.npmjs.org/d3-array/-/d3-array-3.2.4.tgz",
|
||||
"integrity": "sha512-tdQAmyA18i4J7wprpYq8ClcxZy3SC31QMeByyCFyRt7BVHdREQZ5lpzoe5mFEYZUWe+oq8HBvk9JjpibyEV4Jg==",
|
||||
"dependencies": {
|
||||
"internmap": "1 - 2"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=12"
|
||||
}
|
||||
},
|
||||
"node_modules/d3-color": {
|
||||
"version": "3.1.0",
|
||||
"resolved": "https://registry.npmjs.org/d3-color/-/d3-color-3.1.0.tgz",
|
||||
"integrity": "sha512-zg/chbXyeBtMQ1LbD/WSoW2DpC3I0mpmPdW+ynRTj/x2DAWYrIY7qeZIHidozwV24m4iavr15lNwIwLxRmOxhA==",
|
||||
"engines": {
|
||||
"node": ">=12"
|
||||
}
|
||||
},
|
||||
"node_modules/d3-ease": {
|
||||
"version": "3.0.1",
|
||||
"resolved": "https://registry.npmjs.org/d3-ease/-/d3-ease-3.0.1.tgz",
|
||||
"integrity": "sha512-wR/XK3D3XcLIZwpbvQwQ5fK+8Ykds1ip7A2Txe0yxncXSdq1L9skcG7blcedkOX+ZcgxGAmLX1FrRGbADwzi0w==",
|
||||
"engines": {
|
||||
"node": ">=12"
|
||||
}
|
||||
},
|
||||
"node_modules/d3-format": {
|
||||
"version": "3.1.0",
|
||||
"resolved": "https://registry.npmjs.org/d3-format/-/d3-format-3.1.0.tgz",
|
||||
"integrity": "sha512-YyUI6AEuY/Wpt8KWLgZHsIU86atmikuoOmCfommt0LYHiQSPjvX2AcFc38PX0CBpr2RCyZhjex+NS/LPOv6YqA==",
|
||||
"engines": {
|
||||
"node": ">=12"
|
||||
}
|
||||
},
|
||||
"node_modules/d3-interpolate": {
|
||||
"version": "3.0.1",
|
||||
"resolved": "https://registry.npmjs.org/d3-interpolate/-/d3-interpolate-3.0.1.tgz",
|
||||
"integrity": "sha512-3bYs1rOD33uo8aqJfKP3JWPAibgw8Zm2+L9vBKEHJ2Rg+viTR7o5Mmv5mZcieN+FRYaAOWX5SJATX6k1PWz72g==",
|
||||
"dependencies": {
|
||||
"d3-color": "1 - 3"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=12"
|
||||
}
|
||||
},
|
||||
"node_modules/d3-path": {
|
||||
"version": "3.1.0",
|
||||
"resolved": "https://registry.npmjs.org/d3-path/-/d3-path-3.1.0.tgz",
|
||||
"integrity": "sha512-p3KP5HCf/bvjBSSKuXid6Zqijx7wIfNW+J/maPs+iwR35at5JCbLUT0LzF1cnjbCHWhqzQTIN2Jpe8pRebIEFQ==",
|
||||
"engines": {
|
||||
"node": ">=12"
|
||||
}
|
||||
},
|
||||
"node_modules/d3-scale": {
|
||||
"version": "4.0.2",
|
||||
"resolved": "https://registry.npmjs.org/d3-scale/-/d3-scale-4.0.2.tgz",
|
||||
"integrity": "sha512-GZW464g1SH7ag3Y7hXjf8RoUuAFIqklOAq3MRl4OaWabTFJY9PN/E1YklhXLh+OQ3fM9yS2nOkCoS+WLZ6kvxQ==",
|
||||
"dependencies": {
|
||||
"d3-array": "2.10.0 - 3",
|
||||
"d3-format": "1 - 3",
|
||||
"d3-interpolate": "1.2.0 - 3",
|
||||
"d3-time": "2.1.1 - 3",
|
||||
"d3-time-format": "2 - 4"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=12"
|
||||
}
|
||||
},
|
||||
"node_modules/d3-shape": {
|
||||
"version": "3.2.0",
|
||||
"resolved": "https://registry.npmjs.org/d3-shape/-/d3-shape-3.2.0.tgz",
|
||||
"integrity": "sha512-SaLBuwGm3MOViRq2ABk3eLoxwZELpH6zhl3FbAoJ7Vm1gofKx6El1Ib5z23NUEhF9AsGl7y+dzLe5Cw2AArGTA==",
|
||||
"dependencies": {
|
||||
"d3-path": "^3.1.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=12"
|
||||
}
|
||||
},
|
||||
"node_modules/d3-time": {
|
||||
"version": "3.1.0",
|
||||
"resolved": "https://registry.npmjs.org/d3-time/-/d3-time-3.1.0.tgz",
|
||||
"integrity": "sha512-VqKjzBLejbSMT4IgbmVgDjpkYrNWUYJnbCGo874u7MMKIWsILRX+OpX/gTk8MqjpT1A/c6HY2dCA77ZN0lkQ2Q==",
|
||||
"dependencies": {
|
||||
"d3-array": "2 - 3"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=12"
|
||||
}
|
||||
},
|
||||
"node_modules/d3-time-format": {
|
||||
"version": "4.1.0",
|
||||
"resolved": "https://registry.npmjs.org/d3-time-format/-/d3-time-format-4.1.0.tgz",
|
||||
"integrity": "sha512-dJxPBlzC7NugB2PDLwo9Q8JiTR3M3e4/XANkreKSUxF8vvXKqm1Yfq4Q5dl8budlunRVlUUaDUgFt7eA8D6NLg==",
|
||||
"dependencies": {
|
||||
"d3-time": "1 - 3"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=12"
|
||||
}
|
||||
},
|
||||
"node_modules/d3-timer": {
|
||||
"version": "3.0.1",
|
||||
"resolved": "https://registry.npmjs.org/d3-timer/-/d3-timer-3.0.1.tgz",
|
||||
"integrity": "sha512-ndfJ/JxxMd3nw31uyKoY2naivF+r29V+Lc0svZxe1JvvIRmi8hUsrMvdOwgS1o6uBHmiz91geQ0ylPP0aj1VUA==",
|
||||
"engines": {
|
||||
"node": ">=12"
|
||||
}
|
||||
},
|
||||
"node_modules/debug": {
|
||||
"version": "4.3.7",
|
||||
|
|
@ -1994,12 +2185,25 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
"node_modules/decimal.js-light": {
|
||||
"version": "2.5.1",
|
||||
"resolved": "https://registry.npmjs.org/decimal.js-light/-/decimal.js-light-2.5.1.tgz",
|
||||
"integrity": "sha512-qIMFpTMZmny+MMIitAB6D7iVPEorVw6YQRWkvarTkT4tBeSLLiHzcwj6q0MmYSFCiVpiqPJTJEYIrpcPzVEIvg=="
|
||||
},
|
||||
"node_modules/deep-is": {
|
||||
"version": "0.1.4",
|
||||
"resolved": "https://registry.npmjs.org/deep-is/-/deep-is-0.1.4.tgz",
|
||||
"integrity": "sha512-oIPzksmTg4/MriiaYGO+okXDT7ztn/w3Eptv/+gSIdMdKsJo0u4CfYNFJPy+4SKMuCqGw2wxnA+URMg3t8a/bQ==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/denque": {
|
||||
"version": "2.1.0",
|
||||
"resolved": "https://registry.npmjs.org/denque/-/denque-2.1.0.tgz",
|
||||
"integrity": "sha512-HVQE3AAb/pxF8fQAoiqpvg9i3evqug3hoiwakOyZAwJm+6vZehbkYXZ0l4JxS+I3QxM97v5aaRNhj8v5oBhekw==",
|
||||
"engines": {
|
||||
"node": ">=0.10"
|
||||
}
|
||||
},
|
||||
"node_modules/didyoumean": {
|
||||
"version": "1.2.2",
|
||||
"resolved": "https://registry.npmjs.org/didyoumean/-/didyoumean-1.2.2.tgz",
|
||||
|
|
@ -2012,6 +2216,15 @@
|
|||
"integrity": "sha512-+HlytyjlPKnIG8XuRG8WvmBP8xs8P71y+SKKS6ZXWoEgLuePxtDoUEiH7WkdePWrQ5JBpE6aoVqfZfJUQkjXwA==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/dom-helpers": {
|
||||
"version": "5.2.1",
|
||||
"resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-5.2.1.tgz",
|
||||
"integrity": "sha512-nRCa7CK3VTrM2NmGkIy4cbK7IZlgBE/PYMn55rrXefr5xXDP0LdtfPnblFDoVdcAfslJ7or6iqAUnx0CCGIWQA==",
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.8.7",
|
||||
"csstype": "^3.0.2"
|
||||
}
|
||||
},
|
||||
"node_modules/eastasianwidth": {
|
||||
"version": "0.2.0",
|
||||
"resolved": "https://registry.npmjs.org/eastasianwidth/-/eastasianwidth-0.2.0.tgz",
|
||||
|
|
@ -2336,12 +2549,25 @@
|
|||
"node": ">=0.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/eventemitter3": {
|
||||
"version": "4.0.7",
|
||||
"resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-4.0.7.tgz",
|
||||
"integrity": "sha512-8guHBZCwKnFhYdHr2ysuRWErTwhoN2X8XELRlrRwpmfeY2jjuUN4taQMsULKUVo1K4DvZl+0pgfyoysHxvmvEw=="
|
||||
},
|
||||
"node_modules/fast-deep-equal": {
|
||||
"version": "3.1.3",
|
||||
"resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
|
||||
"integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/fast-equals": {
|
||||
"version": "5.2.2",
|
||||
"resolved": "https://registry.npmjs.org/fast-equals/-/fast-equals-5.2.2.tgz",
|
||||
"integrity": "sha512-V7/RktU11J3I36Nwq2JnZEM7tNm17eBJz+u25qdxBZeCKiX6BkVSZQjwWIr+IobgnZy+ag73tTZgZi7tr0LrBw==",
|
||||
"engines": {
|
||||
"node": ">=6.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/fast-glob": {
|
||||
"version": "3.3.2",
|
||||
"resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.3.2.tgz",
|
||||
|
|
@ -2479,32 +2705,6 @@
|
|||
"url": "https://github.com/sponsors/rawify"
|
||||
}
|
||||
},
|
||||
"node_modules/framer-motion": {
|
||||
"version": "11.18.2",
|
||||
"resolved": "https://registry.npmjs.org/framer-motion/-/framer-motion-11.18.2.tgz",
|
||||
"integrity": "sha512-5F5Och7wrvtLVElIpclDT0CBzMVg3dL22B64aZwHtsIY8RB4mXICLrkajK4G9R+ieSAGcgrLeae2SeUTg2pr6w==",
|
||||
"dependencies": {
|
||||
"motion-dom": "^11.18.1",
|
||||
"motion-utils": "^11.18.1",
|
||||
"tslib": "^2.4.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@emotion/is-prop-valid": "*",
|
||||
"react": "^18.0.0 || ^19.0.0",
|
||||
"react-dom": "^18.0.0 || ^19.0.0"
|
||||
},
|
||||
"peerDependenciesMeta": {
|
||||
"@emotion/is-prop-valid": {
|
||||
"optional": true
|
||||
},
|
||||
"react": {
|
||||
"optional": true
|
||||
},
|
||||
"react-dom": {
|
||||
"optional": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/fsevents": {
|
||||
"version": "2.3.3",
|
||||
"resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
|
||||
|
|
@ -2528,6 +2728,14 @@
|
|||
"url": "https://github.com/sponsors/ljharb"
|
||||
}
|
||||
},
|
||||
"node_modules/generate-function": {
|
||||
"version": "2.3.1",
|
||||
"resolved": "https://registry.npmjs.org/generate-function/-/generate-function-2.3.1.tgz",
|
||||
"integrity": "sha512-eeB5GfMNeevm/GRYq20ShmsaGcmI81kIX2K9XQx5miC8KdHaC6Jm0qQ8ZNeGOi7wYB8OsdxKs+Y2oVuTFuVwKQ==",
|
||||
"dependencies": {
|
||||
"is-property": "^1.0.2"
|
||||
}
|
||||
},
|
||||
"node_modules/gensync": {
|
||||
"version": "1.0.0-beta.2",
|
||||
"resolved": "https://registry.npmjs.org/gensync/-/gensync-1.0.0-beta.2.tgz",
|
||||
|
|
@ -2632,6 +2840,17 @@
|
|||
"node": ">= 0.4"
|
||||
}
|
||||
},
|
||||
"node_modules/iconv-lite": {
|
||||
"version": "0.6.3",
|
||||
"resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.3.tgz",
|
||||
"integrity": "sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==",
|
||||
"dependencies": {
|
||||
"safer-buffer": ">= 2.1.2 < 3.0.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=0.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/ignore": {
|
||||
"version": "5.3.2",
|
||||
"resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.2.tgz",
|
||||
|
|
@ -2666,6 +2885,14 @@
|
|||
"node": ">=0.8.19"
|
||||
}
|
||||
},
|
||||
"node_modules/internmap": {
|
||||
"version": "2.0.3",
|
||||
"resolved": "https://registry.npmjs.org/internmap/-/internmap-2.0.3.tgz",
|
||||
"integrity": "sha512-5Hh7Y1wQbvY5ooGgPbDaL5iYLAPzMTUrjMulskHLH6wnv/A+1q5rgEaiuqEjB+oxGXIVZs1FF+R/KPN3ZSQYYg==",
|
||||
"engines": {
|
||||
"node": ">=12"
|
||||
}
|
||||
},
|
||||
"node_modules/is-binary-path": {
|
||||
"version": "2.1.0",
|
||||
"resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz",
|
||||
|
|
@ -2732,6 +2959,11 @@
|
|||
"node": ">=0.12.0"
|
||||
}
|
||||
},
|
||||
"node_modules/is-property": {
|
||||
"version": "1.0.2",
|
||||
"resolved": "https://registry.npmjs.org/is-property/-/is-property-1.0.2.tgz",
|
||||
"integrity": "sha512-Ks/IoX00TtClbGQr4TWXemAnktAQvYB7HzcCxDGqEZU6oCmb2INHuOoKxbtR+HFkmYWBKv/dOZtGRiAjDhj92g=="
|
||||
},
|
||||
"node_modules/isexe": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
|
||||
|
|
@ -2873,12 +3105,22 @@
|
|||
"url": "https://github.com/sponsors/sindresorhus"
|
||||
}
|
||||
},
|
||||
"node_modules/lodash": {
|
||||
"version": "4.17.21",
|
||||
"resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
|
||||
"integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
|
||||
},
|
||||
"node_modules/lodash.merge": {
|
||||
"version": "4.6.2",
|
||||
"resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.2.tgz",
|
||||
"integrity": "sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/long": {
|
||||
"version": "5.3.1",
|
||||
"resolved": "https://registry.npmjs.org/long/-/long-5.3.1.tgz",
|
||||
"integrity": "sha512-ka87Jz3gcx/I7Hal94xaN2tZEOPoUOEVftkQqZx2EeQRN7LGdfLlI3FvZ+7WDplm+vK2Urx9ULrvSowtdCieng=="
|
||||
},
|
||||
"node_modules/loose-envify": {
|
||||
"version": "1.4.0",
|
||||
"resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz",
|
||||
|
|
@ -2899,6 +3141,20 @@
|
|||
"yallist": "^3.0.2"
|
||||
}
|
||||
},
|
||||
"node_modules/lru.min": {
|
||||
"version": "1.1.2",
|
||||
"resolved": "https://registry.npmjs.org/lru.min/-/lru.min-1.1.2.tgz",
|
||||
"integrity": "sha512-Nv9KddBcQSlQopmBHXSsZVY5xsdlZkdH/Iey0BlcBYggMd4two7cZnKOK9vmy3nY0O5RGH99z1PCeTpPqszUYg==",
|
||||
"engines": {
|
||||
"bun": ">=1.0.0",
|
||||
"deno": ">=1.30.0",
|
||||
"node": ">=8.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "github",
|
||||
"url": "https://github.com/sponsors/wellwelwel"
|
||||
}
|
||||
},
|
||||
"node_modules/lucide-react": {
|
||||
"version": "0.344.0",
|
||||
"resolved": "https://registry.npmjs.org/lucide-react/-/lucide-react-0.344.0.tgz",
|
||||
|
|
@ -2950,25 +3206,31 @@
|
|||
"node": ">=16 || 14 >=14.17"
|
||||
}
|
||||
},
|
||||
"node_modules/motion-dom": {
|
||||
"version": "11.18.1",
|
||||
"resolved": "https://registry.npmjs.org/motion-dom/-/motion-dom-11.18.1.tgz",
|
||||
"integrity": "sha512-g76KvA001z+atjfxczdRtw/RXOM3OMSdd1f4DL77qCTF/+avrRJiawSG4yDibEQ215sr9kpinSlX2pCTJ9zbhw==",
|
||||
"dependencies": {
|
||||
"motion-utils": "^11.18.1"
|
||||
}
|
||||
},
|
||||
"node_modules/motion-utils": {
|
||||
"version": "11.18.1",
|
||||
"resolved": "https://registry.npmjs.org/motion-utils/-/motion-utils-11.18.1.tgz",
|
||||
"integrity": "sha512-49Kt+HKjtbJKLtgO/LKj9Ld+6vw9BjH5d9sc40R/kVyH8GLAXgT42M2NnuPcJNuA3s9ZfZBUcwIgpmZWGEE+hA=="
|
||||
},
|
||||
"node_modules/ms": {
|
||||
"version": "2.1.3",
|
||||
"resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz",
|
||||
"integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/mysql2": {
|
||||
"version": "3.13.0",
|
||||
"resolved": "https://registry.npmjs.org/mysql2/-/mysql2-3.13.0.tgz",
|
||||
"integrity": "sha512-M6DIQjTqKeqXH5HLbLMxwcK5XfXHw30u5ap6EZmu7QVmcF/gnh2wS/EOiQ4MTbXz/vQeoXrmycPlVRM00WSslg==",
|
||||
"dependencies": {
|
||||
"aws-ssl-profiles": "^1.1.1",
|
||||
"denque": "^2.1.0",
|
||||
"generate-function": "^2.3.1",
|
||||
"iconv-lite": "^0.6.3",
|
||||
"long": "^5.2.1",
|
||||
"lru.min": "^1.0.0",
|
||||
"named-placeholders": "^1.1.3",
|
||||
"seq-queue": "^0.0.5",
|
||||
"sqlstring": "^2.3.2"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">= 8.0"
|
||||
}
|
||||
},
|
||||
"node_modules/mz": {
|
||||
"version": "2.7.0",
|
||||
"resolved": "https://registry.npmjs.org/mz/-/mz-2.7.0.tgz",
|
||||
|
|
@ -2980,6 +3242,25 @@
|
|||
"thenify-all": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/named-placeholders": {
|
||||
"version": "1.1.3",
|
||||
"resolved": "https://registry.npmjs.org/named-placeholders/-/named-placeholders-1.1.3.tgz",
|
||||
"integrity": "sha512-eLoBxg6wE/rZkJPhU/xRX1WTpkFEwDJEN96oxFrTsqBdbT5ec295Q+CoHrL9IT0DipqKhmGcaZmwOt8OON5x1w==",
|
||||
"dependencies": {
|
||||
"lru-cache": "^7.14.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=12.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/named-placeholders/node_modules/lru-cache": {
|
||||
"version": "7.18.3",
|
||||
"resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-7.18.3.tgz",
|
||||
"integrity": "sha512-jumlc0BIUrS3qJGgIkWZsyfAM7NCWiBcCDhnd+3NNM5KbBmLTgHVfWBcg6W+rLUsIpzpERPsvwUP7CckAQSOoA==",
|
||||
"engines": {
|
||||
"node": ">=12"
|
||||
}
|
||||
},
|
||||
"node_modules/nanoid": {
|
||||
"version": "3.3.7",
|
||||
"resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.7.tgz",
|
||||
|
|
@ -3032,7 +3313,6 @@
|
|||
"version": "4.1.1",
|
||||
"resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
|
||||
"integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==",
|
||||
"dev": true,
|
||||
"engines": {
|
||||
"node": ">=0.10.0"
|
||||
}
|
||||
|
|
@ -3357,6 +3637,21 @@
|
|||
"node": ">= 0.8.0"
|
||||
}
|
||||
},
|
||||
"node_modules/prop-types": {
|
||||
"version": "15.8.1",
|
||||
"resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz",
|
||||
"integrity": "sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==",
|
||||
"dependencies": {
|
||||
"loose-envify": "^1.4.0",
|
||||
"object-assign": "^4.1.1",
|
||||
"react-is": "^16.13.1"
|
||||
}
|
||||
},
|
||||
"node_modules/prop-types/node_modules/react-is": {
|
||||
"version": "16.13.1",
|
||||
"resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
|
||||
"integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ=="
|
||||
},
|
||||
"node_modules/punycode": {
|
||||
"version": "2.3.1",
|
||||
"resolved": "https://registry.npmjs.org/punycode/-/punycode-2.3.1.tgz",
|
||||
|
|
@ -3409,6 +3704,11 @@
|
|||
"react": "^18.3.1"
|
||||
}
|
||||
},
|
||||
"node_modules/react-is": {
|
||||
"version": "18.3.1",
|
||||
"resolved": "https://registry.npmjs.org/react-is/-/react-is-18.3.1.tgz",
|
||||
"integrity": "sha512-/LLMVyas0ljjAtoYiPqYiL8VWXzUUdThrmU5+n20DZv+a+ClRoevUzw5JxU+Ieh5/c87ytoTBV9G1FiKfNJdmg=="
|
||||
},
|
||||
"node_modules/react-refresh": {
|
||||
"version": "0.14.2",
|
||||
"resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.14.2.tgz",
|
||||
|
|
@ -3418,6 +3718,35 @@
|
|||
"node": ">=0.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/react-smooth": {
|
||||
"version": "4.0.4",
|
||||
"resolved": "https://registry.npmjs.org/react-smooth/-/react-smooth-4.0.4.tgz",
|
||||
"integrity": "sha512-gnGKTpYwqL0Iii09gHobNolvX4Kiq4PKx6eWBCYYix+8cdw+cGo3do906l1NBPKkSWx1DghC1dlWG9L2uGd61Q==",
|
||||
"dependencies": {
|
||||
"fast-equals": "^5.0.1",
|
||||
"prop-types": "^15.8.1",
|
||||
"react-transition-group": "^4.4.5"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
|
||||
"react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/react-transition-group": {
|
||||
"version": "4.4.5",
|
||||
"resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.5.tgz",
|
||||
"integrity": "sha512-pZcd1MCJoiKiBR2NRxeCRg13uCXbydPnmB4EOeRrY7480qNWO8IIgQG6zlDkm6uRMsURXPuKq0GWtiM59a5Q6g==",
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.5.5",
|
||||
"dom-helpers": "^5.0.1",
|
||||
"loose-envify": "^1.4.0",
|
||||
"prop-types": "^15.6.2"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": ">=16.6.0",
|
||||
"react-dom": ">=16.6.0"
|
||||
}
|
||||
},
|
||||
"node_modules/read-cache": {
|
||||
"version": "1.0.0",
|
||||
"resolved": "https://registry.npmjs.org/read-cache/-/read-cache-1.0.0.tgz",
|
||||
|
|
@ -3439,6 +3768,41 @@
|
|||
"node": ">=8.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/recharts": {
|
||||
"version": "2.15.1",
|
||||
"resolved": "https://registry.npmjs.org/recharts/-/recharts-2.15.1.tgz",
|
||||
"integrity": "sha512-v8PUTUlyiDe56qUj82w/EDVuzEFXwEHp9/xOowGAZwfLjB9uAy3GllQVIYMWF6nU+qibx85WF75zD7AjqoT54Q==",
|
||||
"dependencies": {
|
||||
"clsx": "^2.0.0",
|
||||
"eventemitter3": "^4.0.1",
|
||||
"lodash": "^4.17.21",
|
||||
"react-is": "^18.3.1",
|
||||
"react-smooth": "^4.0.4",
|
||||
"recharts-scale": "^0.4.4",
|
||||
"tiny-invariant": "^1.3.1",
|
||||
"victory-vendor": "^36.6.8"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=14"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": "^16.0.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
|
||||
"react-dom": "^16.0.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/recharts-scale": {
|
||||
"version": "0.4.5",
|
||||
"resolved": "https://registry.npmjs.org/recharts-scale/-/recharts-scale-0.4.5.tgz",
|
||||
"integrity": "sha512-kivNFO+0OcUNu7jQquLXAxz1FIwZj8nrj+YkOKc5694NbjCvcT6aSZiIzNzd2Kul4o4rTto8QVR9lMNtxD4G1w==",
|
||||
"dependencies": {
|
||||
"decimal.js-light": "^2.4.1"
|
||||
}
|
||||
},
|
||||
"node_modules/regenerator-runtime": {
|
||||
"version": "0.14.1",
|
||||
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.14.1.tgz",
|
||||
"integrity": "sha512-dYnhHh0nJoMfnkZs6GmmhFknAGRrLznOu5nc9ML+EJxGvrx6H7teuevqVqCuPcPK//3eDrrjQhehXVx9cnkGdw=="
|
||||
},
|
||||
"node_modules/resolve": {
|
||||
"version": "1.22.8",
|
||||
"resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.8.tgz",
|
||||
|
|
@ -3533,6 +3897,11 @@
|
|||
"queue-microtask": "^1.2.2"
|
||||
}
|
||||
},
|
||||
"node_modules/safer-buffer": {
|
||||
"version": "2.1.2",
|
||||
"resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz",
|
||||
"integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg=="
|
||||
},
|
||||
"node_modules/scheduler": {
|
||||
"version": "0.23.2",
|
||||
"resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.23.2.tgz",
|
||||
|
|
@ -3550,6 +3919,11 @@
|
|||
"semver": "bin/semver.js"
|
||||
}
|
||||
},
|
||||
"node_modules/seq-queue": {
|
||||
"version": "0.0.5",
|
||||
"resolved": "https://registry.npmjs.org/seq-queue/-/seq-queue-0.0.5.tgz",
|
||||
"integrity": "sha512-hr3Wtp/GZIc/6DAGPDcV4/9WoZhjrkXsi5B/07QgX8tsdc6ilr7BFM6PM6rbdAX1kFSDYeZGLipIZZKyQP0O5Q=="
|
||||
},
|
||||
"node_modules/shebang-command": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz",
|
||||
|
|
@ -3592,6 +3966,14 @@
|
|||
"node": ">=0.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/sqlstring": {
|
||||
"version": "2.3.3",
|
||||
"resolved": "https://registry.npmjs.org/sqlstring/-/sqlstring-2.3.3.tgz",
|
||||
"integrity": "sha512-qC9iz2FlN7DQl3+wjwn3802RTyjCx7sDvfQEXchwa6CWOx07/WVfh91gBmQ9fahw8snwGEWU3xGzOt4tFyHLxg==",
|
||||
"engines": {
|
||||
"node": ">= 0.6"
|
||||
}
|
||||
},
|
||||
"node_modules/string-width": {
|
||||
"version": "5.1.2",
|
||||
"resolved": "https://registry.npmjs.org/string-width/-/string-width-5.1.2.tgz",
|
||||
|
|
@ -3810,6 +4192,11 @@
|
|||
"node": ">=0.8"
|
||||
}
|
||||
},
|
||||
"node_modules/tiny-invariant": {
|
||||
"version": "1.3.3",
|
||||
"resolved": "https://registry.npmjs.org/tiny-invariant/-/tiny-invariant-1.3.3.tgz",
|
||||
"integrity": "sha512-+FbBPE1o9QAYvviau/qC5SE3caw21q3xkvWKBtja5vgqOWIHHJ3ioaq1VPfn/Szqctz2bU/oYeKd9/z5BL+PVg=="
|
||||
},
|
||||
"node_modules/to-fast-properties": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/to-fast-properties/-/to-fast-properties-2.0.0.tgz",
|
||||
|
|
@ -3854,11 +4241,6 @@
|
|||
"integrity": "sha512-Y/arvbn+rrz3JCKl9C4kVNfTfSm2/mEp5FSz5EsZSANGPSlQrpRI5M4PKF+mJnE52jOO90PnPSc3Ur3bTQw0gA==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/tslib": {
|
||||
"version": "2.8.1",
|
||||
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz",
|
||||
"integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w=="
|
||||
},
|
||||
"node_modules/type-check": {
|
||||
"version": "0.4.0",
|
||||
"resolved": "https://registry.npmjs.org/type-check/-/type-check-0.4.0.tgz",
|
||||
|
|
@ -3957,6 +4339,27 @@
|
|||
"integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/victory-vendor": {
|
||||
"version": "36.9.2",
|
||||
"resolved": "https://registry.npmjs.org/victory-vendor/-/victory-vendor-36.9.2.tgz",
|
||||
"integrity": "sha512-PnpQQMuxlwYdocC8fIJqVXvkeViHYzotI+NJrCuav0ZYFoq912ZHBk3mCeuj+5/VpodOjPe1z0Fk2ihgzlXqjQ==",
|
||||
"dependencies": {
|
||||
"@types/d3-array": "^3.0.3",
|
||||
"@types/d3-ease": "^3.0.0",
|
||||
"@types/d3-interpolate": "^3.0.1",
|
||||
"@types/d3-scale": "^4.0.2",
|
||||
"@types/d3-shape": "^3.1.0",
|
||||
"@types/d3-time": "^3.0.0",
|
||||
"@types/d3-timer": "^3.0.0",
|
||||
"d3-array": "^3.1.6",
|
||||
"d3-ease": "^3.0.1",
|
||||
"d3-interpolate": "^3.0.1",
|
||||
"d3-scale": "^4.0.2",
|
||||
"d3-shape": "^3.1.0",
|
||||
"d3-time": "^3.0.0",
|
||||
"d3-timer": "^3.0.1"
|
||||
}
|
||||
},
|
||||
"node_modules/vite": {
|
||||
"version": "5.4.8",
|
||||
"resolved": "https://registry.npmjs.org/vite/-/vite-5.4.8.tgz",
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
{
|
||||
"name": "vite-react-typescript-starter",
|
||||
"name": "proxmox-dashboard",
|
||||
"private": true,
|
||||
"version": "0.0.0",
|
||||
"type": "module",
|
||||
|
|
@ -12,9 +12,10 @@
|
|||
"dependencies": {
|
||||
"@supabase/supabase-js": "^2.39.7",
|
||||
"lucide-react": "^0.344.0",
|
||||
"mysql2": "^3.9.2",
|
||||
"react": "^18.3.1",
|
||||
"react-dom": "^18.3.1",
|
||||
"framer-motion": "^11.0.8"
|
||||
"recharts": "^2.12.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@eslint/js": "^9.9.1",
|
||||
|
|
|
|||
433
src/App.tsx
433
src/App.tsx
|
|
@ -1,388 +1,79 @@
|
|||
import React, { useState, useEffect } from 'react';
|
||||
import { Plus, ExternalLink, Trash2, Activity } from 'lucide-react';
|
||||
import { motion, AnimatePresence } from 'framer-motion';
|
||||
import { supabase } from './supabase';
|
||||
|
||||
// Custom Proxmox Logo SVG component
|
||||
const ProxmoxLogo = ({ className }: { className?: string }) => (
|
||||
<svg
|
||||
viewBox="0 0 24 24"
|
||||
className={className}
|
||||
fill="#E06B6C"
|
||||
stroke="#E06B6C"
|
||||
strokeWidth="0"
|
||||
>
|
||||
<path d="M21.47 4.35l.708-.708a1 1 0 0 0-.708-.708l-.708.708a1 1 0 0 0 .708.708zm.867 13.04a4.98 4.98 0 0 1-1.414 3.536l-1.829-1.829a4.92 4.92 0 0 1-3.364 1.364l-2.121 2.121a4.98 4.98 0 0 1-3.536 1.414 4.98 4.98 0 0 1-3.536-1.414l2.121-2.121a4.92 4.92 0 0 1-1.364-3.364l-1.829-1.829a4.98 4.98 0 0 1-1.414-3.536 4.98 4.98 0 0 1 1.414-3.536l2.121 2.121a4.92 4.92 0 0 1 3.364-1.364l1.829-1.829a4.98 4.98 0 0 1 3.536-1.414 4.98 4.98 0 0 1 3.536 1.414l-2.121 2.121a4.92 4.92 0 0 1 1.364 3.364l1.829 1.829a4.98 4.98 0 0 1 1.414 3.536z" />
|
||||
</svg>
|
||||
);
|
||||
|
||||
interface ServerSpecs {
|
||||
cpu: string;
|
||||
ram: string;
|
||||
gpu: string;
|
||||
type: string;
|
||||
}
|
||||
|
||||
interface ProxmoxServer {
|
||||
id: string;
|
||||
name: string;
|
||||
url: string;
|
||||
status: 'online' | 'offline' | 'checking';
|
||||
specs: ServerSpecs;
|
||||
lastPing?: number;
|
||||
}
|
||||
import React, { useEffect, useState } from 'react';
|
||||
import { PlusCircle } from 'lucide-react';
|
||||
import { AddServerModal } from './components/AddServerModal';
|
||||
import { ServerCard } from './components/ServerCard';
|
||||
import { Server, ServerMetrics } from './types';
|
||||
import { supabase } from './lib/supabase';
|
||||
|
||||
function App() {
|
||||
const [servers, setServers] = useState<ProxmoxServer[]>([]);
|
||||
const [isModalOpen, setIsModalOpen] = useState(false);
|
||||
const [newServer, setNewServer] = useState({
|
||||
name: '',
|
||||
url: '',
|
||||
specs: {
|
||||
cpu: '',
|
||||
ram: '',
|
||||
gpu: '',
|
||||
type: ''
|
||||
}
|
||||
});
|
||||
const [servers, setServers] = useState<Server[]>([]);
|
||||
const [showAddModal, setShowAddModal] = useState(false);
|
||||
const [metrics, setMetrics] = useState<Record<string, ServerMetrics[]>>({});
|
||||
|
||||
// Load servers from Supabase
|
||||
useEffect(() => {
|
||||
const loadServers = async () => {
|
||||
const { data, error } = await supabase
|
||||
.from('servers')
|
||||
.select('*');
|
||||
|
||||
if (error) {
|
||||
console.error('Error loading servers:', error);
|
||||
return;
|
||||
}
|
||||
|
||||
setServers(data.map(server => ({
|
||||
...server,
|
||||
specs: server.specs,
|
||||
lastPing: server.last_ping
|
||||
})));
|
||||
};
|
||||
|
||||
loadServers();
|
||||
fetchServers();
|
||||
}, []);
|
||||
|
||||
const pingServer = async (server: ProxmoxServer) => {
|
||||
setServers(current =>
|
||||
current.map(s =>
|
||||
s.id === server.id ? { ...s, status: 'checking' } : s
|
||||
)
|
||||
);
|
||||
|
||||
try {
|
||||
const startTime = Date.now();
|
||||
const response = await fetch(server.url, { mode: 'no-cors' });
|
||||
const endTime = Date.now();
|
||||
const pingTime = endTime - startTime;
|
||||
|
||||
// Update server status in Supabase
|
||||
await supabase
|
||||
.from('servers')
|
||||
.update({
|
||||
status: 'online',
|
||||
last_ping: pingTime
|
||||
})
|
||||
.eq('id', server.id);
|
||||
|
||||
setServers(current =>
|
||||
current.map(s =>
|
||||
s.id === server.id
|
||||
? { ...s, status: 'online', lastPing: pingTime }
|
||||
: s
|
||||
)
|
||||
);
|
||||
} catch (error) {
|
||||
// Update server status in Supabase
|
||||
await supabase
|
||||
.from('servers')
|
||||
.update({
|
||||
status: 'offline',
|
||||
last_ping: null
|
||||
})
|
||||
.eq('id', server.id);
|
||||
|
||||
setServers(current =>
|
||||
current.map(s =>
|
||||
s.id === server.id ? { ...s, status: 'offline' } : s
|
||||
)
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
const addServer = async () => {
|
||||
if (newServer.name && newServer.url) {
|
||||
const { data: serverData, error } = await supabase
|
||||
.from('servers')
|
||||
.insert([{
|
||||
name: newServer.name,
|
||||
url: newServer.url,
|
||||
specs: newServer.specs,
|
||||
status: 'checking'
|
||||
}])
|
||||
.select()
|
||||
.single();
|
||||
|
||||
if (error) {
|
||||
console.error('Error adding server:', error);
|
||||
return;
|
||||
}
|
||||
|
||||
const server: ProxmoxServer = {
|
||||
...serverData,
|
||||
specs: serverData.specs,
|
||||
lastPing: serverData.last_ping
|
||||
};
|
||||
|
||||
setServers([...servers, server]);
|
||||
setNewServer({
|
||||
name: '',
|
||||
url: '',
|
||||
specs: { cpu: '', ram: '', gpu: '', type: '' }
|
||||
});
|
||||
setIsModalOpen(false);
|
||||
pingServer(server);
|
||||
}
|
||||
};
|
||||
|
||||
const deleteServer = async (id: string) => {
|
||||
const { error } = await supabase
|
||||
const fetchServers = async () => {
|
||||
const { data } = await supabase
|
||||
.from('servers')
|
||||
.delete()
|
||||
.eq('id', id);
|
||||
|
||||
if (error) {
|
||||
console.error('Error deleting server:', error);
|
||||
return;
|
||||
.select('*')
|
||||
.order('created_at', { ascending: true });
|
||||
|
||||
if (data) {
|
||||
setServers(data);
|
||||
data.forEach(server => {
|
||||
fetchMetrics(server);
|
||||
});
|
||||
}
|
||||
|
||||
setServers(servers.filter(server => server.id !== id));
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
const interval = setInterval(() => {
|
||||
servers.forEach(server => pingServer(server));
|
||||
}, 30000);
|
||||
|
||||
return () => clearInterval(interval);
|
||||
}, [servers]);
|
||||
const fetchMetrics = async (server: Server) => {
|
||||
// In a real implementation, this would fetch from InfluxDB
|
||||
// For demo purposes, we'll generate mock data
|
||||
const mockMetrics: ServerMetrics[] = Array.from({ length: 20 }).map((_, i) => ({
|
||||
cpu_usage: Math.random() * 100,
|
||||
ram_usage: Math.random() * 100,
|
||||
timestamp: new Date(Date.now() - (19 - i) * 60000).toISOString()
|
||||
}));
|
||||
|
||||
setMetrics(prev => ({
|
||||
...prev,
|
||||
[server.id]: mockMetrics
|
||||
}));
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="min-h-screen bg-gray-900 text-gray-100">
|
||||
{/* Header */}
|
||||
<header className="bg-gray-800 shadow-lg">
|
||||
<div className="container mx-auto px-6 py-4">
|
||||
<div className="flex items-center justify-between">
|
||||
<div className="flex items-center space-x-3">
|
||||
<ProxmoxLogo className="h-8 w-8" />
|
||||
<h1 className="text-2xl font-bold">Proxmox Dashboard</h1>
|
||||
</div>
|
||||
<button
|
||||
onClick={() => setIsModalOpen(true)}
|
||||
className="flex items-center space-x-2 bg-[#E06B6C] hover:bg-[#c85657] px-4 py-2 rounded-lg transition-colors duration-200"
|
||||
>
|
||||
<Plus className="h-5 w-5" />
|
||||
<span>Add Server</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
{/* Main Content */}
|
||||
<main className="container mx-auto px-6 py-8">
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
|
||||
<AnimatePresence>
|
||||
{servers.map(server => (
|
||||
<motion.div
|
||||
key={server.id}
|
||||
initial={{ opacity: 0, y: 20 }}
|
||||
animate={{ opacity: 1, y: 0 }}
|
||||
exit={{ opacity: 0, y: -20 }}
|
||||
className="relative group"
|
||||
>
|
||||
<div className="bg-gray-800 rounded-lg shadow-lg overflow-hidden hover:ring-2 hover:ring-[#E06B6C] transition-all duration-200">
|
||||
<div className="p-6">
|
||||
<div className="flex justify-between items-start">
|
||||
<div>
|
||||
<h2 className="text-xl font-semibold mb-2">{server.name}</h2>
|
||||
<p className="text-gray-400 text-sm">{server.url}</p>
|
||||
</div>
|
||||
<div className="flex space-x-2">
|
||||
<button
|
||||
onClick={() => pingServer(server)}
|
||||
className="p-2 hover:bg-gray-700 rounded-lg transition-colors duration-200"
|
||||
>
|
||||
<Activity className={`h-5 w-5 ${
|
||||
server.status === 'checking' ? 'animate-pulse text-yellow-400' :
|
||||
server.status === 'online' ? 'text-[#E06B6C]' : 'text-red-400'
|
||||
}`} />
|
||||
</button>
|
||||
<button
|
||||
onClick={() => window.open(server.url, '_blank')}
|
||||
className="p-2 hover:bg-gray-700 rounded-lg transition-colors duration-200"
|
||||
>
|
||||
<ExternalLink className="h-5 w-5 text-[#E06B6C]" />
|
||||
</button>
|
||||
<button
|
||||
onClick={() => deleteServer(server.id)}
|
||||
className="p-2 hover:bg-gray-700 rounded-lg transition-colors duration-200"
|
||||
>
|
||||
<Trash2 className="h-5 w-5 text-red-400" />
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div className="mt-4 flex items-center space-x-2">
|
||||
<span className={`inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium ${
|
||||
server.status === 'checking' ? 'bg-yellow-100 text-yellow-800' :
|
||||
server.status === 'online' ? 'bg-[#fde8e8] text-[#E06B6C]' : 'bg-red-100 text-red-800'
|
||||
}`}>
|
||||
{server.status}
|
||||
</span>
|
||||
{server.lastPing && server.status === 'online' && (
|
||||
<span className="text-xs text-gray-400">
|
||||
{server.lastPing}ms
|
||||
</span>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Specs Tooltip */}
|
||||
<motion.div
|
||||
initial={{ opacity: 0, scale: 0.95 }}
|
||||
animate={{ opacity: 1, scale: 1 }}
|
||||
className="absolute invisible group-hover:visible bottom-full left-1/2 -translate-x-1/2 mb-2
|
||||
bg-gray-700 rounded-lg shadow-lg p-4 w-64 z-10 transform origin-bottom pointer-events-none"
|
||||
>
|
||||
<div className="space-y-2">
|
||||
<p className="text-sm"><span className="font-semibold">CPU:</span> {server.specs.cpu}</p>
|
||||
<p className="text-sm"><span className="font-semibold">RAM:</span> {server.specs.ram}</p>
|
||||
<p className="text-sm"><span className="font-semibold">GPU:</span> {server.specs.gpu}</p>
|
||||
<p className="text-sm"><span className="font-semibold">Type:</span> {server.specs.type}</p>
|
||||
</div>
|
||||
<div className="absolute top-full left-1/2 -translate-x-1/2 -translate-y-1/2
|
||||
border-8 border-transparent border-t-gray-700" />
|
||||
</motion.div>
|
||||
</motion.div>
|
||||
))}
|
||||
</AnimatePresence>
|
||||
</div>
|
||||
|
||||
{/* Empty State */}
|
||||
{servers.length === 0 && (
|
||||
<div className="text-center py-16">
|
||||
<ProxmoxLogo className="h-16 w-16 mx-auto text-gray-600 mb-4" />
|
||||
<h3 className="text-xl font-medium text-gray-400">No servers added yet</h3>
|
||||
<p className="text-gray-500 mt-2">Click the Add Server button to get started</p>
|
||||
</div>
|
||||
)}
|
||||
</main>
|
||||
|
||||
{/* Add Server Modal */}
|
||||
{isModalOpen && (
|
||||
<div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center p-4">
|
||||
<motion.div
|
||||
initial={{ opacity: 0, scale: 0.95 }}
|
||||
animate={{ opacity: 1, scale: 1 }}
|
||||
className="bg-gray-800 rounded-lg p-6 w-full max-w-md"
|
||||
<div className="min-h-screen bg-gray-900 text-white p-8">
|
||||
<div className="max-w-7xl mx-auto">
|
||||
<div className="flex justify-between items-center mb-8">
|
||||
<h1 className="text-3xl font-bold">Proxmox Dashboard</h1>
|
||||
<button
|
||||
onClick={() => setShowAddModal(true)}
|
||||
className="flex items-center space-x-2 bg-blue-600 px-4 py-2 rounded-lg hover:bg-blue-700 transition-colors"
|
||||
>
|
||||
<h2 className="text-xl font-bold mb-4">Add New Server</h2>
|
||||
<div className="space-y-4">
|
||||
<div>
|
||||
<label className="block text-sm font-medium mb-1">Server Name</label>
|
||||
<input
|
||||
type="text"
|
||||
value={newServer.name}
|
||||
onChange={(e) => setNewServer({ ...newServer, name: e.target.value })}
|
||||
className="w-full bg-gray-700 rounded-lg px-4 py-2 focus:outline-none focus:ring-2 focus:ring-[#E06B6C]"
|
||||
placeholder="My Proxmox Server"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label className="block text-sm font-medium mb-1">Server URL</label>
|
||||
<input
|
||||
type="text"
|
||||
value={newServer.url}
|
||||
onChange={(e) => setNewServer({ ...newServer, url: e.target.value })}
|
||||
className="w-full bg-gray-700 rounded-lg px-4 py-2 focus:outline-none focus:ring-2 focus:ring-[#E06B6C]"
|
||||
placeholder="https://proxmox.example.com:8006"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label className="block text-sm font-medium mb-1">CPU</label>
|
||||
<input
|
||||
type="text"
|
||||
value={newServer.specs.cpu}
|
||||
onChange={(e) => setNewServer({
|
||||
...newServer,
|
||||
specs: { ...newServer.specs, cpu: e.target.value }
|
||||
})}
|
||||
className="w-full bg-gray-700 rounded-lg px-4 py-2 focus:outline-none focus:ring-2 focus:ring-[#E06B6C]"
|
||||
placeholder="Intel Xeon E5-2680 v4"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label className="block text-sm font-medium mb-1">RAM</label>
|
||||
<input
|
||||
type="text"
|
||||
value={newServer.specs.ram}
|
||||
onChange={(e) => setNewServer({
|
||||
...newServer,
|
||||
specs: { ...newServer.specs, ram: e.target.value }
|
||||
})}
|
||||
className="w-full bg-gray-700 rounded-lg px-4 py-2 focus:outline-none focus:ring-2 focus:ring-[#E06B6C]"
|
||||
placeholder="64GB DDR4"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label className="block text-sm font-medium mb-1">GPU</label>
|
||||
<input
|
||||
type="text"
|
||||
value={newServer.specs.gpu}
|
||||
onChange={(e) => setNewServer({
|
||||
...newServer,
|
||||
specs: { ...newServer.specs, gpu: e.target.value }
|
||||
})}
|
||||
className="w-full bg-gray-700 rounded-lg px-4 py-2 focus:outline-none focus:ring-2 focus:ring-[#E06B6C]"
|
||||
placeholder="NVIDIA RTX 3080"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label className="block text-sm font-medium mb-1">Server Type</label>
|
||||
<input
|
||||
type="text"
|
||||
value={newServer.specs.type}
|
||||
onChange={(e) => setNewServer({
|
||||
...newServer,
|
||||
specs: { ...newServer.specs, type: e.target.value }
|
||||
})}
|
||||
className="w-full bg-gray-700 rounded-lg px-4 py-2 focus:outline-none focus:ring-2 focus:ring-[#E06B6C]"
|
||||
placeholder="Dell R730"
|
||||
/>
|
||||
</div>
|
||||
<div className="flex space-x-3 mt-6">
|
||||
<button
|
||||
onClick={addServer}
|
||||
className="flex-1 bg-[#E06B6C] hover:bg-[#c85657] px-4 py-2 rounded-lg transition-colors duration-200"
|
||||
>
|
||||
Add Server
|
||||
</button>
|
||||
<button
|
||||
onClick={() => setIsModalOpen(false)}
|
||||
className="flex-1 bg-gray-700 hover:bg-gray-600 px-4 py-2 rounded-lg transition-colors duration-200"
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</motion.div>
|
||||
<PlusCircle size={20} />
|
||||
<span>Add Server</span>
|
||||
</button>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
|
||||
{servers.map(server => (
|
||||
<ServerCard
|
||||
key={server.id}
|
||||
server={server}
|
||||
metrics={metrics[server.id] || []}
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
|
||||
{showAddModal && (
|
||||
<AddServerModal
|
||||
onClose={() => setShowAddModal(false)}
|
||||
onServerAdded={fetchServers}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
135
src/components/AddServerModal.tsx
Normal file
135
src/components/AddServerModal.tsx
Normal file
|
|
@ -0,0 +1,135 @@
|
|||
import React, { useState } from 'react';
|
||||
import { X } from 'lucide-react';
|
||||
import { supabase } from '../lib/supabase';
|
||||
|
||||
interface AddServerModalProps {
|
||||
onClose: () => void;
|
||||
onServerAdded: () => void;
|
||||
}
|
||||
|
||||
export function AddServerModal({ onClose, onServerAdded }: AddServerModalProps) {
|
||||
const [formData, setFormData] = useState({
|
||||
name: '',
|
||||
model: '',
|
||||
cpu_model: '',
|
||||
ram_gb: '',
|
||||
influx_org: '',
|
||||
influx_token: '',
|
||||
influx_url: ''
|
||||
});
|
||||
|
||||
const handleSubmit = async (e: React.FormEvent) => {
|
||||
e.preventDefault();
|
||||
|
||||
const { error } = await supabase.from('servers').insert([{
|
||||
...formData,
|
||||
ram_gb: parseInt(formData.ram_gb)
|
||||
}]);
|
||||
|
||||
if (!error) {
|
||||
onServerAdded();
|
||||
onClose();
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center">
|
||||
<div className="bg-gray-800 p-6 rounded-lg w-full max-w-md">
|
||||
<div className="flex justify-between items-center mb-4">
|
||||
<h2 className="text-xl font-semibold text-white">Add New Server</h2>
|
||||
<button onClick={onClose} className="text-gray-400 hover:text-white">
|
||||
<X size={24} />
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<form onSubmit={handleSubmit} className="space-y-4">
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-300">Server Name</label>
|
||||
<input
|
||||
type="text"
|
||||
className="mt-1 block w-full rounded-md bg-gray-700 border-gray-600 text-white"
|
||||
value={formData.name}
|
||||
onChange={(e) => setFormData({ ...formData, name: e.target.value })}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-300">Server Model</label>
|
||||
<input
|
||||
type="text"
|
||||
placeholder="e.g. Dell R730"
|
||||
className="mt-1 block w-full rounded-md bg-gray-700 border-gray-600 text-white"
|
||||
value={formData.model}
|
||||
onChange={(e) => setFormData({ ...formData, model: e.target.value })}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-300">CPU Model</label>
|
||||
<input
|
||||
type="text"
|
||||
placeholder="e.g. Intel Xeon E5-2680 v3"
|
||||
className="mt-1 block w-full rounded-md bg-gray-700 border-gray-600 text-white"
|
||||
value={formData.cpu_model}
|
||||
onChange={(e) => setFormData({ ...formData, cpu_model: e.target.value })}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-300">RAM (GB)</label>
|
||||
<input
|
||||
type="number"
|
||||
className="mt-1 block w-full rounded-md bg-gray-700 border-gray-600 text-white"
|
||||
value={formData.ram_gb}
|
||||
onChange={(e) => setFormData({ ...formData, ram_gb: e.target.value })}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-300">InfluxDB Organization</label>
|
||||
<input
|
||||
type="text"
|
||||
className="mt-1 block w-full rounded-md bg-gray-700 border-gray-600 text-white"
|
||||
value={formData.influx_org}
|
||||
onChange={(e) => setFormData({ ...formData, influx_org: e.target.value })}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-300">InfluxDB Token</label>
|
||||
<input
|
||||
type="password"
|
||||
className="mt-1 block w-full rounded-md bg-gray-700 border-gray-600 text-white"
|
||||
value={formData.influx_token}
|
||||
onChange={(e) => setFormData({ ...formData, influx_token: e.target.value })}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-300">InfluxDB URL</label>
|
||||
<input
|
||||
type="url"
|
||||
className="mt-1 block w-full rounded-md bg-gray-700 border-gray-600 text-white"
|
||||
value={formData.influx_url}
|
||||
onChange={(e) => setFormData({ ...formData, influx_url: e.target.value })}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
|
||||
<button
|
||||
type="submit"
|
||||
className="w-full bg-blue-600 text-white rounded-md py-2 hover:bg-blue-700 transition-colors"
|
||||
>
|
||||
Add Server
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
80
src/components/ServerCard.tsx
Normal file
80
src/components/ServerCard.tsx
Normal file
|
|
@ -0,0 +1,80 @@
|
|||
import React from 'react';
|
||||
import { Server, ServerMetrics } from '../types';
|
||||
import { Cpu, MemoryStick as Memory, Server as ServerIcon } from 'lucide-react';
|
||||
import { LineChart, Line, XAxis, YAxis, Tooltip, ResponsiveContainer } from 'recharts';
|
||||
|
||||
interface ServerCardProps {
|
||||
server: Server;
|
||||
metrics: ServerMetrics[];
|
||||
}
|
||||
|
||||
export function ServerCard({ server, metrics }: ServerCardProps) {
|
||||
const lastMetric = metrics[metrics.length - 1] || { cpu_usage: 0, ram_usage: 0 };
|
||||
|
||||
return (
|
||||
<div className="bg-gray-800 rounded-lg p-6 shadow-lg">
|
||||
<div className="flex items-center justify-between mb-4">
|
||||
<div className="flex items-center space-x-3">
|
||||
<ServerIcon className="text-blue-500" size={24} />
|
||||
<h3 className="text-xl font-semibold text-white">{server.name}</h3>
|
||||
</div>
|
||||
<span className="text-gray-400 text-sm">{server.model}</span>
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-2 gap-4 mb-6">
|
||||
<div className="bg-gray-700 p-4 rounded-lg">
|
||||
<div className="flex items-center space-x-2 mb-2">
|
||||
<Cpu className="text-green-500" size={20} />
|
||||
<span className="text-gray-300">CPU</span>
|
||||
</div>
|
||||
<p className="text-white font-semibold">{server.cpu_model}</p>
|
||||
<p className="text-blue-400 mt-2">{lastMetric.cpu_usage.toFixed(1)}% Usage</p>
|
||||
</div>
|
||||
|
||||
<div className="bg-gray-700 p-4 rounded-lg">
|
||||
<div className="flex items-center space-x-2 mb-2">
|
||||
<Memory className="text-purple-500" size={20} />
|
||||
<span className="text-gray-300">Memory</span>
|
||||
</div>
|
||||
<p className="text-white font-semibold">{server.ram_gb} GB</p>
|
||||
<p className="text-blue-400 mt-2">{lastMetric.ram_usage.toFixed(1)}% Usage</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="h-40">
|
||||
<ResponsiveContainer width="100%" height="100%">
|
||||
<LineChart data={metrics}>
|
||||
<XAxis
|
||||
dataKey="timestamp"
|
||||
stroke="#4B5563"
|
||||
tickFormatter={(value) => new Date(value).toLocaleTimeString()}
|
||||
/>
|
||||
<YAxis stroke="#4B5563" />
|
||||
<Tooltip
|
||||
contentStyle={{
|
||||
backgroundColor: '#1F2937',
|
||||
border: 'none',
|
||||
borderRadius: '0.5rem',
|
||||
color: '#F3F4F6'
|
||||
}}
|
||||
/>
|
||||
<Line
|
||||
type="monotone"
|
||||
dataKey="cpu_usage"
|
||||
stroke="#10B981"
|
||||
strokeWidth={2}
|
||||
dot={false}
|
||||
/>
|
||||
<Line
|
||||
type="monotone"
|
||||
dataKey="ram_usage"
|
||||
stroke="#8B5CF6"
|
||||
strokeWidth={2}
|
||||
dot={false}
|
||||
/>
|
||||
</LineChart>
|
||||
</ResponsiveContainer>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
15
src/lib/db.ts
Normal file
15
src/lib/db.ts
Normal file
|
|
@ -0,0 +1,15 @@
|
|||
import mysql from 'mysql2/promise';
|
||||
|
||||
const pool = mysql.createPool({
|
||||
host: import.meta.env.VITE_DB_HOST || 'db.pandem.fr',
|
||||
user: import.meta.env.VITE_DB_USER || 'proxdash',
|
||||
password: import.meta.env.VITE_DB_PASSWORD || 'proxdash',
|
||||
database: import.meta.env.VITE_DB_NAME || 'proxdash',
|
||||
waitForConnections: true,
|
||||
connectionLimit: 10,
|
||||
maxIdle: 10,
|
||||
idleTimeout: 60000,
|
||||
queueLimit: 0,
|
||||
});
|
||||
|
||||
export default pool;
|
||||
|
|
@ -1,10 +1,6 @@
|
|||
import { createClient } from '@supabase/supabase-js';
|
||||
|
||||
const supabaseUrl = import.meta.env.VITE_SUPABASE_URL;
|
||||
const supabaseKey = import.meta.env.VITE_SUPABASE_ANON_KEY;
|
||||
|
||||
if (!supabaseUrl || !supabaseKey) {
|
||||
throw new Error('Missing Supabase environment variables');
|
||||
}
|
||||
const supabaseKey = import.meta.env.VITE_SUPABASE_KEY;
|
||||
|
||||
export const supabase = createClient(supabaseUrl, supabaseKey);
|
||||
17
src/types.ts
Normal file
17
src/types.ts
Normal file
|
|
@ -0,0 +1,17 @@
|
|||
export interface Server {
|
||||
id: string;
|
||||
name: string;
|
||||
model: string;
|
||||
cpu_model: string;
|
||||
ram_gb: number;
|
||||
influx_org: string;
|
||||
influx_token: string;
|
||||
influx_url: string;
|
||||
created_at: string;
|
||||
}
|
||||
|
||||
export interface ServerMetrics {
|
||||
cpu_usage: number;
|
||||
ram_usage: number;
|
||||
timestamp: string;
|
||||
}
|
||||
|
|
@ -1,62 +0,0 @@
|
|||
/*
|
||||
# Create servers table for Proxmox dashboard
|
||||
|
||||
1. New Tables
|
||||
- `servers`
|
||||
- `id` (uuid, primary key)
|
||||
- `name` (text)
|
||||
- `url` (text)
|
||||
- `status` (text)
|
||||
- `specs` (jsonb)
|
||||
- `last_ping` (integer)
|
||||
- `user_id` (uuid, foreign key to auth.users)
|
||||
- `created_at` (timestamp with time zone)
|
||||
|
||||
2. Security
|
||||
- Enable RLS on `servers` table
|
||||
- Add policies for authenticated users to:
|
||||
- Read their own servers
|
||||
- Insert their own servers
|
||||
- Update their own servers
|
||||
- Delete their own servers
|
||||
*/
|
||||
|
||||
CREATE TABLE IF NOT EXISTS servers (
|
||||
id uuid PRIMARY KEY DEFAULT gen_random_uuid(),
|
||||
name text NOT NULL,
|
||||
url text NOT NULL,
|
||||
status text NOT NULL DEFAULT 'checking',
|
||||
specs jsonb NOT NULL DEFAULT '{}'::jsonb,
|
||||
last_ping integer,
|
||||
user_id uuid REFERENCES auth.users(id) NOT NULL,
|
||||
created_at timestamptz DEFAULT now() NOT NULL
|
||||
);
|
||||
|
||||
-- Enable Row Level Security
|
||||
ALTER TABLE servers ENABLE ROW LEVEL SECURITY;
|
||||
|
||||
-- Create policies
|
||||
CREATE POLICY "Users can read their own servers"
|
||||
ON servers
|
||||
FOR SELECT
|
||||
TO authenticated
|
||||
USING (auth.uid() = user_id);
|
||||
|
||||
CREATE POLICY "Users can insert their own servers"
|
||||
ON servers
|
||||
FOR INSERT
|
||||
TO authenticated
|
||||
WITH CHECK (auth.uid() = user_id);
|
||||
|
||||
CREATE POLICY "Users can update their own servers"
|
||||
ON servers
|
||||
FOR UPDATE
|
||||
TO authenticated
|
||||
USING (auth.uid() = user_id)
|
||||
WITH CHECK (auth.uid() = user_id);
|
||||
|
||||
CREATE POLICY "Users can delete their own servers"
|
||||
ON servers
|
||||
FOR DELETE
|
||||
TO authenticated
|
||||
USING (auth.uid() = user_id);
|
||||
59
supabase/migrations/20250318001942_shy_cave.sql
Normal file
59
supabase/migrations/20250318001942_shy_cave.sql
Normal file
|
|
@ -0,0 +1,59 @@
|
|||
/*
|
||||
# Create servers table for Proxmox Dashboard
|
||||
|
||||
1. New Tables
|
||||
- `servers`
|
||||
- `id` (uuid, primary key)
|
||||
- `name` (text, server name)
|
||||
- `model` (text, server model like Dell R730)
|
||||
- `cpu_model` (text, CPU model name)
|
||||
- `ram_gb` (integer, RAM amount in GB)
|
||||
- `influx_org` (text, InfluxDB organization)
|
||||
- `influx_token` (text, InfluxDB API token)
|
||||
- `influx_url` (text, InfluxDB server URL)
|
||||
- `created_at` (timestamp with timezone)
|
||||
|
||||
2. Security
|
||||
- Enable RLS on `servers` table
|
||||
- Add policies for authenticated users to manage their servers
|
||||
*/
|
||||
|
||||
CREATE TABLE servers (
|
||||
id uuid PRIMARY KEY DEFAULT gen_random_uuid(),
|
||||
name text NOT NULL,
|
||||
model text NOT NULL,
|
||||
cpu_model text NOT NULL,
|
||||
ram_gb integer NOT NULL,
|
||||
influx_org text NOT NULL,
|
||||
influx_token text NOT NULL,
|
||||
influx_url text NOT NULL,
|
||||
created_at timestamptz DEFAULT now()
|
||||
);
|
||||
|
||||
-- Enable Row Level Security
|
||||
ALTER TABLE servers ENABLE ROW LEVEL SECURITY;
|
||||
|
||||
-- Create policies
|
||||
CREATE POLICY "Users can view their servers"
|
||||
ON servers
|
||||
FOR SELECT
|
||||
TO authenticated
|
||||
USING (true);
|
||||
|
||||
CREATE POLICY "Users can insert their servers"
|
||||
ON servers
|
||||
FOR INSERT
|
||||
TO authenticated
|
||||
WITH CHECK (true);
|
||||
|
||||
CREATE POLICY "Users can update their servers"
|
||||
ON servers
|
||||
FOR UPDATE
|
||||
TO authenticated
|
||||
USING (true);
|
||||
|
||||
CREATE POLICY "Users can delete their servers"
|
||||
ON servers
|
||||
FOR DELETE
|
||||
TO authenticated
|
||||
USING (true);
|
||||
Loading…
Reference in a new issue