Merge pull request 'amalia/28-mei-26' (#27) from amalia/28-mei-26 into main
Reviewed-on: #27
This commit is contained in:
46
bun.lock
46
bun.lock
@@ -22,6 +22,8 @@
|
|||||||
"dayjs": "^1.11.20",
|
"dayjs": "^1.11.20",
|
||||||
"elkjs": "^0.9.3",
|
"elkjs": "^0.9.3",
|
||||||
"elysia": "^1.4.28",
|
"elysia": "^1.4.28",
|
||||||
|
"html2canvas": "^1.4.1",
|
||||||
|
"jspdf": "^4.2.1",
|
||||||
"minio": "^8.0.7",
|
"minio": "^8.0.7",
|
||||||
"postcss": "^8.5.8",
|
"postcss": "^8.5.8",
|
||||||
"postcss-preset-mantine": "^1.18.0",
|
"postcss-preset-mantine": "^1.18.0",
|
||||||
@@ -352,10 +354,16 @@
|
|||||||
|
|
||||||
"@types/node": ["@types/node@25.5.0", "", { "dependencies": { "undici-types": "~7.18.0" } }, "sha512-jp2P3tQMSxWugkCUKLRPVUpGaL5MVFwF8RDuSRztfwgN1wmqJeMSbKlnEtQqU8UrhTmzEmZdu2I6v2dpp7XIxw=="],
|
"@types/node": ["@types/node@25.5.0", "", { "dependencies": { "undici-types": "~7.18.0" } }, "sha512-jp2P3tQMSxWugkCUKLRPVUpGaL5MVFwF8RDuSRztfwgN1wmqJeMSbKlnEtQqU8UrhTmzEmZdu2I6v2dpp7XIxw=="],
|
||||||
|
|
||||||
|
"@types/pako": ["@types/pako@2.0.4", "", {}, "sha512-VWDCbrLeVXJM9fihYodcLiIv0ku+AlOa/TQ1SvYOaBuyrSKgEcro95LJyIsJ4vSo6BXIxOKxiJAat04CmST9Fw=="],
|
||||||
|
|
||||||
|
"@types/raf": ["@types/raf@3.4.3", "", {}, "sha512-c4YAvMedbPZ5tEyxzQdMoOhhJ4RD3rngZIdwC2/qDN3d7JpEhB6fiBRKVY1lg5B7Wk+uPBjn5f39j1/2MY1oOw=="],
|
||||||
|
|
||||||
"@types/react": ["@types/react@19.2.14", "", { "dependencies": { "csstype": "^3.2.2" } }, "sha512-ilcTH/UniCkMdtexkoCN0bI7pMcJDvmQFPvuPvmEaYA/NSfFTAgdUSLAoVjaRJm7+6PvcM+q1zYOwS4wTYMF9w=="],
|
"@types/react": ["@types/react@19.2.14", "", { "dependencies": { "csstype": "^3.2.2" } }, "sha512-ilcTH/UniCkMdtexkoCN0bI7pMcJDvmQFPvuPvmEaYA/NSfFTAgdUSLAoVjaRJm7+6PvcM+q1zYOwS4wTYMF9w=="],
|
||||||
|
|
||||||
"@types/react-dom": ["@types/react-dom@19.2.3", "", { "peerDependencies": { "@types/react": "^19.2.0" } }, "sha512-jp2L/eY6fn+KgVVQAOqYItbF0VY/YApe5Mz2F0aykSO8gx31bYCZyvSeYxCHKvzHG5eZjc+zyaS5BrBWya2+kQ=="],
|
"@types/react-dom": ["@types/react-dom@19.2.3", "", { "peerDependencies": { "@types/react": "^19.2.0" } }, "sha512-jp2L/eY6fn+KgVVQAOqYItbF0VY/YApe5Mz2F0aykSO8gx31bYCZyvSeYxCHKvzHG5eZjc+zyaS5BrBWya2+kQ=="],
|
||||||
|
|
||||||
|
"@types/trusted-types": ["@types/trusted-types@2.0.7", "", {}, "sha512-ScaPdn1dQczgbl0QFTeTOmVHFULt394XJgOQNoyVhZ6r2vLnMLJfBPd53SB52T/3G36VI1/g2MZaX0cwDuXsfw=="],
|
||||||
|
|
||||||
"@types/use-sync-external-store": ["@types/use-sync-external-store@0.0.6", "", {}, "sha512-zFDAD+tlpf2r4asuHEj0XH6pY6i0g5NeAHPn+15wk3BV6JA69eERFXC1gyGThDkVa1zCyKr5jox1+2LbV/AMLg=="],
|
"@types/use-sync-external-store": ["@types/use-sync-external-store@0.0.6", "", {}, "sha512-zFDAD+tlpf2r4asuHEj0XH6pY6i0g5NeAHPn+15wk3BV6JA69eERFXC1gyGThDkVa1zCyKr5jox1+2LbV/AMLg=="],
|
||||||
|
|
||||||
"@types/yauzl": ["@types/yauzl@2.10.3", "", { "dependencies": { "@types/node": "*" } }, "sha512-oJoftv0LSuaDZE3Le4DbKX+KS9G36NzOeSap90UIK0yMA/NhKJhqlSGtNDORNRaIbQfzjXDrQa0ytJ6mNRGz/Q=="],
|
"@types/yauzl": ["@types/yauzl@2.10.3", "", { "dependencies": { "@types/node": "*" } }, "sha512-oJoftv0LSuaDZE3Le4DbKX+KS9G36NzOeSap90UIK0yMA/NhKJhqlSGtNDORNRaIbQfzjXDrQa0ytJ6mNRGz/Q=="],
|
||||||
@@ -406,6 +414,8 @@
|
|||||||
|
|
||||||
"bare-url": ["bare-url@2.4.0", "", { "dependencies": { "bare-path": "^3.0.0" } }, "sha512-NSTU5WN+fy/L0DDenfE8SXQna4voXuW0FHM7wH8i3/q9khUSchfPbPezO4zSFMnDGIf9YE+mt/RWhZgNRKRIXA=="],
|
"bare-url": ["bare-url@2.4.0", "", { "dependencies": { "bare-path": "^3.0.0" } }, "sha512-NSTU5WN+fy/L0DDenfE8SXQna4voXuW0FHM7wH8i3/q9khUSchfPbPezO4zSFMnDGIf9YE+mt/RWhZgNRKRIXA=="],
|
||||||
|
|
||||||
|
"base64-arraybuffer": ["base64-arraybuffer@1.0.2", "", {}, "sha512-I3yl4r9QB5ZRY3XuJVEPfc2XhZO6YweFPI+UovAzn+8/hb3oJ6lnysaFcjVpkCPfVWFUDvoZ8kmVDP7WyRtYtQ=="],
|
||||||
|
|
||||||
"baseline-browser-mapping": ["baseline-browser-mapping@2.10.12", "", { "bin": { "baseline-browser-mapping": "dist/cli.cjs" } }, "sha512-qyq26DxfY4awP2gIRXhhLWfwzwI+N5Nxk6iQi8EFizIaWIjqicQTE4sLnZZVdeKPRcVNoJOkkpfzoIYuvCKaIQ=="],
|
"baseline-browser-mapping": ["baseline-browser-mapping@2.10.12", "", { "bin": { "baseline-browser-mapping": "dist/cli.cjs" } }, "sha512-qyq26DxfY4awP2gIRXhhLWfwzwI+N5Nxk6iQi8EFizIaWIjqicQTE4sLnZZVdeKPRcVNoJOkkpfzoIYuvCKaIQ=="],
|
||||||
|
|
||||||
"basic-ftp": ["basic-ftp@5.2.0", "", {}, "sha512-VoMINM2rqJwJgfdHq6RiUudKt2BV+FY5ZFezP/ypmwayk68+NzzAQy4XXLlqsGD4MCzq3DrmNFD/uUmBJuGoXw=="],
|
"basic-ftp": ["basic-ftp@5.2.0", "", {}, "sha512-VoMINM2rqJwJgfdHq6RiUudKt2BV+FY5ZFezP/ypmwayk68+NzzAQy4XXLlqsGD4MCzq3DrmNFD/uUmBJuGoXw=="],
|
||||||
@@ -438,6 +448,8 @@
|
|||||||
|
|
||||||
"caniuse-lite": ["caniuse-lite@1.0.30001782", "", {}, "sha512-dZcaJLJeDMh4rELYFw1tvSn1bhZWYFOt468FcbHHxx/Z/dFidd1I6ciyFdi3iwfQCyOjqo9upF6lGQYtMiJWxw=="],
|
"caniuse-lite": ["caniuse-lite@1.0.30001782", "", {}, "sha512-dZcaJLJeDMh4rELYFw1tvSn1bhZWYFOt468FcbHHxx/Z/dFidd1I6ciyFdi3iwfQCyOjqo9upF6lGQYtMiJWxw=="],
|
||||||
|
|
||||||
|
"canvg": ["canvg@3.0.11", "", { "dependencies": { "@babel/runtime": "^7.12.5", "@types/raf": "^3.4.0", "core-js": "^3.8.3", "raf": "^3.4.1", "regenerator-runtime": "^0.13.7", "rgbcolor": "^1.0.1", "stackblur-canvas": "^2.0.0", "svg-pathdata": "^6.0.3" } }, "sha512-5ON+q7jCTgMp9cjpu4Jo6XbvfYwSB2Ow3kzHKfIyJfaCAOHLbdKPQqGKgfED/R5B+3TFFfe8pegYA+b423SRyA=="],
|
||||||
|
|
||||||
"chalk": ["chalk@5.6.2", "", {}, "sha512-7NzBL0rN6fMUW+f7A6Io4h40qQlG+xGmtMxfbnH/K7TAtt8JQWVQK+6g0UXKMeVJoyV5EkkNsErQ8pVD3bLHbA=="],
|
"chalk": ["chalk@5.6.2", "", {}, "sha512-7NzBL0rN6fMUW+f7A6Io4h40qQlG+xGmtMxfbnH/K7TAtt8JQWVQK+6g0UXKMeVJoyV5EkkNsErQ8pVD3bLHbA=="],
|
||||||
|
|
||||||
"chokidar": ["chokidar@3.6.0", "", { "dependencies": { "anymatch": "~3.1.2", "braces": "~3.0.2", "glob-parent": "~5.1.2", "is-binary-path": "~2.1.0", "is-glob": "~4.0.1", "normalize-path": "~3.0.0", "readdirp": "~3.6.0" }, "optionalDependencies": { "fsevents": "~2.3.2" } }, "sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw=="],
|
"chokidar": ["chokidar@3.6.0", "", { "dependencies": { "anymatch": "~3.1.2", "braces": "~3.0.2", "glob-parent": "~5.1.2", "is-binary-path": "~2.1.0", "is-glob": "~4.0.1", "normalize-path": "~3.0.0", "readdirp": "~3.6.0" }, "optionalDependencies": { "fsevents": "~2.3.2" } }, "sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw=="],
|
||||||
@@ -472,10 +484,14 @@
|
|||||||
|
|
||||||
"cookie-signature": ["cookie-signature@1.2.2", "", {}, "sha512-D76uU73ulSXrD1UXF4KE2TMxVVwhsnCgfAyTg9k8P6KGZjlXKrOLe4dJQKI3Bxi5wjesZoFXJWElNWBjPZMbhg=="],
|
"cookie-signature": ["cookie-signature@1.2.2", "", {}, "sha512-D76uU73ulSXrD1UXF4KE2TMxVVwhsnCgfAyTg9k8P6KGZjlXKrOLe4dJQKI3Bxi5wjesZoFXJWElNWBjPZMbhg=="],
|
||||||
|
|
||||||
|
"core-js": ["core-js@3.49.0", "", {}, "sha512-es1U2+YTtzpwkxVLwAFdSpaIMyQaq0PBgm3YD1W3Qpsn1NAmO3KSgZfu+oGSWVu6NvLHoHCV/aYcsE5wiB7ALg=="],
|
||||||
|
|
||||||
"cors": ["cors@2.8.6", "", { "dependencies": { "object-assign": "^4", "vary": "^1" } }, "sha512-tJtZBBHA6vjIAaF6EnIaq6laBBP9aq/Y3ouVJjEfoHbRBcHBAHYcMh/w8LDrk2PvIMMq8gmopa5D4V8RmbrxGw=="],
|
"cors": ["cors@2.8.6", "", { "dependencies": { "object-assign": "^4", "vary": "^1" } }, "sha512-tJtZBBHA6vjIAaF6EnIaq6laBBP9aq/Y3ouVJjEfoHbRBcHBAHYcMh/w8LDrk2PvIMMq8gmopa5D4V8RmbrxGw=="],
|
||||||
|
|
||||||
"cross-spawn": ["cross-spawn@7.0.6", "", { "dependencies": { "path-key": "^3.1.0", "shebang-command": "^2.0.0", "which": "^2.0.1" } }, "sha512-uV2QOWP2nWzsy2aMp8aRibhi9dlzF5Hgh5SHaB9OiTGEyDTiJJyx0uy51QXdyWbtAHNua4XJzUKca3OzKUd3vA=="],
|
"cross-spawn": ["cross-spawn@7.0.6", "", { "dependencies": { "path-key": "^3.1.0", "shebang-command": "^2.0.0", "which": "^2.0.1" } }, "sha512-uV2QOWP2nWzsy2aMp8aRibhi9dlzF5Hgh5SHaB9OiTGEyDTiJJyx0uy51QXdyWbtAHNua4XJzUKca3OzKUd3vA=="],
|
||||||
|
|
||||||
|
"css-line-break": ["css-line-break@2.1.0", "", { "dependencies": { "utrie": "^1.0.2" } }, "sha512-FHcKFCZcAha3LwfVBhCQbW2nCNbkZXn7KVUJcsT5/P8YmfsVja0FMPJr0B903j/E69HUphKiV9iQArX8SDYA4w=="],
|
||||||
|
|
||||||
"cssesc": ["cssesc@3.0.0", "", { "bin": { "cssesc": "bin/cssesc" } }, "sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg=="],
|
"cssesc": ["cssesc@3.0.0", "", { "bin": { "cssesc": "bin/cssesc" } }, "sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg=="],
|
||||||
|
|
||||||
"csstype": ["csstype@3.2.3", "", {}, "sha512-z1HGKcYy2xA8AGQfwrn0PAy+PB7X/GSj3UVJW9qKyn43xWa+gl5nXmU4qqLMRzWVLFC8KusUX8T/0kCiOYpAIQ=="],
|
"csstype": ["csstype@3.2.3", "", {}, "sha512-z1HGKcYy2xA8AGQfwrn0PAy+PB7X/GSj3UVJW9qKyn43xWa+gl5nXmU4qqLMRzWVLFC8KusUX8T/0kCiOYpAIQ=="],
|
||||||
@@ -544,6 +560,8 @@
|
|||||||
|
|
||||||
"dom-helpers": ["dom-helpers@5.2.1", "", { "dependencies": { "@babel/runtime": "^7.8.7", "csstype": "^3.0.2" } }, "sha512-nRCa7CK3VTrM2NmGkIy4cbK7IZlgBE/PYMn55rrXefr5xXDP0LdtfPnblFDoVdcAfslJ7or6iqAUnx0CCGIWQA=="],
|
"dom-helpers": ["dom-helpers@5.2.1", "", { "dependencies": { "@babel/runtime": "^7.8.7", "csstype": "^3.0.2" } }, "sha512-nRCa7CK3VTrM2NmGkIy4cbK7IZlgBE/PYMn55rrXefr5xXDP0LdtfPnblFDoVdcAfslJ7or6iqAUnx0CCGIWQA=="],
|
||||||
|
|
||||||
|
"dompurify": ["dompurify@3.4.7", "", { "optionalDependencies": { "@types/trusted-types": "^2.0.7" } }, "sha512-2jBxDJY4RR06tQNy4w5FlFH7kfxsQZlufd0sbv+chfHCxeJwrFw2baUDsSwvBISD4K4RDbd0PTfy3uNXsR6siA=="],
|
||||||
|
|
||||||
"dotenv": ["dotenv@16.6.1", "", {}, "sha512-uBq4egWHTcTt33a72vpSG0z3HnPuIl6NqYcTrKEg2azoEyl2hpW0zqlxysq2pK9HlDIHyHyakeYaYnSAwd8bow=="],
|
"dotenv": ["dotenv@16.6.1", "", {}, "sha512-uBq4egWHTcTt33a72vpSG0z3HnPuIl6NqYcTrKEg2azoEyl2hpW0zqlxysq2pK9HlDIHyHyakeYaYnSAwd8bow=="],
|
||||||
|
|
||||||
"dunder-proto": ["dunder-proto@1.0.1", "", { "dependencies": { "call-bind-apply-helpers": "^1.0.1", "es-errors": "^1.3.0", "gopd": "^1.2.0" } }, "sha512-KIN/nDJBQRcXw0MLVhZE9iQHmG68qAVIBg9CqmUYjmQIhgij9U5MFvrqkUL5FbtyyzZuOeOt0zdeRe4UY7ct+A=="],
|
"dunder-proto": ["dunder-proto@1.0.1", "", { "dependencies": { "call-bind-apply-helpers": "^1.0.1", "es-errors": "^1.3.0", "gopd": "^1.2.0" } }, "sha512-KIN/nDJBQRcXw0MLVhZE9iQHmG68qAVIBg9CqmUYjmQIhgij9U5MFvrqkUL5FbtyyzZuOeOt0zdeRe4UY7ct+A=="],
|
||||||
@@ -616,6 +634,8 @@
|
|||||||
|
|
||||||
"fast-fifo": ["fast-fifo@1.3.2", "", {}, "sha512-/d9sfos4yxzpwkDkuN7k2SqFKtYNmCTzgfEpz82x34IM9/zc8KGxQoXg1liNC/izpRM/MBdt44Nmx41ZWqk+FQ=="],
|
"fast-fifo": ["fast-fifo@1.3.2", "", {}, "sha512-/d9sfos4yxzpwkDkuN7k2SqFKtYNmCTzgfEpz82x34IM9/zc8KGxQoXg1liNC/izpRM/MBdt44Nmx41ZWqk+FQ=="],
|
||||||
|
|
||||||
|
"fast-png": ["fast-png@6.4.0", "", { "dependencies": { "@types/pako": "^2.0.3", "iobuffer": "^5.3.2", "pako": "^2.1.0" } }, "sha512-kAqZq1TlgBjZcLr5mcN6NP5Rv4V2f22z00c3g8vRrwkcqjerx7BEhPbOnWCPqaHUl2XWQBJQvOT/FQhdMT7X/Q=="],
|
||||||
|
|
||||||
"fast-uri": ["fast-uri@3.1.0", "", {}, "sha512-iPeeDKJSWf4IEOasVVrknXpaBV0IApz/gp7S2bb7Z4Lljbl2MGJRqInZiUrQwV16cpzw/D3S5j5Julj/gT52AA=="],
|
"fast-uri": ["fast-uri@3.1.0", "", {}, "sha512-iPeeDKJSWf4IEOasVVrknXpaBV0IApz/gp7S2bb7Z4Lljbl2MGJRqInZiUrQwV16cpzw/D3S5j5Julj/gT52AA=="],
|
||||||
|
|
||||||
"fast-xml-builder": ["fast-xml-builder@1.1.5", "", { "dependencies": { "path-expression-matcher": "^1.1.3" } }, "sha512-4TJn/8FKLeslLAH3dnohXqE3QSoxkhvaMzepOIZytwJXZO69Bfz0HBdDHzOTOon6G59Zrk6VQ2bEiv1t61rfkA=="],
|
"fast-xml-builder": ["fast-xml-builder@1.1.5", "", { "dependencies": { "path-expression-matcher": "^1.1.3" } }, "sha512-4TJn/8FKLeslLAH3dnohXqE3QSoxkhvaMzepOIZytwJXZO69Bfz0HBdDHzOTOon6G59Zrk6VQ2bEiv1t61rfkA=="],
|
||||||
@@ -626,6 +646,8 @@
|
|||||||
|
|
||||||
"fdir": ["fdir@6.5.0", "", { "peerDependencies": { "picomatch": "^3 || ^4" }, "optionalPeers": ["picomatch"] }, "sha512-tIbYtZbucOs0BRGqPJkshJUYdL+SDH7dVM8gjy+ERp3WAUjLEFJE+02kanyHtwjWOnwrKYBiwAmM0p4kLJAnXg=="],
|
"fdir": ["fdir@6.5.0", "", { "peerDependencies": { "picomatch": "^3 || ^4" }, "optionalPeers": ["picomatch"] }, "sha512-tIbYtZbucOs0BRGqPJkshJUYdL+SDH7dVM8gjy+ERp3WAUjLEFJE+02kanyHtwjWOnwrKYBiwAmM0p4kLJAnXg=="],
|
||||||
|
|
||||||
|
"fflate": ["fflate@0.8.3", "", {}, "sha512-tbZNuJrLwGUp3zshBtdy4W+ORxZuIh8a5ilyIEQDC5rY1f3U20JMry0Ll3WBzU58EZKsEuJFXhb5gwv8CsPvgA=="],
|
||||||
|
|
||||||
"file-type": ["file-type@22.0.0", "", { "dependencies": { "@tokenizer/inflate": "^0.4.1", "strtok3": "^10.3.5", "token-types": "^6.1.2", "uint8array-extras": "^1.5.0" } }, "sha512-cmBmnYo8Zymabm2+qAP7jTFbKF10bQpYmxoGfuZbRFRcq00BRddJdGNH/P7GA1EMpJy5yQbqa9B7yROb3z8Ziw=="],
|
"file-type": ["file-type@22.0.0", "", { "dependencies": { "@tokenizer/inflate": "^0.4.1", "strtok3": "^10.3.5", "token-types": "^6.1.2", "uint8array-extras": "^1.5.0" } }, "sha512-cmBmnYo8Zymabm2+qAP7jTFbKF10bQpYmxoGfuZbRFRcq00BRddJdGNH/P7GA1EMpJy5yQbqa9B7yROb3z8Ziw=="],
|
||||||
|
|
||||||
"fill-range": ["fill-range@7.1.1", "", { "dependencies": { "to-regex-range": "^5.0.1" } }, "sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg=="],
|
"fill-range": ["fill-range@7.1.1", "", { "dependencies": { "to-regex-range": "^5.0.1" } }, "sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg=="],
|
||||||
@@ -674,6 +696,8 @@
|
|||||||
|
|
||||||
"hookable": ["hookable@5.5.3", "", {}, "sha512-Yc+BQe8SvoXH1643Qez1zqLRmbA5rCL+sSmk6TVos0LWVfNIB7PGncdlId77WzLGSIB5KaWgTaNTs2lNVEI6VQ=="],
|
"hookable": ["hookable@5.5.3", "", {}, "sha512-Yc+BQe8SvoXH1643Qez1zqLRmbA5rCL+sSmk6TVos0LWVfNIB7PGncdlId77WzLGSIB5KaWgTaNTs2lNVEI6VQ=="],
|
||||||
|
|
||||||
|
"html2canvas": ["html2canvas@1.4.1", "", { "dependencies": { "css-line-break": "^2.1.0", "text-segmentation": "^1.0.3" } }, "sha512-fPU6BHNpsyIhr8yyMpTLLxAbkaK8ArIBcmZIRiBLiDhjeqvXolaEmDGmELFuX9I4xDcaKKcJl+TKZLqruBbmWA=="],
|
||||||
|
|
||||||
"http-errors": ["http-errors@2.0.1", "", { "dependencies": { "depd": "~2.0.0", "inherits": "~2.0.4", "setprototypeof": "~1.2.0", "statuses": "~2.0.2", "toidentifier": "~1.0.1" } }, "sha512-4FbRdAX+bSdmo4AUFuS0WNiPz8NgFt+r8ThgNWmlrjQjt1Q7ZR9+zTlce2859x4KSXrwIsaeTqDoKQmtP8pLmQ=="],
|
"http-errors": ["http-errors@2.0.1", "", { "dependencies": { "depd": "~2.0.0", "inherits": "~2.0.4", "setprototypeof": "~1.2.0", "statuses": "~2.0.2", "toidentifier": "~1.0.1" } }, "sha512-4FbRdAX+bSdmo4AUFuS0WNiPz8NgFt+r8ThgNWmlrjQjt1Q7ZR9+zTlce2859x4KSXrwIsaeTqDoKQmtP8pLmQ=="],
|
||||||
|
|
||||||
"http-proxy-agent": ["http-proxy-agent@7.0.2", "", { "dependencies": { "agent-base": "^7.1.0", "debug": "^4.3.4" } }, "sha512-T1gkAiYYDWYx3V5Bmyu7HcfcvL7mUrTWiM6yOfa3PIphViJ/gFPbvidQ+veqSOHci/PxBcDabeUNCzpOODJZig=="],
|
"http-proxy-agent": ["http-proxy-agent@7.0.2", "", { "dependencies": { "agent-base": "^7.1.0", "debug": "^4.3.4" } }, "sha512-T1gkAiYYDWYx3V5Bmyu7HcfcvL7mUrTWiM6yOfa3PIphViJ/gFPbvidQ+veqSOHci/PxBcDabeUNCzpOODJZig=="],
|
||||||
@@ -690,6 +714,8 @@
|
|||||||
|
|
||||||
"internmap": ["internmap@2.0.3", "", {}, "sha512-5Hh7Y1wQbvY5ooGgPbDaL5iYLAPzMTUrjMulskHLH6wnv/A+1q5rgEaiuqEjB+oxGXIVZs1FF+R/KPN3ZSQYYg=="],
|
"internmap": ["internmap@2.0.3", "", {}, "sha512-5Hh7Y1wQbvY5ooGgPbDaL5iYLAPzMTUrjMulskHLH6wnv/A+1q5rgEaiuqEjB+oxGXIVZs1FF+R/KPN3ZSQYYg=="],
|
||||||
|
|
||||||
|
"iobuffer": ["iobuffer@5.4.0", "", {}, "sha512-DRebOWuqDvxunfkNJAlc3IzWIPD5xVxwUNbHr7xKB8E6aLJxIPfNX3CoMJghcFjpv6RWQsrcJbghtEwSPoJqMA=="],
|
||||||
|
|
||||||
"ip-address": ["ip-address@10.1.0", "", {}, "sha512-XXADHxXmvT9+CRxhXg56LJovE+bmWnEWB78LB83VZTprKTmaC5QfruXocxzTZ2Kl0DNwKuBdlIhjL8LeY8Sf8Q=="],
|
"ip-address": ["ip-address@10.1.0", "", {}, "sha512-XXADHxXmvT9+CRxhXg56LJovE+bmWnEWB78LB83VZTprKTmaC5QfruXocxzTZ2Kl0DNwKuBdlIhjL8LeY8Sf8Q=="],
|
||||||
|
|
||||||
"ipaddr.js": ["ipaddr.js@2.3.0", "", {}, "sha512-Zv/pA+ciVFbCSBBjGfaKUya/CcGmUHzTydLMaTwrUUEM2DIEO3iZvueGxmacvmN50fGpGVKeTXpb2LcYQxeVdg=="],
|
"ipaddr.js": ["ipaddr.js@2.3.0", "", {}, "sha512-Zv/pA+ciVFbCSBBjGfaKUya/CcGmUHzTydLMaTwrUUEM2DIEO3iZvueGxmacvmN50fGpGVKeTXpb2LcYQxeVdg=="],
|
||||||
@@ -724,6 +750,8 @@
|
|||||||
|
|
||||||
"json5": ["json5@2.2.3", "", { "bin": { "json5": "lib/cli.js" } }, "sha512-XmOWe7eyHYH14cLdVPoyg+GOH3rYX++KpzrylJwSW98t3Nk+U8XOl8FWKOgwtzdb8lXGf6zYwDUzeHMWfxasyg=="],
|
"json5": ["json5@2.2.3", "", { "bin": { "json5": "lib/cli.js" } }, "sha512-XmOWe7eyHYH14cLdVPoyg+GOH3rYX++KpzrylJwSW98t3Nk+U8XOl8FWKOgwtzdb8lXGf6zYwDUzeHMWfxasyg=="],
|
||||||
|
|
||||||
|
"jspdf": ["jspdf@4.2.1", "", { "dependencies": { "@babel/runtime": "^7.28.6", "fast-png": "^6.2.0", "fflate": "^0.8.1" }, "optionalDependencies": { "canvg": "^3.0.11", "core-js": "^3.6.0", "dompurify": "^3.3.1", "html2canvas": "^1.0.0-rc.5" } }, "sha512-YyAXyvnmjTbR4bHQRLzex3CuINCDlQnBqoSYyjJwTP2x9jDLuKDzy7aKUl0hgx3uhcl7xzg32agn5vlie6HIlQ=="],
|
||||||
|
|
||||||
"lightningcss": ["lightningcss@1.32.0", "", { "dependencies": { "detect-libc": "^2.0.3" }, "optionalDependencies": { "lightningcss-android-arm64": "1.32.0", "lightningcss-darwin-arm64": "1.32.0", "lightningcss-darwin-x64": "1.32.0", "lightningcss-freebsd-x64": "1.32.0", "lightningcss-linux-arm-gnueabihf": "1.32.0", "lightningcss-linux-arm64-gnu": "1.32.0", "lightningcss-linux-arm64-musl": "1.32.0", "lightningcss-linux-x64-gnu": "1.32.0", "lightningcss-linux-x64-musl": "1.32.0", "lightningcss-win32-arm64-msvc": "1.32.0", "lightningcss-win32-x64-msvc": "1.32.0" } }, "sha512-NXYBzinNrblfraPGyrbPoD19C1h9lfI/1mzgWYvXUTe414Gz/X1FD2XBZSZM7rRTrMA8JL3OtAaGifrIKhQ5yQ=="],
|
"lightningcss": ["lightningcss@1.32.0", "", { "dependencies": { "detect-libc": "^2.0.3" }, "optionalDependencies": { "lightningcss-android-arm64": "1.32.0", "lightningcss-darwin-arm64": "1.32.0", "lightningcss-darwin-x64": "1.32.0", "lightningcss-freebsd-x64": "1.32.0", "lightningcss-linux-arm-gnueabihf": "1.32.0", "lightningcss-linux-arm64-gnu": "1.32.0", "lightningcss-linux-arm64-musl": "1.32.0", "lightningcss-linux-x64-gnu": "1.32.0", "lightningcss-linux-x64-musl": "1.32.0", "lightningcss-win32-arm64-msvc": "1.32.0", "lightningcss-win32-x64-msvc": "1.32.0" } }, "sha512-NXYBzinNrblfraPGyrbPoD19C1h9lfI/1mzgWYvXUTe414Gz/X1FD2XBZSZM7rRTrMA8JL3OtAaGifrIKhQ5yQ=="],
|
||||||
|
|
||||||
"lightningcss-android-arm64": ["lightningcss-android-arm64@1.32.0", "", { "os": "android", "cpu": "arm64" }, "sha512-YK7/ClTt4kAK0vo6w3X+Pnm0D2cf2vPHbhOXdoNti1Ga0al1P4TBZhwjATvjNwLEBCnKvjJc2jQgHXH0NEwlAg=="],
|
"lightningcss-android-arm64": ["lightningcss-android-arm64@1.32.0", "", { "os": "android", "cpu": "arm64" }, "sha512-YK7/ClTt4kAK0vo6w3X+Pnm0D2cf2vPHbhOXdoNti1Ga0al1P4TBZhwjATvjNwLEBCnKvjJc2jQgHXH0NEwlAg=="],
|
||||||
@@ -802,6 +830,8 @@
|
|||||||
|
|
||||||
"pac-resolver": ["pac-resolver@7.0.1", "", { "dependencies": { "degenerator": "^5.0.0", "netmask": "^2.0.2" } }, "sha512-5NPgf87AT2STgwa2ntRMr45jTKrYBGkVU36yT0ig/n/GMAa3oPqhZfIQ2kMEimReg0+t9kZViDVZ83qfVUlckg=="],
|
"pac-resolver": ["pac-resolver@7.0.1", "", { "dependencies": { "degenerator": "^5.0.0", "netmask": "^2.0.2" } }, "sha512-5NPgf87AT2STgwa2ntRMr45jTKrYBGkVU36yT0ig/n/GMAa3oPqhZfIQ2kMEimReg0+t9kZViDVZ83qfVUlckg=="],
|
||||||
|
|
||||||
|
"pako": ["pako@2.1.0", "", {}, "sha512-w+eufiZ1WuJYgPXbV/PO3NCMEc3xqylkKHzp8bxp1uW4qaSNQUkwmLLEc3kKsfz8lpV1F8Ht3U1Cm+9Srog2ug=="],
|
||||||
|
|
||||||
"parseurl": ["parseurl@1.3.3", "", {}, "sha512-CiyeOxFT/JZyN5m0z9PfXw4SCBJ6Sygz1Dpl0wqjlhDEGGBP1GnsUVEL0p63hoG1fcj3fHynXi9NYO4nWOL+qQ=="],
|
"parseurl": ["parseurl@1.3.3", "", {}, "sha512-CiyeOxFT/JZyN5m0z9PfXw4SCBJ6Sygz1Dpl0wqjlhDEGGBP1GnsUVEL0p63hoG1fcj3fHynXi9NYO4nWOL+qQ=="],
|
||||||
|
|
||||||
"path-expression-matcher": ["path-expression-matcher@1.5.0", "", {}, "sha512-cbrerZV+6rvdQrrD+iGMcZFEiiSrbv9Tfdkvnusy6y0x0GKBXREFg/Y65GhIfm0tnLntThhzCnfKwp1WRjeCyQ=="],
|
"path-expression-matcher": ["path-expression-matcher@1.5.0", "", {}, "sha512-cbrerZV+6rvdQrrD+iGMcZFEiiSrbv9Tfdkvnusy6y0x0GKBXREFg/Y65GhIfm0tnLntThhzCnfKwp1WRjeCyQ=="],
|
||||||
@@ -816,6 +846,8 @@
|
|||||||
|
|
||||||
"perfect-debounce": ["perfect-debounce@1.0.0", "", {}, "sha512-xCy9V055GLEqoFaHoC1SoLIaLmWctgCUaBaWxDZ7/Zx4CTyX7cJQLJOok/orfjZAh9kEYpjJa4d0KcJmCbctZA=="],
|
"perfect-debounce": ["perfect-debounce@1.0.0", "", {}, "sha512-xCy9V055GLEqoFaHoC1SoLIaLmWctgCUaBaWxDZ7/Zx4CTyX7cJQLJOok/orfjZAh9kEYpjJa4d0KcJmCbctZA=="],
|
||||||
|
|
||||||
|
"performance-now": ["performance-now@2.1.0", "", {}, "sha512-7EAHlyLHI56VEIdK57uwHdHKIaAGbnXPiw0yWbarQZOKaKpvUIgW0jWRVLiatnM+XXlSwsanIBH/hzGMJulMow=="],
|
||||||
|
|
||||||
"picocolors": ["picocolors@1.1.1", "", {}, "sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA=="],
|
"picocolors": ["picocolors@1.1.1", "", {}, "sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA=="],
|
||||||
|
|
||||||
"picomatch": ["picomatch@4.0.4", "", {}, "sha512-QP88BAKvMam/3NxH6vj2o21R6MjxZUAd6nlwAS/pnGvN9IVLocLHxGYIzFhg6fUQ+5th6P4dv4eW9jX3DSIj7A=="],
|
"picomatch": ["picomatch@4.0.4", "", {}, "sha512-QP88BAKvMam/3NxH6vj2o21R6MjxZUAd6nlwAS/pnGvN9IVLocLHxGYIzFhg6fUQ+5th6P4dv4eW9jX3DSIj7A=="],
|
||||||
@@ -866,6 +898,8 @@
|
|||||||
|
|
||||||
"query-string": ["query-string@7.1.3", "", { "dependencies": { "decode-uri-component": "^0.2.2", "filter-obj": "^1.1.0", "split-on-first": "^1.0.0", "strict-uri-encode": "^2.0.0" } }, "sha512-hh2WYhq4fi8+b+/2Kg9CEge4fDPvHS534aOOvOZeQ3+Vf2mCFsaFBYj0i+iXcAq6I9Vzp5fjMFBlONvayDC1qg=="],
|
"query-string": ["query-string@7.1.3", "", { "dependencies": { "decode-uri-component": "^0.2.2", "filter-obj": "^1.1.0", "split-on-first": "^1.0.0", "strict-uri-encode": "^2.0.0" } }, "sha512-hh2WYhq4fi8+b+/2Kg9CEge4fDPvHS534aOOvOZeQ3+Vf2mCFsaFBYj0i+iXcAq6I9Vzp5fjMFBlONvayDC1qg=="],
|
||||||
|
|
||||||
|
"raf": ["raf@3.4.1", "", { "dependencies": { "performance-now": "^2.1.0" } }, "sha512-Sq4CW4QhwOHE8ucn6J34MqtZCeWFP2aQSmrlroYgqAV1PjStIhJXxYuTgUIfkEk7zTLjmIjLmU5q+fbD1NnOJA=="],
|
||||||
|
|
||||||
"range-parser": ["range-parser@1.2.1", "", {}, "sha512-Hrgsx+orqoygnmhFbKaHE6c296J+HTAQXoxEF6gNupROmmGJRoyzfG3ccAveqCBrwr/2yxQ5BVd/GTl5agOwSg=="],
|
"range-parser": ["range-parser@1.2.1", "", {}, "sha512-Hrgsx+orqoygnmhFbKaHE6c296J+HTAQXoxEF6gNupROmmGJRoyzfG3ccAveqCBrwr/2yxQ5BVd/GTl5agOwSg=="],
|
||||||
|
|
||||||
"raw-body": ["raw-body@3.0.2", "", { "dependencies": { "bytes": "~3.1.2", "http-errors": "~2.0.1", "iconv-lite": "~0.7.0", "unpipe": "~1.0.0" } }, "sha512-K5zQjDllxWkf7Z5xJdV0/B0WTNqx6vxG70zJE4N0kBs4LovmEYWJzQGxC9bS9RAKu3bgM40lrd5zoLJ12MQ5BA=="],
|
"raw-body": ["raw-body@3.0.2", "", { "dependencies": { "bytes": "~3.1.2", "http-errors": "~2.0.1", "iconv-lite": "~0.7.0", "unpipe": "~1.0.0" } }, "sha512-K5zQjDllxWkf7Z5xJdV0/B0WTNqx6vxG70zJE4N0kBs4LovmEYWJzQGxC9bS9RAKu3bgM40lrd5zoLJ12MQ5BA=="],
|
||||||
@@ -906,6 +940,8 @@
|
|||||||
|
|
||||||
"redux-thunk": ["redux-thunk@3.1.0", "", { "peerDependencies": { "redux": "^5.0.0" } }, "sha512-NW2r5T6ksUKXCabzhL9z+h206HQw/NJkcLm1GPImRQ8IzfXwRGqjVhKJGauHirT0DAuyy6hjdnMZaRoAcy0Klw=="],
|
"redux-thunk": ["redux-thunk@3.1.0", "", { "peerDependencies": { "redux": "^5.0.0" } }, "sha512-NW2r5T6ksUKXCabzhL9z+h206HQw/NJkcLm1GPImRQ8IzfXwRGqjVhKJGauHirT0DAuyy6hjdnMZaRoAcy0Klw=="],
|
||||||
|
|
||||||
|
"regenerator-runtime": ["regenerator-runtime@0.13.11", "", {}, "sha512-kY1AZVr2Ra+t+piVaJ4gxaFaReZVH40AKNo7UCX6W+dEwBo/2oZJzqfuN1qLq1oL45o56cPaTXELwrTh8Fpggg=="],
|
||||||
|
|
||||||
"require-directory": ["require-directory@2.1.1", "", {}, "sha512-fGxEI7+wsG9xrvdjsrlmL22OMTTiHRwAMroiEeMgq8gzoLC/PQr7RsRDSTLUg/bZAZtF+TVIkHc6/4RIKrui+Q=="],
|
"require-directory": ["require-directory@2.1.1", "", {}, "sha512-fGxEI7+wsG9xrvdjsrlmL22OMTTiHRwAMroiEeMgq8gzoLC/PQr7RsRDSTLUg/bZAZtF+TVIkHc6/4RIKrui+Q=="],
|
||||||
|
|
||||||
"require-from-string": ["require-from-string@2.0.2", "", {}, "sha512-Xf0nWe6RseziFMu+Ap9biiUbmplq6S9/p+7w7YXP/JBHhrUDDUhwa+vANyubuqfZWTveU//DYVGsDG7RKL/vEw=="],
|
"require-from-string": ["require-from-string@2.0.2", "", {}, "sha512-Xf0nWe6RseziFMu+Ap9biiUbmplq6S9/p+7w7YXP/JBHhrUDDUhwa+vANyubuqfZWTveU//DYVGsDG7RKL/vEw=="],
|
||||||
@@ -914,6 +950,8 @@
|
|||||||
|
|
||||||
"resolve-pkg-maps": ["resolve-pkg-maps@1.0.0", "", {}, "sha512-seS2Tj26TBVOC2NIc2rOe2y2ZO7efxITtLZcGSOnHHNOQ7CkiUBfw0Iw2ck6xkIhPwLhKNLS8BO+hEpngQlqzw=="],
|
"resolve-pkg-maps": ["resolve-pkg-maps@1.0.0", "", {}, "sha512-seS2Tj26TBVOC2NIc2rOe2y2ZO7efxITtLZcGSOnHHNOQ7CkiUBfw0Iw2ck6xkIhPwLhKNLS8BO+hEpngQlqzw=="],
|
||||||
|
|
||||||
|
"rgbcolor": ["rgbcolor@1.0.1", "", {}, "sha512-9aZLIrhRaD97sgVhtJOW6ckOEh6/GnvQtdVNfdZ6s67+3/XwLS9lBcQYzEEhYVeUowN7pRzMLsyGhK2i/xvWbw=="],
|
||||||
|
|
||||||
"rolldown": ["rolldown@1.0.0-rc.12", "", { "dependencies": { "@oxc-project/types": "=0.122.0", "@rolldown/pluginutils": "1.0.0-rc.12" }, "optionalDependencies": { "@rolldown/binding-android-arm64": "1.0.0-rc.12", "@rolldown/binding-darwin-arm64": "1.0.0-rc.12", "@rolldown/binding-darwin-x64": "1.0.0-rc.12", "@rolldown/binding-freebsd-x64": "1.0.0-rc.12", "@rolldown/binding-linux-arm-gnueabihf": "1.0.0-rc.12", "@rolldown/binding-linux-arm64-gnu": "1.0.0-rc.12", "@rolldown/binding-linux-arm64-musl": "1.0.0-rc.12", "@rolldown/binding-linux-ppc64-gnu": "1.0.0-rc.12", "@rolldown/binding-linux-s390x-gnu": "1.0.0-rc.12", "@rolldown/binding-linux-x64-gnu": "1.0.0-rc.12", "@rolldown/binding-linux-x64-musl": "1.0.0-rc.12", "@rolldown/binding-openharmony-arm64": "1.0.0-rc.12", "@rolldown/binding-wasm32-wasi": "1.0.0-rc.12", "@rolldown/binding-win32-arm64-msvc": "1.0.0-rc.12", "@rolldown/binding-win32-x64-msvc": "1.0.0-rc.12" }, "bin": { "rolldown": "bin/cli.mjs" } }, "sha512-yP4USLIMYrwpPHEFB5JGH1uxhcslv6/hL0OyvTuY+3qlOSJvZ7ntYnoWpehBxufkgN0cvXxppuTu5hHa/zPh+A=="],
|
"rolldown": ["rolldown@1.0.0-rc.12", "", { "dependencies": { "@oxc-project/types": "=0.122.0", "@rolldown/pluginutils": "1.0.0-rc.12" }, "optionalDependencies": { "@rolldown/binding-android-arm64": "1.0.0-rc.12", "@rolldown/binding-darwin-arm64": "1.0.0-rc.12", "@rolldown/binding-darwin-x64": "1.0.0-rc.12", "@rolldown/binding-freebsd-x64": "1.0.0-rc.12", "@rolldown/binding-linux-arm-gnueabihf": "1.0.0-rc.12", "@rolldown/binding-linux-arm64-gnu": "1.0.0-rc.12", "@rolldown/binding-linux-arm64-musl": "1.0.0-rc.12", "@rolldown/binding-linux-ppc64-gnu": "1.0.0-rc.12", "@rolldown/binding-linux-s390x-gnu": "1.0.0-rc.12", "@rolldown/binding-linux-x64-gnu": "1.0.0-rc.12", "@rolldown/binding-linux-x64-musl": "1.0.0-rc.12", "@rolldown/binding-openharmony-arm64": "1.0.0-rc.12", "@rolldown/binding-wasm32-wasi": "1.0.0-rc.12", "@rolldown/binding-win32-arm64-msvc": "1.0.0-rc.12", "@rolldown/binding-win32-x64-msvc": "1.0.0-rc.12" }, "bin": { "rolldown": "bin/cli.mjs" } }, "sha512-yP4USLIMYrwpPHEFB5JGH1uxhcslv6/hL0OyvTuY+3qlOSJvZ7ntYnoWpehBxufkgN0cvXxppuTu5hHa/zPh+A=="],
|
||||||
|
|
||||||
"router": ["router@2.2.0", "", { "dependencies": { "debug": "^4.4.0", "depd": "^2.0.0", "is-promise": "^4.0.0", "parseurl": "^1.3.3", "path-to-regexp": "^8.0.0" } }, "sha512-nLTrUKm2UyiL7rlhapu/Zl45FwNgkZGaCpZbIHajDYgwlJCOzLSk+cIPAnsEqV955GjILJnKbdQC1nVPz+gAYQ=="],
|
"router": ["router@2.2.0", "", { "dependencies": { "debug": "^4.4.0", "depd": "^2.0.0", "is-promise": "^4.0.0", "parseurl": "^1.3.3", "path-to-regexp": "^8.0.0" } }, "sha512-nLTrUKm2UyiL7rlhapu/Zl45FwNgkZGaCpZbIHajDYgwlJCOzLSk+cIPAnsEqV955GjILJnKbdQC1nVPz+gAYQ=="],
|
||||||
@@ -962,6 +1000,8 @@
|
|||||||
|
|
||||||
"split-on-first": ["split-on-first@1.1.0", "", {}, "sha512-43ZssAJaMusuKWL8sKUBQXHWOpq8d6CfN/u1p4gUzfJkM05C8rxTmYrkIPTXapZpORA6LkkzcUulJ8FqA7Uudw=="],
|
"split-on-first": ["split-on-first@1.1.0", "", {}, "sha512-43ZssAJaMusuKWL8sKUBQXHWOpq8d6CfN/u1p4gUzfJkM05C8rxTmYrkIPTXapZpORA6LkkzcUulJ8FqA7Uudw=="],
|
||||||
|
|
||||||
|
"stackblur-canvas": ["stackblur-canvas@2.7.0", "", {}, "sha512-yf7OENo23AGJhBriGx0QivY5JP6Y1HbrrDI6WLt6C5auYZXlQrheoY8hD4ibekFKz1HOfE48Ww8kMWMnJD/zcQ=="],
|
||||||
|
|
||||||
"statuses": ["statuses@2.0.2", "", {}, "sha512-DvEy55V3DB7uknRo+4iOGT5fP1slR8wQohVdknigZPMpMstaKJQWhwiYBACJE3Ul2pTnATihhBYnRhZQHGBiRw=="],
|
"statuses": ["statuses@2.0.2", "", {}, "sha512-DvEy55V3DB7uknRo+4iOGT5fP1slR8wQohVdknigZPMpMstaKJQWhwiYBACJE3Ul2pTnATihhBYnRhZQHGBiRw=="],
|
||||||
|
|
||||||
"stream-chain": ["stream-chain@2.2.5", "", {}, "sha512-1TJmBx6aSWqZ4tx7aTpBDXK0/e2hhcNSTV8+CbFJtDjbb+I1mZ8lHit0Grw9GRT+6JbIrrDd8esncgBi8aBXGA=="],
|
"stream-chain": ["stream-chain@2.2.5", "", {}, "sha512-1TJmBx6aSWqZ4tx7aTpBDXK0/e2hhcNSTV8+CbFJtDjbb+I1mZ8lHit0Grw9GRT+6JbIrrDd8esncgBi8aBXGA=="],
|
||||||
@@ -984,6 +1024,8 @@
|
|||||||
|
|
||||||
"sugarss": ["sugarss@5.0.1", "", { "peerDependencies": { "postcss": "^8.3.3" } }, "sha512-ctS5RYCBVvPoZAnzIaX5QSShK8ZiZxD5HUqSxlusvEMC+QZQIPCPOIJg6aceFX+K2rf4+SH89eu++h1Zmsr2nw=="],
|
"sugarss": ["sugarss@5.0.1", "", { "peerDependencies": { "postcss": "^8.3.3" } }, "sha512-ctS5RYCBVvPoZAnzIaX5QSShK8ZiZxD5HUqSxlusvEMC+QZQIPCPOIJg6aceFX+K2rf4+SH89eu++h1Zmsr2nw=="],
|
||||||
|
|
||||||
|
"svg-pathdata": ["svg-pathdata@6.0.3", "", {}, "sha512-qsjeeq5YjBZ5eMdFuUa4ZosMLxgr5RZ+F+Y1OrDhuOCEInRMA3x74XdBtggJcj9kOeInz0WE+LgCPDkZFlBYJw=="],
|
||||||
|
|
||||||
"swr": ["swr@2.4.1", "", { "dependencies": { "dequal": "^2.0.3", "use-sync-external-store": "^1.6.0" }, "peerDependencies": { "react": "^16.11.0 || ^17.0.0 || ^18.0.0 || ^19.0.0" } }, "sha512-2CC6CiKQtEwaEeNiqWTAw9PGykW8SR5zZX8MZk6TeAvEAnVS7Visz8WzphqgtQ8v2xz/4Q5K+j+SeMaKXeeQIA=="],
|
"swr": ["swr@2.4.1", "", { "dependencies": { "dequal": "^2.0.3", "use-sync-external-store": "^1.6.0" }, "peerDependencies": { "react": "^16.11.0 || ^17.0.0 || ^18.0.0 || ^19.0.0" } }, "sha512-2CC6CiKQtEwaEeNiqWTAw9PGykW8SR5zZX8MZk6TeAvEAnVS7Visz8WzphqgtQ8v2xz/4Q5K+j+SeMaKXeeQIA=="],
|
||||||
|
|
||||||
"tabbable": ["tabbable@6.4.0", "", {}, "sha512-05PUHKSNE8ou2dwIxTngl4EzcnsCDZGJ/iCLtDflR/SHB/ny14rXc+qU5P4mG9JkusiV7EivzY9Mhm55AzAvCg=="],
|
"tabbable": ["tabbable@6.4.0", "", {}, "sha512-05PUHKSNE8ou2dwIxTngl4EzcnsCDZGJ/iCLtDflR/SHB/ny14rXc+qU5P4mG9JkusiV7EivzY9Mhm55AzAvCg=="],
|
||||||
@@ -996,6 +1038,8 @@
|
|||||||
|
|
||||||
"text-decoder": ["text-decoder@1.2.7", "", { "dependencies": { "b4a": "^1.6.4" } }, "sha512-vlLytXkeP4xvEq2otHeJfSQIRyWxo/oZGEbXrtEEF9Hnmrdly59sUbzZ/QgyWuLYHctCHxFF4tRQZNQ9k60ExQ=="],
|
"text-decoder": ["text-decoder@1.2.7", "", { "dependencies": { "b4a": "^1.6.4" } }, "sha512-vlLytXkeP4xvEq2otHeJfSQIRyWxo/oZGEbXrtEEF9Hnmrdly59sUbzZ/QgyWuLYHctCHxFF4tRQZNQ9k60ExQ=="],
|
||||||
|
|
||||||
|
"text-segmentation": ["text-segmentation@1.0.3", "", { "dependencies": { "utrie": "^1.0.2" } }, "sha512-iOiPUo/BGnZ6+54OsWxZidGCsdU8YbE4PSpdPinp7DeMtUJNJBoJ/ouUSTJjHkh1KntHaltHl/gDs2FC4i5+Nw=="],
|
||||||
|
|
||||||
"through2": ["through2@4.0.2", "", { "dependencies": { "readable-stream": "3" } }, "sha512-iOqSav00cVxEEICeD7TjLB1sueEL+81Wpzp2bY17uZjZN0pWZPuo4suZ/61VujxmqSGFfgOcNuTZ85QJwNZQpw=="],
|
"through2": ["through2@4.0.2", "", { "dependencies": { "readable-stream": "3" } }, "sha512-iOqSav00cVxEEICeD7TjLB1sueEL+81Wpzp2bY17uZjZN0pWZPuo4suZ/61VujxmqSGFfgOcNuTZ85QJwNZQpw=="],
|
||||||
|
|
||||||
"tiny-invariant": ["tiny-invariant@1.3.3", "", {}, "sha512-+FbBPE1o9QAYvviau/qC5SE3caw21q3xkvWKBtja5vgqOWIHHJ3ioaq1VPfn/Szqctz2bU/oYeKd9/z5BL+PVg=="],
|
"tiny-invariant": ["tiny-invariant@1.3.3", "", {}, "sha512-+FbBPE1o9QAYvviau/qC5SE3caw21q3xkvWKBtja5vgqOWIHHJ3ioaq1VPfn/Szqctz2bU/oYeKd9/z5BL+PVg=="],
|
||||||
@@ -1046,6 +1090,8 @@
|
|||||||
|
|
||||||
"util-deprecate": ["util-deprecate@1.0.2", "", {}, "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw=="],
|
"util-deprecate": ["util-deprecate@1.0.2", "", {}, "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw=="],
|
||||||
|
|
||||||
|
"utrie": ["utrie@1.0.2", "", { "dependencies": { "base64-arraybuffer": "^1.0.2" } }, "sha512-1MLa5ouZiOmQzUbjbu9VmjLzn1QLXBhwpUa7kdLUQK+KQ5KA9I1vk5U4YHe/X2Ch7PYnJfWuWT+VbuxbGwljhw=="],
|
||||||
|
|
||||||
"vary": ["vary@1.1.2", "", {}, "sha512-BNGbWLfd0eUPabhkXUVm0j8uuvREyTh5ovRa/dyow/BqAbZJyC+5fU+IzQOzmAKzYqYRAISoRhdQr3eIZ/PXqg=="],
|
"vary": ["vary@1.1.2", "", {}, "sha512-BNGbWLfd0eUPabhkXUVm0j8uuvREyTh5ovRa/dyow/BqAbZJyC+5fU+IzQOzmAKzYqYRAISoRhdQr3eIZ/PXqg=="],
|
||||||
|
|
||||||
"victory-vendor": ["victory-vendor@37.3.6", "", { "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" } }, "sha512-SbPDPdDBYp+5MJHhBCAyI7wKM3d5ivekigc2Dk2s7pgbZ9wIgIBYGVw4zGHBml/qTFbexrofXW6Gu4noGxrOwQ=="],
|
"victory-vendor": ["victory-vendor@37.3.6", "", { "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" } }, "sha512-SbPDPdDBYp+5MJHhBCAyI7wKM3d5ivekigc2Dk2s7pgbZ9wIgIBYGVw4zGHBml/qTFbexrofXW6Gu4noGxrOwQ=="],
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "bun-react-template",
|
"name": "bun-react-template",
|
||||||
"version": "0.1.16",
|
"version": "0.1.17",
|
||||||
"private": true,
|
"private": true,
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
@@ -41,6 +41,8 @@
|
|||||||
"dayjs": "^1.11.20",
|
"dayjs": "^1.11.20",
|
||||||
"elkjs": "^0.9.3",
|
"elkjs": "^0.9.3",
|
||||||
"elysia": "^1.4.28",
|
"elysia": "^1.4.28",
|
||||||
|
"html2canvas": "^1.4.1",
|
||||||
|
"jspdf": "^4.2.1",
|
||||||
"minio": "^8.0.7",
|
"minio": "^8.0.7",
|
||||||
"postcss": "^8.5.8",
|
"postcss": "^8.5.8",
|
||||||
"postcss-preset-mantine": "^1.18.0",
|
"postcss-preset-mantine": "^1.18.0",
|
||||||
|
|||||||
@@ -8,7 +8,6 @@ import {
|
|||||||
Group,
|
Group,
|
||||||
Loader,
|
Loader,
|
||||||
Paper,
|
Paper,
|
||||||
ScrollArea,
|
|
||||||
SimpleGrid,
|
SimpleGrid,
|
||||||
Stack,
|
Stack,
|
||||||
Table,
|
Table,
|
||||||
@@ -74,7 +73,7 @@ export const ErrorDataTable = forwardRef<ErrorDataTableHandle, ErrorDataTablePro
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<Paper withBorder radius="2xl" className="glass" style={{ overflow: 'hidden' }}>
|
<Paper withBorder radius="2xl" className="glass" style={{ overflowX: 'auto' }}>
|
||||||
<Box p="lg" style={{ borderBottom: '1px solid rgba(255,255,255,0.08)' }}>
|
<Box p="lg" style={{ borderBottom: '1px solid rgba(255,255,255,0.08)' }}>
|
||||||
<Group justify="space-between">
|
<Group justify="space-between">
|
||||||
<Group gap="sm">
|
<Group gap="sm">
|
||||||
@@ -101,15 +100,15 @@ export const ErrorDataTable = forwardRef<ErrorDataTableHandle, ErrorDataTablePro
|
|||||||
</Group>
|
</Group>
|
||||||
</Box>
|
</Box>
|
||||||
|
|
||||||
<ScrollArea>
|
<Table.ScrollContainer minWidth={520}>
|
||||||
<Table verticalSpacing="sm" highlightOnHover className="data-table">
|
<Table verticalSpacing="sm" highlightOnHover className="data-table">
|
||||||
<Table.Thead>
|
<Table.Thead>
|
||||||
<Table.Tr>
|
<Table.Tr>
|
||||||
<Table.Th px="lg">Error Description</Table.Th>
|
<Table.Th px="lg">Error Description</Table.Th>
|
||||||
<Table.Th>Reporter</Table.Th>
|
<Table.Th style={{ whiteSpace: 'nowrap' }}>Reporter</Table.Th>
|
||||||
<Table.Th>Version</Table.Th>
|
<Table.Th style={{ whiteSpace: 'nowrap' }}>Version</Table.Th>
|
||||||
<Table.Th>Reported</Table.Th>
|
<Table.Th style={{ whiteSpace: 'nowrap' }}>Reported</Table.Th>
|
||||||
<Table.Th pr="lg">Status</Table.Th>
|
<Table.Th pr="lg" style={{ whiteSpace: 'nowrap' }}>Status</Table.Th>
|
||||||
</Table.Tr>
|
</Table.Tr>
|
||||||
</Table.Thead>
|
</Table.Thead>
|
||||||
<Table.Tbody>
|
<Table.Tbody>
|
||||||
@@ -149,8 +148,8 @@ export const ErrorDataTable = forwardRef<ErrorDataTableHandle, ErrorDataTablePro
|
|||||||
v{error.affectedVersion || 'N/A'}
|
v{error.affectedVersion || 'N/A'}
|
||||||
</Badge>
|
</Badge>
|
||||||
</Table.Td>
|
</Table.Td>
|
||||||
<Table.Td>
|
<Table.Td style={{ whiteSpace: 'nowrap' }}>
|
||||||
<Group gap={4}>
|
<Group gap={4} wrap="nowrap">
|
||||||
<TbHistory size={12} color="gray" />
|
<TbHistory size={12} color="gray" />
|
||||||
<Text size="xs" c="dimmed">
|
<Text size="xs" c="dimmed">
|
||||||
{dayjs(error.createdAt).format('D MMM YYYY, HH:mm')}
|
{dayjs(error.createdAt).format('D MMM YYYY, HH:mm')}
|
||||||
@@ -170,7 +169,7 @@ export const ErrorDataTable = forwardRef<ErrorDataTableHandle, ErrorDataTablePro
|
|||||||
))}
|
))}
|
||||||
</Table.Tbody>
|
</Table.Tbody>
|
||||||
</Table>
|
</Table>
|
||||||
</ScrollArea>
|
</Table.ScrollContainer>
|
||||||
</Paper>
|
</Paper>
|
||||||
|
|
||||||
<Drawer
|
<Drawer
|
||||||
|
|||||||
@@ -32,6 +32,17 @@ export const API_URLS = {
|
|||||||
if (dateTo) params.set('dateTo', dateTo)
|
if (dateTo) params.set('dateTo', dateTo)
|
||||||
return `${DESA_PLUS_PROXY}/api/monitoring/log-all-villages?${params}`
|
return `${DESA_PLUS_PROXY}/api/monitoring/log-all-villages?${params}`
|
||||||
},
|
},
|
||||||
|
getStaleVillages: (days: 7 | 14 | 30 = 7) => `${DESA_PLUS_PROXY}/api/monitoring/stale-villages?days=${days}`,
|
||||||
|
getPeakHours: (idVillage?: string) => {
|
||||||
|
const params = new URLSearchParams()
|
||||||
|
if (idVillage) params.set('idVillage', idVillage)
|
||||||
|
return `${DESA_PLUS_PROXY}/api/monitoring/peak-hours?${params}`
|
||||||
|
},
|
||||||
|
getInactiveUsers: (days: 7 | 14 | 30 = 7, idVillage?: string, page = 1) => {
|
||||||
|
const params = new URLSearchParams({ days: String(days), page: String(page) })
|
||||||
|
if (idVillage) params.set('idVillage', idVillage)
|
||||||
|
return `${DESA_PLUS_PROXY}/api/monitoring/inactive-users?${params}`
|
||||||
|
},
|
||||||
getGridOverview: () => `${DESA_PLUS_PROXY}/api/monitoring/grid-overview`,
|
getGridOverview: () => `${DESA_PLUS_PROXY}/api/monitoring/grid-overview`,
|
||||||
getDailyActivity: (range: 7 | 30 | 90 = 7) => `${DESA_PLUS_PROXY}/api/monitoring/daily-activity?range=${range}`,
|
getDailyActivity: (range: 7 | 30 | 90 = 7) => `${DESA_PLUS_PROXY}/api/monitoring/daily-activity?range=${range}`,
|
||||||
getComparisonActivity: (range: 7 | 30 | 90 = 7) => `${DESA_PLUS_PROXY}/api/monitoring/comparison-activity?range=${range}`,
|
getComparisonActivity: (range: 7 | 30 | 90 = 7) => `${DESA_PLUS_PROXY}/api/monitoring/comparison-activity?range=${range}`,
|
||||||
@@ -70,4 +81,21 @@ export const API_URLS = {
|
|||||||
updateBugStatus: (id: string) => `/api/bugs/${id}/status`,
|
updateBugStatus: (id: string) => `/api/bugs/${id}/status`,
|
||||||
updateBugFeedback: (id: string) => `/api/bugs/${id}/feedback`,
|
updateBugFeedback: (id: string) => `/api/bugs/${id}/feedback`,
|
||||||
createLog: () => `/api/logs`,
|
createLog: () => `/api/logs`,
|
||||||
|
exportLogs: (search: string, action?: string, idVillage?: string, dateFrom?: string, dateTo?: string) => {
|
||||||
|
const params = new URLSearchParams({ search })
|
||||||
|
if (action) params.set('action', action)
|
||||||
|
if (idVillage) params.set('idVillage', idVillage)
|
||||||
|
if (dateFrom) params.set('dateFrom', dateFrom)
|
||||||
|
if (dateTo) params.set('dateTo', dateTo)
|
||||||
|
return `${DESA_PLUS_PROXY}/api/monitoring/export-logs?${params}`
|
||||||
|
},
|
||||||
|
getVillageReport: (range: 7 | 30 | 90 = 7) =>
|
||||||
|
`${DESA_PLUS_PROXY}/api/monitoring/village-report?range=${range}`,
|
||||||
|
exportUsers: (search: string, isActive?: string, idUserRole?: string, idVillage?: string) => {
|
||||||
|
const params = new URLSearchParams({ search })
|
||||||
|
if (isActive) params.set('isActive', isActive)
|
||||||
|
if (idUserRole) params.set('idUserRole', idUserRole)
|
||||||
|
if (idVillage) params.set('idVillage', idVillage)
|
||||||
|
return `${DESA_PLUS_PROXY}/api/monitoring/export-users?${params}`
|
||||||
|
},
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -463,27 +463,29 @@ function AppErrorsPage() {
|
|||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<Accordion.Control>
|
<Accordion.Control>
|
||||||
<Group wrap="nowrap">
|
<Group wrap="nowrap" style={{ minWidth: 0 }}>
|
||||||
<ThemeIcon
|
<ThemeIcon
|
||||||
color={STATUS_COLOR[bug.status] ?? 'gray'}
|
color={STATUS_COLOR[bug.status] ?? 'gray'}
|
||||||
variant="light"
|
variant="light"
|
||||||
size="lg"
|
size="lg"
|
||||||
radius="md"
|
radius="md"
|
||||||
|
style={{ flexShrink: 0 }}
|
||||||
>
|
>
|
||||||
<TbAlertTriangle size={20} />
|
<TbAlertTriangle size={20} />
|
||||||
</ThemeIcon>
|
</ThemeIcon>
|
||||||
<Box style={{ flex: 1 }}>
|
<Box style={{ flex: 1, minWidth: 0 }}>
|
||||||
<Group justify="space-between">
|
<Group wrap="nowrap" gap="xs">
|
||||||
<Text size="sm" fw={600} lineClamp={1}>{bug.description}</Text>
|
<Text size="sm" fw={600} lineClamp={1} style={{ flex: 1, minWidth: 0 }}>{bug.description}</Text>
|
||||||
<Badge
|
<Badge
|
||||||
color={STATUS_COLOR[bug.status] ?? 'gray'}
|
color={STATUS_COLOR[bug.status] ?? 'gray'}
|
||||||
variant="dot"
|
variant="dot"
|
||||||
size="sm"
|
size="sm"
|
||||||
|
style={{ flexShrink: 0 }}
|
||||||
>
|
>
|
||||||
{STATUS_LABEL[bug.status] ?? bug.status}
|
{STATUS_LABEL[bug.status] ?? bug.status}
|
||||||
</Badge>
|
</Badge>
|
||||||
</Group>
|
</Group>
|
||||||
<Text size="xs" c="dimmed">
|
<Text size="xs" c="dimmed" lineClamp={1}>
|
||||||
{dayjs(bug.createdAt).format('D MMM YYYY, HH:mm')} · {bug.appId?.toUpperCase()} · v{bug.affectedVersion}
|
{dayjs(bug.createdAt).format('D MMM YYYY, HH:mm')} · {bug.appId?.toUpperCase()} · v{bug.affectedVersion}
|
||||||
</Text>
|
</Text>
|
||||||
</Box>
|
</Box>
|
||||||
|
|||||||
@@ -4,10 +4,15 @@ import { SummaryCard } from '@/frontend/components/SummaryCard'
|
|||||||
import { useSession } from '@/frontend/hooks/useAuth'
|
import { useSession } from '@/frontend/hooks/useAuth'
|
||||||
import {
|
import {
|
||||||
ActionIcon,
|
ActionIcon,
|
||||||
|
Anchor,
|
||||||
Badge,
|
Badge,
|
||||||
Button,
|
Button,
|
||||||
|
Collapse,
|
||||||
|
Divider,
|
||||||
Group,
|
Group,
|
||||||
Modal,
|
Modal,
|
||||||
|
Paper,
|
||||||
|
SegmentedControl,
|
||||||
SimpleGrid,
|
SimpleGrid,
|
||||||
Stack,
|
Stack,
|
||||||
Switch,
|
Switch,
|
||||||
@@ -25,6 +30,9 @@ import {
|
|||||||
TbActivity,
|
TbActivity,
|
||||||
TbAlertTriangle,
|
TbAlertTriangle,
|
||||||
TbBuildingCommunity,
|
TbBuildingCommunity,
|
||||||
|
TbChevronDown,
|
||||||
|
TbChevronUp,
|
||||||
|
TbFileText,
|
||||||
TbRefresh,
|
TbRefresh,
|
||||||
TbVersions,
|
TbVersions,
|
||||||
} from 'react-icons/tb'
|
} from 'react-icons/tb'
|
||||||
@@ -45,6 +53,7 @@ function AppOverviewPage() {
|
|||||||
const { data: session } = useSession()
|
const { data: session } = useSession()
|
||||||
const isDeveloper = session?.user?.role === 'DEVELOPER'
|
const isDeveloper = session?.user?.role === 'DEVELOPER'
|
||||||
const errorTableRef = useRef<ErrorDataTableHandle>(null)
|
const errorTableRef = useRef<ErrorDataTableHandle>(null)
|
||||||
|
const [isExporting, setIsExporting] = useState(false)
|
||||||
|
|
||||||
const [latestVersion, setLatestVersion] = useState('')
|
const [latestVersion, setLatestVersion] = useState('')
|
||||||
const [minVersion, setMinVersion] = useState('')
|
const [minVersion, setMinVersion] = useState('')
|
||||||
@@ -54,12 +63,15 @@ function AppOverviewPage() {
|
|||||||
|
|
||||||
const [dailyRange, setDailyRange] = useState<7 | 30 | 90>(7)
|
const [dailyRange, setDailyRange] = useState<7 | 30 | 90>(7)
|
||||||
const [comparisonRange, setComparisonRange] = useState<7 | 30 | 90>(7)
|
const [comparisonRange, setComparisonRange] = useState<7 | 30 | 90>(7)
|
||||||
|
const [staleDays, setStaleDays] = useState<7 | 14 | 30>(7)
|
||||||
|
const [staleExpanded, { toggle: toggleStale }] = useDisclosure(false)
|
||||||
|
|
||||||
const { data: gridRes, isLoading: gridLoading, mutate: mutateGrid } = useSWR(isDesaPlus ? API_URLS.getGridOverview() : null, fetcher)
|
const { data: gridRes, isLoading: gridLoading, mutate: mutateGrid } = useSWR(isDesaPlus ? API_URLS.getGridOverview() : null, fetcher)
|
||||||
const { data: dailyRes, isLoading: dailyLoading, mutate: mutateDaily } = useSWR(isDesaPlus ? API_URLS.getDailyActivity(dailyRange) : null, fetcher)
|
const { data: dailyRes, isLoading: dailyLoading, mutate: mutateDaily } = useSWR(isDesaPlus ? API_URLS.getDailyActivity(dailyRange) : null, fetcher)
|
||||||
const { data: comparisonRes, isLoading: comparisonLoading, mutate: mutateComparison } = useSWR(isDesaPlus ? API_URLS.getComparisonActivity(comparisonRange) : null, fetcher)
|
const { data: comparisonRes, isLoading: comparisonLoading, mutate: mutateComparison } = useSWR(isDesaPlus ? API_URLS.getComparisonActivity(comparisonRange) : null, fetcher)
|
||||||
|
|
||||||
const { data: appData, isLoading: appLoading } = useSWR(`/api/apps/${appId}`, fetcher)
|
const { data: appData, isLoading: appLoading } = useSWR(`/api/apps/${appId}`, fetcher)
|
||||||
|
const { data: staleRes } = useSWR(isDesaPlus ? API_URLS.getStaleVillages(staleDays) : null, fetcher)
|
||||||
|
|
||||||
const grid = gridRes?.data
|
const grid = gridRes?.data
|
||||||
const dailyData = dailyRes?.data || []
|
const dailyData = dailyRes?.data || []
|
||||||
@@ -120,6 +132,256 @@ function AppOverviewPage() {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const handleDownloadPDF = async () => {
|
||||||
|
setIsExporting(true)
|
||||||
|
try {
|
||||||
|
const [reportRes, peakRes] = await Promise.all([
|
||||||
|
fetch(API_URLS.getVillageReport(comparisonRange as 7 | 30 | 90)).then(r => r.json()),
|
||||||
|
fetch(API_URLS.getPeakHours()).then(r => r.json()),
|
||||||
|
])
|
||||||
|
if (!reportRes.success) return
|
||||||
|
|
||||||
|
const { villages, generatedAt } = reportRes.data
|
||||||
|
const peakHours: { hour: number; label: string; count: number }[] = peakRes?.data?.hours ?? []
|
||||||
|
const peakHour: { label: string; count: number } | null = peakRes?.data?.peak ?? null
|
||||||
|
const appName = isDesaPlus ? 'Desa+' : appId
|
||||||
|
|
||||||
|
// ── Aggregates ─────────────────────────────────────
|
||||||
|
const totalActive = villages.filter((v: any) => v.isActive).length
|
||||||
|
const totalInactive = villages.filter((v: any) => !v.isActive).length
|
||||||
|
const totalStale = villages.filter((v: any) => v.activityCount === 0).length
|
||||||
|
const totalActivity = villages.reduce((s: number, v: any) => s + v.activityCount, 0)
|
||||||
|
const totalActiveUsers = villages.reduce((s: number, v: any) => s + v.activeUsers, 0)
|
||||||
|
const totalInactiveUsers = villages.reduce((s: number, v: any) => s + v.inactiveUsers, 0)
|
||||||
|
|
||||||
|
const top5 = villages.slice(0, 5)
|
||||||
|
const maxActivity = top5[0]?.activityCount || 1
|
||||||
|
const needsAttention = villages.filter((v: any) => !v.isActive || v.activityCount === 0)
|
||||||
|
|
||||||
|
// ── Helpers ────────────────────────────────────────
|
||||||
|
const trendBadge = (trend: number) => {
|
||||||
|
if (trend > 0) return `<span style="color:#059669;font-weight:700">▲ +${trend}%</span>`
|
||||||
|
if (trend < 0) return `<span style="color:#dc2626;font-weight:700">▼ ${trend}%</span>`
|
||||||
|
return `<span style="color:#9ca3af">— 0%</span>`
|
||||||
|
}
|
||||||
|
const statusBadge = (active: boolean) =>
|
||||||
|
`<span style="display:inline-block;padding:2px 8px;border-radius:12px;font-size:11px;font-weight:700;
|
||||||
|
background:${active ? '#d1fae5' : '#fee2e2'};color:${active ? '#065f46' : '#991b1b'}">
|
||||||
|
${active ? 'Active' : 'Inactive'}</span>`
|
||||||
|
const lastActivityCell = (v: any) => v.lastActivity
|
||||||
|
? `${v.lastActivity}<br><span style="color:${v.daysSince > 30 ? '#dc2626' : v.daysSince > 7 ? '#d97706' : '#059669'}">${v.daysSince}d ago</span>`
|
||||||
|
: '<span style="color:#999">No activity</span>'
|
||||||
|
|
||||||
|
// ── Section: Top 5 ────────────────────────────────
|
||||||
|
const top5Rows = top5.map((v: any, i: number) => `
|
||||||
|
<tr style="background:${i % 2 === 0 ? '#fff' : '#f9fafb'}">
|
||||||
|
<td style="text-align:center;font-weight:800;font-size:14px;color:${i === 0 ? '#d97706' : i === 1 ? '#6b7280' : i === 2 ? '#b45309' : '#374151'}">
|
||||||
|
${i === 0 ? '🥇' : i === 1 ? '🥈' : i === 2 ? '🥉' : `#${i + 1}`}
|
||||||
|
</td>
|
||||||
|
<td><strong>${v.name}</strong></td>
|
||||||
|
<td style="width:35%">
|
||||||
|
<div style="background:#e5e7eb;border-radius:4px;height:10px;overflow:hidden">
|
||||||
|
<div style="width:${Math.round((v.activityCount / maxActivity) * 100)}%;height:100%;background:${i === 0 ? '#d97706' : '#3b82f6'};border-radius:4px"></div>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
<td style="text-align:right;font-weight:700">${v.activityCount.toLocaleString()}</td>
|
||||||
|
<td style="text-align:center">${trendBadge(v.trend)}</td>
|
||||||
|
</tr>`).join('')
|
||||||
|
|
||||||
|
// ── Section: Needs Attention ───────────────────────
|
||||||
|
const attentionRows = needsAttention.length === 0
|
||||||
|
? '<tr><td colspan="5" style="text-align:center;color:#9ca3af;padding:16px">All villages are active and have activity in this period.</td></tr>'
|
||||||
|
: needsAttention.map((v: any, i: number) => `
|
||||||
|
<tr style="background:${i % 2 === 0 ? '#fff' : '#f9fafb'}">
|
||||||
|
<td>${v.name}</td>
|
||||||
|
<td style="text-align:center">${statusBadge(v.isActive)}</td>
|
||||||
|
<td style="text-align:center">${v.activeUsers + v.inactiveUsers}</td>
|
||||||
|
<td style="text-align:center">
|
||||||
|
${!v.isActive
|
||||||
|
? '<span style="color:#dc2626;font-weight:700">Village inactive</span>'
|
||||||
|
: '<span style="color:#d97706;font-weight:700">No activity in period</span>'}
|
||||||
|
</td>
|
||||||
|
<td style="text-align:center;font-size:11px">${lastActivityCell(v)}</td>
|
||||||
|
</tr>`).join('')
|
||||||
|
|
||||||
|
// ── Section: All Villages ─────────────────────────
|
||||||
|
const allRows = villages.map((v: any, i: number) => `
|
||||||
|
<tr style="background:${i % 2 === 0 ? '#fff' : '#f9fafb'}">
|
||||||
|
<td style="text-align:center;color:#9ca3af">${i + 1}</td>
|
||||||
|
<td>
|
||||||
|
<strong>${v.name}</strong>
|
||||||
|
${v.perbekel !== '-' ? `<br><span style="font-size:10px;color:#9ca3af">Perbekel: ${v.perbekel}</span>` : ''}
|
||||||
|
</td>
|
||||||
|
<td style="text-align:center">${statusBadge(v.isActive)}</td>
|
||||||
|
<td style="text-align:center">${v.activeUsers}</td>
|
||||||
|
<td style="text-align:center">${v.inactiveUsers}</td>
|
||||||
|
<td style="text-align:right;font-weight:700">${v.activityCount.toLocaleString()}</td>
|
||||||
|
<td style="text-align:center">${trendBadge(v.trend)}</td>
|
||||||
|
<td style="text-align:center;font-size:11px">${lastActivityCell(v)}</td>
|
||||||
|
</tr>`).join('')
|
||||||
|
|
||||||
|
// ── Section: Peak Hours ───────────────────────────
|
||||||
|
const peakMax = Math.max(...peakHours.map(h => h.count), 1)
|
||||||
|
const peakRows = peakHours.filter(h => h.count > 0).map((h, i) => `
|
||||||
|
<tr style="background:${i % 2 === 0 ? '#fff' : '#f9fafb'}">
|
||||||
|
<td style="font-weight:700;width:80px">${h.label}</td>
|
||||||
|
<td>
|
||||||
|
<div style="background:#e5e7eb;border-radius:4px;height:8px;overflow:hidden">
|
||||||
|
<div style="width:${Math.round((h.count / peakMax) * 100)}%;height:100%;background:#7c3aed;border-radius:4px"></div>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
<td style="text-align:right;width:80px;font-weight:600">${h.count.toLocaleString()}</td>
|
||||||
|
</tr>`).join('')
|
||||||
|
|
||||||
|
// ── Build HTML ────────────────────────────────────
|
||||||
|
const html = `<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8"/>
|
||||||
|
<title>${appName} — Village Report</title>
|
||||||
|
<style>
|
||||||
|
* { box-sizing: border-box; margin: 0; padding: 0; }
|
||||||
|
body { font-family: Arial, sans-serif; color: #111; background: #fff; font-size: 12px; }
|
||||||
|
.cover { background: linear-gradient(135deg, #1d4ed8, #7c3aed); color: white; padding: 36px 40px 28px; }
|
||||||
|
.cover h1 { font-size: 26px; font-weight: 800; margin-bottom: 6px; }
|
||||||
|
.cover p { font-size: 12px; opacity: 0.8; margin-top: 4px; }
|
||||||
|
.summary { display: grid; grid-template-columns: repeat(6, 1fr); border-bottom: 2px solid #e5e7eb; }
|
||||||
|
.summary-card { padding: 14px 16px; border-right: 1px solid #e5e7eb; }
|
||||||
|
.summary-card:last-child { border-right: none; }
|
||||||
|
.summary-card .label { font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: #6b7280; margin-bottom: 4px; }
|
||||||
|
.summary-card .value { font-size: 24px; font-weight: 800; }
|
||||||
|
.summary-card .sub { font-size: 10px; color: #9ca3af; margin-top: 2px; }
|
||||||
|
.section { padding: 20px 32px; border-bottom: 1px solid #f3f4f6; }
|
||||||
|
.section h2 { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: #6b7280; padding-bottom: 8px; border-bottom: 2px solid #e5e7eb; margin-bottom: 14px; }
|
||||||
|
table { width: 100%; border-collapse: collapse; }
|
||||||
|
th { font-size: 9px; font-weight: 700; text-transform: uppercase; color: #6b7280; padding: 7px 10px; border-bottom: 2px solid #e5e7eb; text-align: left; background: #f9fafb; }
|
||||||
|
td { padding: 8px 10px; border-bottom: 1px solid #f3f4f6; vertical-align: middle; line-height: 1.4; }
|
||||||
|
.two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
|
||||||
|
.footer { padding: 14px 32px; border-top: 2px solid #e5e7eb; font-size: 10px; color: #9ca3af; text-align: center; }
|
||||||
|
@media print { body { -webkit-print-color-adjust: exact; print-color-adjust: exact; } .section { page-break-inside: avoid; } }
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<div class="cover">
|
||||||
|
<h1>${appName} — Village Monitoring Report</h1>
|
||||||
|
<p>Generated: ${generatedAt}</p>
|
||||||
|
<p>Period: last ${comparisonRange} days · Compared to previous ${comparisonRange} days</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="summary">
|
||||||
|
<div class="summary-card">
|
||||||
|
<div class="label">Active Villages</div>
|
||||||
|
<div class="value" style="color:#059669">${totalActive}</div>
|
||||||
|
<div class="sub">of ${villages.length} total</div>
|
||||||
|
</div>
|
||||||
|
<div class="summary-card">
|
||||||
|
<div class="label">Inactive Villages</div>
|
||||||
|
<div class="value" style="color:#dc2626">${totalInactive}</div>
|
||||||
|
<div class="sub">not operational</div>
|
||||||
|
</div>
|
||||||
|
<div class="summary-card">
|
||||||
|
<div class="label">No Activity</div>
|
||||||
|
<div class="value" style="color:#d97706">${totalStale}</div>
|
||||||
|
<div class="sub">in this period</div>
|
||||||
|
</div>
|
||||||
|
<div class="summary-card">
|
||||||
|
<div class="label">Total Activity</div>
|
||||||
|
<div class="value">${totalActivity.toLocaleString()}</div>
|
||||||
|
<div class="sub">last ${comparisonRange} days</div>
|
||||||
|
</div>
|
||||||
|
<div class="summary-card">
|
||||||
|
<div class="label">Active Users</div>
|
||||||
|
<div class="value" style="color:#0891b2">${totalActiveUsers.toLocaleString()}</div>
|
||||||
|
<div class="sub">across all villages</div>
|
||||||
|
</div>
|
||||||
|
<div class="summary-card">
|
||||||
|
<div class="label">Inactive Users</div>
|
||||||
|
<div class="value" style="color:#6b7280">${totalInactiveUsers.toLocaleString()}</div>
|
||||||
|
<div class="sub">across all villages</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="section">
|
||||||
|
<div class="two-col">
|
||||||
|
<div>
|
||||||
|
<h2>Top 5 Most Active Villages</h2>
|
||||||
|
<table>
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<th style="width:6%">#</th>
|
||||||
|
<th>Village</th>
|
||||||
|
<th style="width:30%">Activity</th>
|
||||||
|
<th style="text-align:right;width:10%">Count</th>
|
||||||
|
<th style="text-align:center;width:14%">vs Prev</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>${top5Rows}</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<h2>Peak Activity Hours</h2>
|
||||||
|
${peakHour ? `<p style="font-size:11px;color:#6b7280;margin-bottom:10px">Busiest hour: <strong>${peakHour.label}</strong> (${peakHour.count.toLocaleString()} activities)</p>` : ''}
|
||||||
|
<table>
|
||||||
|
<thead><tr><th>Hour</th><th>Distribution</th><th style="text-align:right">Count</th></tr></thead>
|
||||||
|
<tbody>${peakRows || '<tr><td colspan="3" style="text-align:center;color:#9ca3af">No data</td></tr>'}</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="section">
|
||||||
|
<h2>Villages Needing Attention (${needsAttention.length})</h2>
|
||||||
|
${needsAttention.length === 0
|
||||||
|
? '<p style="color:#9ca3af;font-size:11px">All villages are active and have activity in this period.</p>'
|
||||||
|
: `<table>
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<th>Village</th>
|
||||||
|
<th style="text-align:center">Status</th>
|
||||||
|
<th style="text-align:center">Total Users</th>
|
||||||
|
<th>Reason</th>
|
||||||
|
<th style="text-align:center">Last Activity</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>${attentionRows}</tbody>
|
||||||
|
</table>`}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="section">
|
||||||
|
<h2>All Villages — ${villages.length} Villages</h2>
|
||||||
|
<table>
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<th style="width:3%;text-align:center">#</th>
|
||||||
|
<th style="width:22%">Village / Perbekel</th>
|
||||||
|
<th style="width:9%;text-align:center">Status</th>
|
||||||
|
<th style="width:8%;text-align:center">Active Users</th>
|
||||||
|
<th style="width:8%;text-align:center">Inactive Users</th>
|
||||||
|
<th style="width:10%;text-align:right">Activity (${comparisonRange}D)</th>
|
||||||
|
<th style="width:10%;text-align:center">vs Prev Period</th>
|
||||||
|
<th style="width:18%;text-align:center">Last Activity</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>${allRows}</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="footer">
|
||||||
|
${appName} Monitoring System · ${generatedAt} · ${villages.length} villages · Period: last ${comparisonRange} days
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script>window.onload = () => window.print()<\/script>
|
||||||
|
</body>
|
||||||
|
</html>`
|
||||||
|
|
||||||
|
const win = window.open('', '_blank')
|
||||||
|
if (win) { win.document.write(html); win.document.close() }
|
||||||
|
} finally {
|
||||||
|
setIsExporting(false)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
const maintenanceOn = grid?.version?.mobile_maintenance === 'true'
|
const maintenanceOn = grid?.version?.mobile_maintenance === 'true'
|
||||||
|
|
||||||
return (
|
return (
|
||||||
@@ -179,18 +441,34 @@ function AppOverviewPage() {
|
|||||||
Real-time metrics and activity for {isDesaPlus ? 'Desa+' : appId}.
|
Real-time metrics and activity for {isDesaPlus ? 'Desa+' : appId}.
|
||||||
</Text>
|
</Text>
|
||||||
</Stack>
|
</Stack>
|
||||||
<Tooltip label="Refresh data" withArrow>
|
<Group gap="xs">
|
||||||
<ActionIcon
|
{isDesaPlus && (
|
||||||
variant="light"
|
<Button
|
||||||
color="brand-blue"
|
variant="light"
|
||||||
size="lg"
|
color="gray"
|
||||||
radius="md"
|
size="sm"
|
||||||
onClick={handleRefresh}
|
radius="md"
|
||||||
loading={gridLoading || dailyLoading || comparisonLoading}
|
leftSection={<TbFileText size={16} />}
|
||||||
>
|
onClick={handleDownloadPDF}
|
||||||
<TbRefresh size={18} />
|
loading={isExporting}
|
||||||
</ActionIcon>
|
disabled={gridLoading || !grid}
|
||||||
</Tooltip>
|
>
|
||||||
|
Download PDF
|
||||||
|
</Button>
|
||||||
|
)}
|
||||||
|
<Tooltip label="Refresh data" withArrow>
|
||||||
|
<ActionIcon
|
||||||
|
variant="light"
|
||||||
|
color="brand-blue"
|
||||||
|
size="lg"
|
||||||
|
radius="md"
|
||||||
|
onClick={handleRefresh}
|
||||||
|
loading={gridLoading || dailyLoading || comparisonLoading}
|
||||||
|
>
|
||||||
|
<TbRefresh size={18} />
|
||||||
|
</ActionIcon>
|
||||||
|
</Tooltip>
|
||||||
|
</Group>
|
||||||
</Group>
|
</Group>
|
||||||
|
|
||||||
<SimpleGrid cols={{ base: 1, sm: 2, lg: 4 }} spacing="lg">
|
<SimpleGrid cols={{ base: 1, sm: 2, lg: 4 }} spacing="lg">
|
||||||
@@ -248,6 +526,62 @@ function AppOverviewPage() {
|
|||||||
/>
|
/>
|
||||||
</SimpleGrid>
|
</SimpleGrid>
|
||||||
|
|
||||||
|
{isDesaPlus && staleRes?.data?.count > 0 && (
|
||||||
|
<Paper
|
||||||
|
withBorder
|
||||||
|
radius="xl"
|
||||||
|
className="glass"
|
||||||
|
p="md"
|
||||||
|
style={{ borderColor: 'var(--mantine-color-orange-7)' }}
|
||||||
|
>
|
||||||
|
<Group justify="space-between" wrap="nowrap">
|
||||||
|
<Group gap="sm" wrap="nowrap">
|
||||||
|
<TbAlertTriangle size={18} color="var(--mantine-color-orange-5)" style={{ flexShrink: 0 }} />
|
||||||
|
<Text fw={700} size="sm" c="orange.4">
|
||||||
|
{staleRes.data.count} {staleRes.data.count === 1 ? 'village' : 'villages'} with no activity in the last {staleDays} days
|
||||||
|
</Text>
|
||||||
|
</Group>
|
||||||
|
<Group gap="xs" wrap="nowrap">
|
||||||
|
<SegmentedControl
|
||||||
|
size="xs"
|
||||||
|
value={String(staleDays)}
|
||||||
|
onChange={(v) => setStaleDays(Number(v) as 7 | 14 | 30)}
|
||||||
|
data={[
|
||||||
|
{ label: '7D', value: '7' },
|
||||||
|
{ label: '14D', value: '14' },
|
||||||
|
{ label: '30D', value: '30' },
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ActionIcon variant="subtle" color="gray" size="sm" onClick={toggleStale}>
|
||||||
|
{staleExpanded ? <TbChevronUp size={15} /> : <TbChevronDown size={15} />}
|
||||||
|
</ActionIcon>
|
||||||
|
</Group>
|
||||||
|
</Group>
|
||||||
|
|
||||||
|
<Collapse in={staleExpanded}>
|
||||||
|
<Divider my="sm" opacity={0.2} />
|
||||||
|
<Stack gap={6}>
|
||||||
|
{staleRes.data.villages.map((v: { id: string; name: string; daysSince: number | null }) => (
|
||||||
|
<Group key={v.id} justify="space-between" wrap="nowrap">
|
||||||
|
<Anchor
|
||||||
|
size="sm"
|
||||||
|
fw={500}
|
||||||
|
c="dimmed"
|
||||||
|
onClick={() => navigate({ to: `/apps/${appId}/villages/${v.id}` })}
|
||||||
|
style={{ cursor: 'pointer' }}
|
||||||
|
>
|
||||||
|
{v.name}
|
||||||
|
</Anchor>
|
||||||
|
<Text size="xs" c="orange.6" fw={600}>
|
||||||
|
{v.daysSince === null ? 'No activity yet' : `${v.daysSince}d ago`}
|
||||||
|
</Text>
|
||||||
|
</Group>
|
||||||
|
))}
|
||||||
|
</Stack>
|
||||||
|
</Collapse>
|
||||||
|
</Paper>
|
||||||
|
)}
|
||||||
|
|
||||||
<Group justify="space-between" align="flex-end">
|
<Group justify="space-between" align="flex-end">
|
||||||
<Stack gap={2}>
|
<Stack gap={2}>
|
||||||
<Title order={4}>Analytics</Title>
|
<Title order={4}>Analytics</Title>
|
||||||
@@ -259,7 +593,6 @@ function AppOverviewPage() {
|
|||||||
<VillageActivityLineChart data={dailyData} isLoading={dailyLoading} range={dailyRange} onRangeChange={setDailyRange} />
|
<VillageActivityLineChart data={dailyData} isLoading={dailyLoading} range={dailyRange} onRangeChange={setDailyRange} />
|
||||||
<VillageComparisonBarChart data={comparisonData} isLoading={comparisonLoading} range={comparisonRange} onRangeChange={setComparisonRange} />
|
<VillageComparisonBarChart data={comparisonData} isLoading={comparisonLoading} range={comparisonRange} onRangeChange={setComparisonRange} />
|
||||||
</SimpleGrid>
|
</SimpleGrid>
|
||||||
|
|
||||||
<ErrorDataTable ref={errorTableRef} appId={appId} />
|
<ErrorDataTable ref={errorTableRef} appId={appId} />
|
||||||
</Stack>
|
</Stack>
|
||||||
</>
|
</>
|
||||||
|
|||||||
@@ -2,8 +2,10 @@ import { useEffect, useState } from 'react'
|
|||||||
import useSWR from 'swr'
|
import useSWR from 'swr'
|
||||||
import {
|
import {
|
||||||
ActionIcon,
|
ActionIcon,
|
||||||
|
Anchor,
|
||||||
Avatar,
|
Avatar,
|
||||||
Badge,
|
Badge,
|
||||||
|
Button,
|
||||||
Code,
|
Code,
|
||||||
Group,
|
Group,
|
||||||
Loader,
|
Loader,
|
||||||
@@ -20,10 +22,11 @@ import {
|
|||||||
} from '@mantine/core'
|
} from '@mantine/core'
|
||||||
import { useDebouncedValue, useMediaQuery } from '@mantine/hooks'
|
import { useDebouncedValue, useMediaQuery } from '@mantine/hooks'
|
||||||
import { DatePickerInput } from '@mantine/dates'
|
import { DatePickerInput } from '@mantine/dates'
|
||||||
import { createFileRoute, useParams } from '@tanstack/react-router'
|
import { createFileRoute, useNavigate, useParams } from '@tanstack/react-router'
|
||||||
import {
|
import {
|
||||||
TbAlertCircle,
|
TbAlertCircle,
|
||||||
TbCalendar,
|
TbCalendar,
|
||||||
|
TbDownload,
|
||||||
TbHistory,
|
TbHistory,
|
||||||
TbHome2,
|
TbHome2,
|
||||||
TbSearch,
|
TbSearch,
|
||||||
@@ -42,6 +45,7 @@ interface LogEntry {
|
|||||||
desc: string
|
desc: string
|
||||||
username: string
|
username: string
|
||||||
village: string
|
village: string
|
||||||
|
idVillage: string
|
||||||
}
|
}
|
||||||
|
|
||||||
const fetcher = (url: string) => fetch(url).then((res) => res.json())
|
const fetcher = (url: string) => fetch(url).then((res) => res.json())
|
||||||
@@ -81,6 +85,7 @@ function LogTimestamp({ value }: { value: string }) {
|
|||||||
|
|
||||||
function AppLogsPage() {
|
function AppLogsPage() {
|
||||||
const { appId } = useParams({ from: '/apps/$appId/logs' })
|
const { appId } = useParams({ from: '/apps/$appId/logs' })
|
||||||
|
const navigate = useNavigate()
|
||||||
const [page, setPage] = useState(1)
|
const [page, setPage] = useState(1)
|
||||||
const [search, setSearch] = useState('')
|
const [search, setSearch] = useState('')
|
||||||
const [searchQuery, setSearchQuery] = useState('')
|
const [searchQuery, setSearchQuery] = useState('')
|
||||||
@@ -92,6 +97,41 @@ function AppLogsPage() {
|
|||||||
|
|
||||||
const isDesaPlus = appId === 'desa-plus'
|
const isDesaPlus = appId === 'desa-plus'
|
||||||
const isMobile = useMediaQuery('(max-width: 768px)')
|
const isMobile = useMediaQuery('(max-width: 768px)')
|
||||||
|
const [isExporting, setIsExporting] = useState(false)
|
||||||
|
|
||||||
|
const handleExportCSV = async () => {
|
||||||
|
setIsExporting(true)
|
||||||
|
try {
|
||||||
|
const res = await fetch(API_URLS.exportLogs(
|
||||||
|
searchQuery,
|
||||||
|
filterAction ?? undefined,
|
||||||
|
filterVillageId ?? undefined,
|
||||||
|
dateFrom ?? undefined,
|
||||||
|
dateTo ?? undefined,
|
||||||
|
))
|
||||||
|
const json = await res.json()
|
||||||
|
if (!json.success || !json.data?.length) return
|
||||||
|
|
||||||
|
const headers = ['Timestamp', 'User', 'Village', 'Action', 'Description']
|
||||||
|
const rows = json.data.map((r: any) => [
|
||||||
|
r.timestamp,
|
||||||
|
r.username,
|
||||||
|
r.village,
|
||||||
|
r.action,
|
||||||
|
`"${(r.desc ?? '').replace(/"/g, '""')}"`,
|
||||||
|
])
|
||||||
|
const csv = [headers.join(','), ...rows.map((r: string[]) => r.join(','))].join('\n')
|
||||||
|
const blob = new Blob([csv], { type: 'text/csv;charset=utf-8;' })
|
||||||
|
const url = URL.createObjectURL(blob)
|
||||||
|
const a = document.createElement('a')
|
||||||
|
a.href = url
|
||||||
|
a.download = `activity-logs-${new Date().toISOString().slice(0, 10)}.csv`
|
||||||
|
a.click()
|
||||||
|
URL.revokeObjectURL(url)
|
||||||
|
} finally {
|
||||||
|
setIsExporting(false)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
const [dateFrom, dateTo] = dateRange
|
const [dateFrom, dateTo] = dateRange
|
||||||
const apiUrl = isDesaPlus
|
const apiUrl = isDesaPlus
|
||||||
@@ -153,6 +193,17 @@ function AppLogsPage() {
|
|||||||
: `${(response?.data?.total ?? 0).toLocaleString()} events across all villages`}
|
: `${(response?.data?.total ?? 0).toLocaleString()} events across all villages`}
|
||||||
</Text>
|
</Text>
|
||||||
</Stack>
|
</Stack>
|
||||||
|
<Button
|
||||||
|
variant="light"
|
||||||
|
color="teal"
|
||||||
|
size="sm"
|
||||||
|
leftSection={<TbDownload size={16} />}
|
||||||
|
onClick={handleExportCSV}
|
||||||
|
loading={isExporting}
|
||||||
|
disabled={isLoading || !logs.length}
|
||||||
|
>
|
||||||
|
Export CSV
|
||||||
|
</Button>
|
||||||
</Group>
|
</Group>
|
||||||
|
|
||||||
<Paper withBorder p="md" className="glass">
|
<Paper withBorder p="md" className="glass">
|
||||||
@@ -272,7 +323,15 @@ function AppLogsPage() {
|
|||||||
</Group>
|
</Group>
|
||||||
<Group gap={6} wrap="nowrap">
|
<Group gap={6} wrap="nowrap">
|
||||||
<TbHome2 size={12} color="gray" />
|
<TbHome2 size={12} color="gray" />
|
||||||
<Text size="xs" c="dimmed" truncate="end">{log.village}</Text>
|
<Anchor
|
||||||
|
size="xs"
|
||||||
|
c="dimmed"
|
||||||
|
truncate="end"
|
||||||
|
onClick={() => navigate({ to: `/apps/${appId}/villages/${log.idVillage}` })}
|
||||||
|
style={{ cursor: 'pointer' }}
|
||||||
|
>
|
||||||
|
{log.village}
|
||||||
|
</Anchor>
|
||||||
</Group>
|
</Group>
|
||||||
</Stack>
|
</Stack>
|
||||||
</Table.Td>
|
</Table.Td>
|
||||||
|
|||||||
@@ -34,6 +34,8 @@ import {
|
|||||||
TbBriefcase,
|
TbBriefcase,
|
||||||
TbCircleCheck,
|
TbCircleCheck,
|
||||||
TbCircleX,
|
TbCircleX,
|
||||||
|
TbClock,
|
||||||
|
TbDownload,
|
||||||
TbHome2,
|
TbHome2,
|
||||||
TbId,
|
TbId,
|
||||||
TbMail,
|
TbMail,
|
||||||
@@ -68,6 +70,7 @@ interface APIUser {
|
|||||||
idVillage: string
|
idVillage: string
|
||||||
idGroup: string
|
idGroup: string
|
||||||
idPosition: string
|
idPosition: string
|
||||||
|
lastActivity: string | null
|
||||||
}
|
}
|
||||||
|
|
||||||
interface BaseUserForm {
|
interface BaseUserForm {
|
||||||
@@ -97,6 +100,15 @@ const REQUIRED_FIELDS = ['name', 'nik', 'phone', 'email', 'gender', 'idUserRole'
|
|||||||
|
|
||||||
const fetcher = (url: string) => fetch(url).then((res) => res.json())
|
const fetcher = (url: string) => fetch(url).then((res) => res.json())
|
||||||
|
|
||||||
|
function getLastActivityInfo(lastActivity: string | null): { label: string; color: string } {
|
||||||
|
if (!lastActivity) return { label: 'Never', color: 'gray' }
|
||||||
|
const days = Math.floor((Date.now() - new Date(lastActivity).getTime()) / (1000 * 60 * 60 * 24))
|
||||||
|
if (days < 1) return { label: 'Today', color: 'teal' }
|
||||||
|
if (days < 7) return { label: `${days}d ago`, color: 'teal' }
|
||||||
|
if (days <= 30) return { label: `${days}d ago`, color: 'yellow' }
|
||||||
|
return { label: `${days}d ago`, color: 'red' }
|
||||||
|
}
|
||||||
|
|
||||||
interface UserFormFieldsProps {
|
interface UserFormFieldsProps {
|
||||||
values: BaseUserForm
|
values: BaseUserForm
|
||||||
onChange: (updates: Partial<BaseUserForm>) => void
|
onChange: (updates: Partial<BaseUserForm>) => void
|
||||||
@@ -229,6 +241,7 @@ function UsersIndexPage() {
|
|||||||
const [filterRole, setFilterRole] = useState<string | null>(null)
|
const [filterRole, setFilterRole] = useState<string | null>(null)
|
||||||
const [filterVillageSearch, setFilterVillageSearch] = useState('')
|
const [filterVillageSearch, setFilterVillageSearch] = useState('')
|
||||||
const [filterVillageId, setFilterVillageId] = useState<string | null>(null)
|
const [filterVillageId, setFilterVillageId] = useState<string | null>(null)
|
||||||
|
const [filterInactiveDays, setFilterInactiveDays] = useState<string | null>(null)
|
||||||
const [sortBy, setSortBy] = useState<string | null>(null)
|
const [sortBy, setSortBy] = useState<string | null>(null)
|
||||||
const [sortDir, setSortDir] = useState<'asc' | 'desc'>('asc')
|
const [sortDir, setSortDir] = useState<'asc' | 'desc'>('asc')
|
||||||
|
|
||||||
@@ -243,22 +256,21 @@ function UsersIndexPage() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const isDesaPlus = appId === 'desa-plus'
|
const isDesaPlus = appId === 'desa-plus'
|
||||||
|
const isInactiveMode = !!filterInactiveDays
|
||||||
|
|
||||||
const filterStatusParam = filterStatus === 'active' ? 'true' : filterStatus === 'inactive' ? 'false' : undefined
|
const filterStatusParam = filterStatus === 'active' ? 'true' : filterStatus === 'inactive' ? 'false' : undefined
|
||||||
const apiUrl = isDesaPlus
|
const apiUrl = isDesaPlus
|
||||||
? API_URLS.getUsers(
|
? isInactiveMode
|
||||||
page,
|
? API_URLS.getInactiveUsers(Number(filterInactiveDays) as 7 | 14 | 30, filterVillageId ?? undefined, page)
|
||||||
searchQuery,
|
: API_URLS.getUsers(page, searchQuery, filterStatusParam, filterRole ?? undefined, filterVillageId ?? undefined, sortBy ?? undefined, sortBy ? sortDir : undefined)
|
||||||
filterStatusParam,
|
|
||||||
filterRole ?? undefined,
|
|
||||||
filterVillageId ?? undefined,
|
|
||||||
sortBy ?? undefined,
|
|
||||||
sortBy ? sortDir : undefined,
|
|
||||||
)
|
|
||||||
: null
|
: null
|
||||||
|
|
||||||
const { data: response, error, isLoading, mutate } = useSWR(apiUrl, fetcher)
|
const { data: response, error, isLoading, mutate } = useSWR(apiUrl, fetcher)
|
||||||
const users: APIUser[] = response?.data?.user || []
|
const users: APIUser[] = isInactiveMode
|
||||||
|
? (response?.data?.users || [])
|
||||||
|
: (response?.data?.user || [])
|
||||||
|
const totalPages = response?.data?.totalPage ?? 0
|
||||||
|
const totalUsers = response?.data?.total ?? 0
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (debouncedSearch.length >= 3 || debouncedSearch.length === 0) {
|
if (debouncedSearch.length >= 3 || debouncedSearch.length === 0) {
|
||||||
@@ -269,7 +281,7 @@ function UsersIndexPage() {
|
|||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
setPage(1)
|
setPage(1)
|
||||||
}, [filterStatus, filterRole, filterVillageId])
|
}, [filterStatus, filterRole, filterVillageId, filterInactiveDays])
|
||||||
|
|
||||||
const handleClearSearch = () => {
|
const handleClearSearch = () => {
|
||||||
setSearch('')
|
setSearch('')
|
||||||
@@ -465,6 +477,47 @@ function UsersIndexPage() {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const [isExporting, setIsExporting] = useState(false)
|
||||||
|
|
||||||
|
const handleExportCSV = async () => {
|
||||||
|
setIsExporting(true)
|
||||||
|
try {
|
||||||
|
const res = await fetch(API_URLS.exportUsers(
|
||||||
|
searchQuery,
|
||||||
|
filterStatusParam,
|
||||||
|
filterRole ?? undefined,
|
||||||
|
filterVillageId ?? undefined,
|
||||||
|
))
|
||||||
|
const json = await res.json()
|
||||||
|
if (!json.success || !json.data?.length) return
|
||||||
|
|
||||||
|
const headers = ['Name', 'NIK', 'Email', 'Phone', 'Gender', 'Role', 'Village', 'Group', 'Position', 'Status', 'Last Activity']
|
||||||
|
const rows = json.data.map((r: any) => [
|
||||||
|
`"${(r.name ?? '').replace(/"/g, '""')}"`,
|
||||||
|
r.nik,
|
||||||
|
r.email,
|
||||||
|
r.phone,
|
||||||
|
r.gender,
|
||||||
|
r.role,
|
||||||
|
`"${(r.village ?? '').replace(/"/g, '""')}"`,
|
||||||
|
`"${(r.group ?? '').replace(/"/g, '""')}"`,
|
||||||
|
`"${(r.position ?? '').replace(/"/g, '""')}"`,
|
||||||
|
r.status,
|
||||||
|
r.lastActivity,
|
||||||
|
])
|
||||||
|
const csv = [headers.join(','), ...rows.map((r: string[]) => r.join(','))].join('\n')
|
||||||
|
const blob = new Blob([csv], { type: 'text/csv;charset=utf-8;' })
|
||||||
|
const url = URL.createObjectURL(blob)
|
||||||
|
const a = document.createElement('a')
|
||||||
|
a.href = url
|
||||||
|
a.download = `users-${new Date().toISOString().slice(0, 10)}.csv`
|
||||||
|
a.click()
|
||||||
|
URL.revokeObjectURL(url)
|
||||||
|
} finally {
|
||||||
|
setIsExporting(false)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
const getRoleColor = (role: string) => {
|
const getRoleColor = (role: string) => {
|
||||||
const r = role.toLowerCase()
|
const r = role.toLowerCase()
|
||||||
if (r.includes('super')) return 'red'
|
if (r.includes('super')) return 'red'
|
||||||
@@ -513,7 +566,6 @@ function UsersIndexPage() {
|
|||||||
onChange={(updates) => setForm((f) => ({ ...f, ...updates }))}
|
onChange={(updates) => setForm((f) => ({ ...f, ...updates }))}
|
||||||
{...sharedFormProps}
|
{...sharedFormProps}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<Button
|
<Button
|
||||||
fullWidth
|
fullWidth
|
||||||
mt="lg"
|
mt="lg"
|
||||||
@@ -586,40 +638,64 @@ function UsersIndexPage() {
|
|||||||
<Stack gap={4}>
|
<Stack gap={4}>
|
||||||
<Title order={3}>User Management</Title>
|
<Title order={3}>User Management</Title>
|
||||||
<Text size="sm" c="dimmed">
|
<Text size="sm" c="dimmed">
|
||||||
{isLoading ? 'Loading users...' : `${response?.data?.total ?? 0} users registered in the Desa+ system`}
|
{isLoading
|
||||||
|
? 'Loading users...'
|
||||||
|
: isInactiveMode
|
||||||
|
? `${totalUsers} users with no activity in the last ${filterInactiveDays} days`
|
||||||
|
: `${totalUsers} users registered in the Desa+ system`}
|
||||||
</Text>
|
</Text>
|
||||||
</Stack>
|
</Stack>
|
||||||
<Button
|
<Group gap="sm">
|
||||||
variant="gradient"
|
<Button
|
||||||
gradient={{ from: '#2563EB', to: '#7C3AED', deg: 135 }}
|
variant="light"
|
||||||
leftSection={<TbPlus size={18} />}
|
color="teal"
|
||||||
size="sm"
|
size="sm"
|
||||||
onClick={open}
|
leftSection={<TbDownload size={16} />}
|
||||||
>
|
onClick={handleExportCSV}
|
||||||
Add User
|
loading={isExporting}
|
||||||
</Button>
|
disabled={isLoading || !users.length}
|
||||||
|
>
|
||||||
|
Export CSV
|
||||||
|
</Button>
|
||||||
|
<Button
|
||||||
|
variant="gradient"
|
||||||
|
gradient={{ from: '#2563EB', to: '#7C3AED', deg: 135 }}
|
||||||
|
leftSection={<TbPlus size={18} />}
|
||||||
|
size="sm"
|
||||||
|
onClick={open}
|
||||||
|
>
|
||||||
|
Add User
|
||||||
|
</Button>
|
||||||
|
</Group>
|
||||||
</Group>
|
</Group>
|
||||||
|
|
||||||
{/* Search / Filter */}
|
{/* Filter */}
|
||||||
<Paper withBorder p="md" className="glass">
|
<Paper withBorder p="md" className="glass">
|
||||||
<Stack gap="sm">
|
<Stack gap="sm">
|
||||||
<TextInput
|
<Tooltip
|
||||||
placeholder="Search name, NIK, or email... (min. 3 characters)"
|
label="Search is disabled when Inactive filter is active"
|
||||||
leftSection={<TbSearch size={16} />}
|
disabled={!isInactiveMode}
|
||||||
size="sm"
|
withArrow
|
||||||
rightSection={
|
>
|
||||||
search ? (
|
<TextInput
|
||||||
<Tooltip label="Clear search" withArrow>
|
placeholder="Search name, NIK, or email... (min. 3 characters)"
|
||||||
<ActionIcon variant="transparent" color="gray" onClick={handleClearSearch} size="sm">
|
leftSection={<TbSearch size={16} />}
|
||||||
<TbX size={16} />
|
size="sm"
|
||||||
</ActionIcon>
|
disabled={isInactiveMode}
|
||||||
</Tooltip>
|
rightSection={
|
||||||
) : null
|
search ? (
|
||||||
}
|
<Tooltip label="Clear search" withArrow>
|
||||||
value={search}
|
<ActionIcon variant="transparent" color="gray" onClick={handleClearSearch} size="sm">
|
||||||
onChange={(e) => setSearch(e.currentTarget.value)}
|
<TbX size={16} />
|
||||||
radius="md"
|
</ActionIcon>
|
||||||
/>
|
</Tooltip>
|
||||||
|
) : null
|
||||||
|
}
|
||||||
|
value={search}
|
||||||
|
onChange={(e) => setSearch(e.currentTarget.value)}
|
||||||
|
radius="md"
|
||||||
|
/>
|
||||||
|
</Tooltip>
|
||||||
<Group gap="sm" wrap="nowrap">
|
<Group gap="sm" wrap="nowrap">
|
||||||
<Select
|
<Select
|
||||||
size="sm"
|
size="sm"
|
||||||
@@ -632,6 +708,7 @@ function UsersIndexPage() {
|
|||||||
onChange={setFilterStatus}
|
onChange={setFilterStatus}
|
||||||
radius="md"
|
radius="md"
|
||||||
clearable
|
clearable
|
||||||
|
disabled={isInactiveMode}
|
||||||
style={{ flex: 1 }}
|
style={{ flex: 1 }}
|
||||||
/>
|
/>
|
||||||
<Select
|
<Select
|
||||||
@@ -642,6 +719,7 @@ function UsersIndexPage() {
|
|||||||
onChange={setFilterRole}
|
onChange={setFilterRole}
|
||||||
radius="md"
|
radius="md"
|
||||||
clearable
|
clearable
|
||||||
|
disabled={isInactiveMode}
|
||||||
style={{ flex: 1 }}
|
style={{ flex: 1 }}
|
||||||
/>
|
/>
|
||||||
<Select
|
<Select
|
||||||
@@ -656,6 +734,27 @@ function UsersIndexPage() {
|
|||||||
clearable
|
clearable
|
||||||
style={{ flex: 1 }}
|
style={{ flex: 1 }}
|
||||||
/>
|
/>
|
||||||
|
<Select
|
||||||
|
size="sm"
|
||||||
|
placeholder="Inactive since..."
|
||||||
|
data={[
|
||||||
|
{ value: '7', label: 'No activity 7D' },
|
||||||
|
{ value: '14', label: 'No activity 14D' },
|
||||||
|
{ value: '30', label: 'No activity 30D' },
|
||||||
|
]}
|
||||||
|
value={filterInactiveDays}
|
||||||
|
onChange={(v) => {
|
||||||
|
setFilterInactiveDays(v)
|
||||||
|
setFilterStatus(null)
|
||||||
|
setFilterRole(null)
|
||||||
|
setSearch('')
|
||||||
|
setSearchQuery('')
|
||||||
|
setPage(1)
|
||||||
|
}}
|
||||||
|
radius="md"
|
||||||
|
clearable
|
||||||
|
style={{ flex: 1 }}
|
||||||
|
/>
|
||||||
</Group>
|
</Group>
|
||||||
</Stack>
|
</Stack>
|
||||||
</Paper>
|
</Paper>
|
||||||
@@ -676,7 +775,11 @@ function UsersIndexPage() {
|
|||||||
<Stack align="center" gap="xs" py="xl">
|
<Stack align="center" gap="xs" py="xl">
|
||||||
<TbUsers size={32} style={{ opacity: 0.25 }} />
|
<TbUsers size={32} style={{ opacity: 0.25 }} />
|
||||||
<Text size="sm" c="dimmed">
|
<Text size="sm" c="dimmed">
|
||||||
{searchQuery || filterStatus || filterRole || filterVillageId ? 'No users match your filters.' : 'No users found.'}
|
{isInactiveMode
|
||||||
|
? `No users with ${filterInactiveDays}+ days of inactivity.`
|
||||||
|
: searchQuery || filterStatus || filterRole || filterVillageId
|
||||||
|
? 'No users match your filters.'
|
||||||
|
: 'No users found.'}
|
||||||
</Text>
|
</Text>
|
||||||
</Stack>
|
</Stack>
|
||||||
</Paper>
|
</Paper>
|
||||||
@@ -698,20 +801,21 @@ function UsersIndexPage() {
|
|||||||
<Table.Thead>
|
<Table.Thead>
|
||||||
<Table.Tr>
|
<Table.Tr>
|
||||||
{[
|
{[
|
||||||
{ label: 'User & ID', col: 'name', width: '28%' },
|
{ label: 'User & ID', col: 'name', width: '24%' },
|
||||||
{ label: 'Contact', col: null, width: '25%' },
|
{ label: 'Contact', col: null, width: '21%' },
|
||||||
{ label: 'Organization', col: null, width: '22%' },
|
{ label: 'Organization', col: null, width: '20%' },
|
||||||
{ label: 'Role', col: 'idUserRole', width: '15%' },
|
{ label: 'Role', col: 'idUserRole', width: '13%' },
|
||||||
{ label: 'Status', col: 'isActive', width: '10%' },
|
{ label: 'Status', col: 'isActive', width: '10%' },
|
||||||
|
{ label: 'Last Activity', col: null, width: '12%' },
|
||||||
].map(({ label, col, width }) => (
|
].map(({ label, col, width }) => (
|
||||||
<Table.Th
|
<Table.Th
|
||||||
key={label}
|
key={label}
|
||||||
style={{ width: isMobile ? undefined : width, cursor: col ? 'pointer' : undefined, userSelect: 'none' }}
|
style={{ width: isMobile ? undefined : width, cursor: col && !isInactiveMode ? 'pointer' : undefined, userSelect: 'none' }}
|
||||||
onClick={col ? () => handleSort(col) : undefined}
|
onClick={col && !isInactiveMode ? () => handleSort(col) : undefined}
|
||||||
>
|
>
|
||||||
<Group gap={4} wrap="nowrap">
|
<Group gap={4} wrap="nowrap">
|
||||||
<span>{label}</span>
|
<span>{label}</span>
|
||||||
{col && (
|
{col && !isInactiveMode && (
|
||||||
sortBy === col
|
sortBy === col
|
||||||
? sortDir === 'asc'
|
? sortDir === 'asc'
|
||||||
? <TbArrowUp size={13} />
|
? <TbArrowUp size={13} />
|
||||||
@@ -732,13 +836,7 @@ function UsersIndexPage() {
|
|||||||
>
|
>
|
||||||
<Table.Td>
|
<Table.Td>
|
||||||
<Group gap="md" wrap="nowrap">
|
<Group gap="md" wrap="nowrap">
|
||||||
<Avatar
|
<Avatar size="lg" radius="md" variant="light" color={getRoleColor(user.role)} style={{ flexShrink: 0 }}>
|
||||||
size="lg"
|
|
||||||
radius="md"
|
|
||||||
variant="light"
|
|
||||||
color={getRoleColor(user.role)}
|
|
||||||
style={{ flexShrink: 0 }}
|
|
||||||
>
|
|
||||||
{user.name.charAt(0)}
|
{user.name.charAt(0)}
|
||||||
</Avatar>
|
</Avatar>
|
||||||
<Stack gap={2} style={{ overflow: 'hidden' }}>
|
<Stack gap={2} style={{ overflow: 'hidden' }}>
|
||||||
@@ -816,6 +914,17 @@ function UsersIndexPage() {
|
|||||||
)}
|
)}
|
||||||
</Stack>
|
</Stack>
|
||||||
</Table.Td>
|
</Table.Td>
|
||||||
|
<Table.Td>
|
||||||
|
{(() => {
|
||||||
|
const { label, color } = getLastActivityInfo(user.lastActivity)
|
||||||
|
return (
|
||||||
|
<Group gap={6} wrap="nowrap">
|
||||||
|
<TbClock size={13} color={`var(--mantine-color-${color}-5)`} />
|
||||||
|
<Text size="xs" fw={600} c={`${color}.5`}>{label}</Text>
|
||||||
|
</Group>
|
||||||
|
)
|
||||||
|
})()}
|
||||||
|
</Table.Td>
|
||||||
</Table.Tr>
|
</Table.Tr>
|
||||||
))}
|
))}
|
||||||
</Table.Tbody>
|
</Table.Tbody>
|
||||||
@@ -824,12 +933,12 @@ function UsersIndexPage() {
|
|||||||
</Paper>
|
</Paper>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
{!isLoading && !error && response?.data?.totalPage > 1 && (
|
{!isLoading && !error && totalPages > 1 && (
|
||||||
<Group justify="center">
|
<Group justify="center">
|
||||||
<Pagination
|
<Pagination
|
||||||
value={page}
|
value={page}
|
||||||
onChange={setPage}
|
onChange={setPage}
|
||||||
total={response.data.totalPage}
|
total={totalPages}
|
||||||
size="sm"
|
size="sm"
|
||||||
radius="md"
|
radius="md"
|
||||||
withEdges={false}
|
withEdges={false}
|
||||||
|
|||||||
@@ -1,13 +1,16 @@
|
|||||||
import { AreaChart } from '@mantine/charts'
|
import { AreaChart, BarChart } from '@mantine/charts'
|
||||||
import {
|
import {
|
||||||
Badge,
|
Badge,
|
||||||
Box,
|
Box,
|
||||||
Button,
|
Button,
|
||||||
Card,
|
Card,
|
||||||
|
Grid,
|
||||||
Group,
|
Group,
|
||||||
Loader,
|
Loader,
|
||||||
Modal,
|
Modal,
|
||||||
|
Pagination,
|
||||||
Paper,
|
Paper,
|
||||||
|
ScrollArea,
|
||||||
SegmentedControl,
|
SegmentedControl,
|
||||||
SimpleGrid,
|
SimpleGrid,
|
||||||
Stack,
|
Stack,
|
||||||
@@ -33,12 +36,14 @@ import {
|
|||||||
TbChartBar,
|
TbChartBar,
|
||||||
TbClock,
|
TbClock,
|
||||||
TbEdit,
|
TbEdit,
|
||||||
|
TbFileText,
|
||||||
TbHome2,
|
TbHome2,
|
||||||
TbLayoutKanban,
|
TbLayoutKanban,
|
||||||
TbMapPin,
|
TbMapPin,
|
||||||
TbPower,
|
TbPower,
|
||||||
TbTestPipe,
|
TbTestPipe,
|
||||||
TbUser,
|
TbUser,
|
||||||
|
TbUserOff,
|
||||||
TbUsers,
|
TbUsers,
|
||||||
TbUsersGroup,
|
TbUsersGroup,
|
||||||
TbWifi
|
TbWifi
|
||||||
@@ -193,6 +198,73 @@ function ActivityChart({ villageId }: { villageId: string }) {
|
|||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// ── Peak Hours Chart ──────────────────────────────────────────────────────────
|
||||||
|
|
||||||
|
function PeakHoursChart({ villageId }: { villageId: string }) {
|
||||||
|
const { data: response, isLoading } = useSWR(API_URLS.getPeakHours(villageId), fetcher)
|
||||||
|
const hours: { hour: number; label: string; count: number }[] = response?.data?.hours || []
|
||||||
|
const peak: { label: string; count: number } | null = response?.data?.peak || null
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Paper withBorder radius="xl" p="lg">
|
||||||
|
<Group justify="space-between" mb="lg" wrap="wrap" gap="sm">
|
||||||
|
<Group gap="xs">
|
||||||
|
<ThemeIcon size={28} radius="md" variant="light" color="violet">
|
||||||
|
<TbClock size={14} />
|
||||||
|
</ThemeIcon>
|
||||||
|
<Stack gap={0}>
|
||||||
|
<Text fw={700} size="sm">Peak Activity Hours</Text>
|
||||||
|
<Text size="xs" c="dimmed">
|
||||||
|
{peak && peak.count > 0
|
||||||
|
? `Busiest hour: ${peak.label} (${peak.count.toLocaleString()} activities)`
|
||||||
|
: 'No activity data'}
|
||||||
|
</Text>
|
||||||
|
</Stack>
|
||||||
|
</Group>
|
||||||
|
</Group>
|
||||||
|
|
||||||
|
{isLoading ? (
|
||||||
|
<Stack h={200} align="center" justify="center">
|
||||||
|
<Loader type="dots" />
|
||||||
|
</Stack>
|
||||||
|
) : (
|
||||||
|
<BarChart
|
||||||
|
h={200}
|
||||||
|
data={hours}
|
||||||
|
dataKey="label"
|
||||||
|
series={[{ name: 'count', color: 'violet.5' }]}
|
||||||
|
withTooltip
|
||||||
|
withXAxis
|
||||||
|
withYAxis={false}
|
||||||
|
tickLine="none"
|
||||||
|
gridAxis="none"
|
||||||
|
barProps={{ radius: 4 }}
|
||||||
|
tooltipProps={{
|
||||||
|
content: ({ active, payload, label }: any) => {
|
||||||
|
if (!active || !payload?.length) return null
|
||||||
|
return (
|
||||||
|
<div style={{
|
||||||
|
backgroundColor: '#1A1B1E',
|
||||||
|
padding: '8px 12px',
|
||||||
|
borderRadius: '6px',
|
||||||
|
border: '1px solid #373A40',
|
||||||
|
boxShadow: '0 4px 12px rgba(0,0,0,0.5)',
|
||||||
|
whiteSpace: 'nowrap',
|
||||||
|
}}>
|
||||||
|
<div style={{ fontSize: '12px', fontWeight: 600, color: '#C1C2C5', marginBottom: '4px' }}>{label}</div>
|
||||||
|
<div style={{ fontSize: '11px', color: '#9775FA' }}>
|
||||||
|
Activities: <span style={{ fontWeight: 700 }}>{payload[0].value}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
},
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
)}
|
||||||
|
</Paper>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
// ── Recent Activity Logs ──────────────────────────────────────────────────────
|
// ── Recent Activity Logs ──────────────────────────────────────────────────────
|
||||||
|
|
||||||
function RecentVillageLogs({ villageId }: { villageId: string }) {
|
function RecentVillageLogs({ villageId }: { villageId: string }) {
|
||||||
@@ -218,34 +290,146 @@ function RecentVillageLogs({ villageId }: { villageId: string }) {
|
|||||||
) : logs.length === 0 ? (
|
) : logs.length === 0 ? (
|
||||||
<Text size="sm" c="dimmed" ta="center" py="md">No recent activity.</Text>
|
<Text size="sm" c="dimmed" ta="center" py="md">No recent activity.</Text>
|
||||||
) : (
|
) : (
|
||||||
<Table verticalSpacing="xs" className="data-table">
|
<Table.ScrollContainer minWidth={380}>
|
||||||
<Table.Thead>
|
<Table verticalSpacing="xs" className="data-table">
|
||||||
<Table.Tr>
|
<Table.Thead>
|
||||||
<Table.Th>Time</Table.Th>
|
<Table.Tr>
|
||||||
<Table.Th>User</Table.Th>
|
<Table.Th style={{ whiteSpace: 'nowrap' }}>Time</Table.Th>
|
||||||
<Table.Th>Action</Table.Th>
|
<Table.Th>User</Table.Th>
|
||||||
<Table.Th>Description</Table.Th>
|
<Table.Th style={{ whiteSpace: 'nowrap' }}>Action</Table.Th>
|
||||||
</Table.Tr>
|
<Table.Th>Description</Table.Th>
|
||||||
</Table.Thead>
|
|
||||||
<Table.Tbody>
|
|
||||||
{logs.map((log: any, i: number) => (
|
|
||||||
<Table.Tr key={i}>
|
|
||||||
<Table.Td>
|
|
||||||
<Text size="xs">{dayjs(log.timestamp).format('D MMM YYYY, HH:mm')}</Text>
|
|
||||||
</Table.Td>
|
|
||||||
<Table.Td>
|
|
||||||
<Text size="sm" fw={500}>{log.userName || 'Unknown'}</Text>
|
|
||||||
</Table.Td>
|
|
||||||
<Table.Td>
|
|
||||||
<Text size="xs">{log.action || '-'}</Text>
|
|
||||||
</Table.Td>
|
|
||||||
<Table.Td>
|
|
||||||
<Text size="xs" c="dimmed" lineClamp={1}>{log.desc || '-'}</Text>
|
|
||||||
</Table.Td>
|
|
||||||
</Table.Tr>
|
</Table.Tr>
|
||||||
))}
|
</Table.Thead>
|
||||||
</Table.Tbody>
|
<Table.Tbody>
|
||||||
</Table>
|
{logs.map((log: any, i: number) => (
|
||||||
|
<Table.Tr key={i}>
|
||||||
|
<Table.Td style={{ whiteSpace: 'nowrap' }}>
|
||||||
|
<Text size="xs">{dayjs(log.timestamp).format('D MMM YYYY, HH:mm')}</Text>
|
||||||
|
</Table.Td>
|
||||||
|
<Table.Td>
|
||||||
|
<Text size="sm" fw={500}>{log.userName || 'Unknown'}</Text>
|
||||||
|
</Table.Td>
|
||||||
|
<Table.Td style={{ whiteSpace: 'nowrap' }}>
|
||||||
|
<Text size="xs">{log.action || '-'}</Text>
|
||||||
|
</Table.Td>
|
||||||
|
<Table.Td>
|
||||||
|
<Text size="xs" c="dimmed">{log.desc || '-'}</Text>
|
||||||
|
</Table.Td>
|
||||||
|
</Table.Tr>
|
||||||
|
))}
|
||||||
|
</Table.Tbody>
|
||||||
|
</Table>
|
||||||
|
</Table.ScrollContainer>
|
||||||
|
)}
|
||||||
|
</Paper>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
// ── Inactive Users ────────────────────────────────────────────────────────────
|
||||||
|
|
||||||
|
function InactiveVillageUsers({ villageId }: { villageId: string }) {
|
||||||
|
const [days, setDays] = useState<7 | 14 | 30>(7)
|
||||||
|
const [page, setPage] = useState(1)
|
||||||
|
|
||||||
|
const { data: response, isLoading } = useSWR(
|
||||||
|
API_URLS.getInactiveUsers(days, villageId, page),
|
||||||
|
fetcher
|
||||||
|
)
|
||||||
|
|
||||||
|
const users: any[] = response?.data?.users || []
|
||||||
|
const totalPages: number = response?.data?.totalPage ?? 0
|
||||||
|
const total: number = response?.data?.total ?? 0
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Paper withBorder radius="xl" p="lg">
|
||||||
|
<Group justify="space-between" mb="md" wrap="wrap" gap="sm">
|
||||||
|
<Group gap="xs">
|
||||||
|
<ThemeIcon size={28} radius="md" variant="light" color="red">
|
||||||
|
<TbUserOff size={14} />
|
||||||
|
</ThemeIcon>
|
||||||
|
<Stack gap={0}>
|
||||||
|
<Text fw={700} size="sm">Inactive Users</Text>
|
||||||
|
<Text size="xs" c="dimmed">
|
||||||
|
{isLoading ? 'Loading...' : `${total} users with no activity in the last ${days} days`}
|
||||||
|
</Text>
|
||||||
|
</Stack>
|
||||||
|
</Group>
|
||||||
|
<SegmentedControl
|
||||||
|
size="xs"
|
||||||
|
value={String(days)}
|
||||||
|
onChange={(v) => { setDays(Number(v) as 7 | 14 | 30); setPage(1) }}
|
||||||
|
data={[
|
||||||
|
{ label: '7D', value: '7' },
|
||||||
|
{ label: '14D', value: '14' },
|
||||||
|
{ label: '30D', value: '30' },
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
</Group>
|
||||||
|
|
||||||
|
{isLoading ? (
|
||||||
|
<Stack h={120} align="center" justify="center">
|
||||||
|
<Loader type="dots" />
|
||||||
|
</Stack>
|
||||||
|
) : users.length === 0 ? (
|
||||||
|
<Stack align="center" py="md" gap={4}>
|
||||||
|
<TbUsers size={28} style={{ opacity: 0.25 }} />
|
||||||
|
<Text size="sm" c="dimmed">No inactive users in this period.</Text>
|
||||||
|
</Stack>
|
||||||
|
) : (
|
||||||
|
<Stack gap="md">
|
||||||
|
<ScrollArea>
|
||||||
|
<Table verticalSpacing="xs" className="data-table">
|
||||||
|
<Table.Thead>
|
||||||
|
<Table.Tr>
|
||||||
|
<Table.Th>Name</Table.Th>
|
||||||
|
<Table.Th>Role</Table.Th>
|
||||||
|
<Table.Th>Group / Position</Table.Th>
|
||||||
|
<Table.Th>Status</Table.Th>
|
||||||
|
<Table.Th style={{ whiteSpace: 'nowrap' }}>Last Activity</Table.Th>
|
||||||
|
</Table.Tr>
|
||||||
|
</Table.Thead>
|
||||||
|
<Table.Tbody>
|
||||||
|
{users.map((u: any) => (
|
||||||
|
<Table.Tr key={u.id}>
|
||||||
|
<Table.Td>
|
||||||
|
<Stack gap={0}>
|
||||||
|
<Text size="sm" fw={600}>{u.name}</Text>
|
||||||
|
<Text size="xs" c="dimmed">{u.email}</Text>
|
||||||
|
</Stack>
|
||||||
|
</Table.Td>
|
||||||
|
<Table.Td>
|
||||||
|
<Badge variant="light" color="brand-blue" size="sm" radius="sm">
|
||||||
|
{u.role}
|
||||||
|
</Badge>
|
||||||
|
</Table.Td>
|
||||||
|
<Table.Td>
|
||||||
|
<Text size="xs">{u.group}{u.position ? ` · ${u.position}` : ''}</Text>
|
||||||
|
</Table.Td>
|
||||||
|
<Table.Td>
|
||||||
|
<Badge variant="dot" color={u.isActive ? 'teal' : 'red'} size="sm">
|
||||||
|
{u.isActive ? 'Active' : 'Inactive'}
|
||||||
|
</Badge>
|
||||||
|
</Table.Td>
|
||||||
|
<Table.Td style={{ whiteSpace: 'nowrap' }}>
|
||||||
|
{u.daysSince === null ? (
|
||||||
|
<Text size="xs" c="dimmed">Never</Text>
|
||||||
|
) : (
|
||||||
|
<Text size="xs" fw={600} c={u.daysSince > 30 ? 'red.5' : u.daysSince > 7 ? 'yellow.5' : 'dimmed'}>
|
||||||
|
{u.daysSince}d ago
|
||||||
|
</Text>
|
||||||
|
)}
|
||||||
|
</Table.Td>
|
||||||
|
</Table.Tr>
|
||||||
|
))}
|
||||||
|
</Table.Tbody>
|
||||||
|
</Table>
|
||||||
|
</ScrollArea>
|
||||||
|
{totalPages > 1 && (
|
||||||
|
<Group justify="center">
|
||||||
|
<Pagination value={page} onChange={setPage} total={totalPages} size="sm" radius="md" withEdges={false} siblings={1} />
|
||||||
|
</Group>
|
||||||
|
)}
|
||||||
|
</Stack>
|
||||||
)}
|
)}
|
||||||
</Paper>
|
</Paper>
|
||||||
)
|
)
|
||||||
@@ -267,6 +451,7 @@ function VillageDetailPage() {
|
|||||||
const [editModalOpened, { open: openEditModal, close: closeEditModal }] = useDisclosure(false)
|
const [editModalOpened, { open: openEditModal, close: closeEditModal }] = useDisclosure(false)
|
||||||
const [isUpdating, setIsUpdating] = useState(false)
|
const [isUpdating, setIsUpdating] = useState(false)
|
||||||
const [isEditing, setIsEditing] = useState(false)
|
const [isEditing, setIsEditing] = useState(false)
|
||||||
|
const [isExporting, setIsExporting] = useState(false)
|
||||||
const [editForm, setEditForm] = useState({ name: '', desc: '', isDummy: false })
|
const [editForm, setEditForm] = useState({ name: '', desc: '', isDummy: false })
|
||||||
|
|
||||||
const village = infoRes?.data
|
const village = infoRes?.data
|
||||||
@@ -340,6 +525,216 @@ function VillageDetailPage() {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const handleDownloadPDF = async () => {
|
||||||
|
if (!village || !stats) return
|
||||||
|
setIsExporting(true)
|
||||||
|
try {
|
||||||
|
const [activityRes, peakRes, logsRes, inactiveRes] = await Promise.all([
|
||||||
|
fetch(API_URLS.graphLogVillages(villageId, 'daily')).then(r => r.json()),
|
||||||
|
fetch(API_URLS.getPeakHours(villageId)).then(r => r.json()),
|
||||||
|
fetch(API_URLS.getRecentVillageLogs(villageId)).then(r => r.json()),
|
||||||
|
fetch(API_URLS.getInactiveUsers(7, villageId, 1)).then(r => r.json()),
|
||||||
|
])
|
||||||
|
|
||||||
|
const activityData: { label: string; aktivitas: number }[] = activityRes?.data || []
|
||||||
|
const peakHours: { hour: number; label: string; count: number }[] = peakRes?.data?.hours || []
|
||||||
|
const peak: { label: string; count: number } | null = peakRes?.data?.peak || null
|
||||||
|
const recentLogs: { timestamp: string; userName: string; action: string; desc: string }[] = logsRes?.data || []
|
||||||
|
const inactiveUsers: any[] = inactiveRes?.data?.users || []
|
||||||
|
const totalInactive: number = inactiveRes?.data?.total ?? 0
|
||||||
|
|
||||||
|
const generatedAt = dayjs().format('DD MMM YYYY HH:mm')
|
||||||
|
|
||||||
|
const maxActivity = Math.max(...activityData.map(d => d.aktivitas), 1)
|
||||||
|
const activityRows = activityData.map((d, i) => `
|
||||||
|
<tr style="background:${i % 2 === 0 ? '#fff' : '#f9fafb'}">
|
||||||
|
<td style="width:80px;font-size:11px;font-weight:600">${d.label}</td>
|
||||||
|
<td>
|
||||||
|
<div style="background:#e5e7eb;border-radius:4px;height:10px;overflow:hidden">
|
||||||
|
<div style="width:${Math.round((d.aktivitas / maxActivity) * 100)}%;height:100%;background:#2563eb;border-radius:4px"></div>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
<td style="text-align:right;width:60px;font-weight:700;font-size:11px">${d.aktivitas.toLocaleString()}</td>
|
||||||
|
</tr>`).join('')
|
||||||
|
|
||||||
|
const peakMax = Math.max(...peakHours.map(h => h.count), 1)
|
||||||
|
const peakRows = peakHours.filter(h => h.count > 0).map((h, i) => `
|
||||||
|
<tr style="background:${i % 2 === 0 ? '#fff' : '#f9fafb'}">
|
||||||
|
<td style="font-weight:700;width:70px;font-size:11px">${h.label}</td>
|
||||||
|
<td>
|
||||||
|
<div style="background:#e5e7eb;border-radius:4px;height:8px;overflow:hidden">
|
||||||
|
<div style="width:${Math.round((h.count / peakMax) * 100)}%;height:100%;background:#7c3aed;border-radius:4px"></div>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
<td style="text-align:right;width:70px;font-weight:600;font-size:11px">${h.count.toLocaleString()}</td>
|
||||||
|
</tr>`).join('')
|
||||||
|
|
||||||
|
const actionColor = (action: string) => {
|
||||||
|
const a = action.toUpperCase()
|
||||||
|
if (a === 'LOGIN') return '#059669'
|
||||||
|
if (a === 'LOGOUT') return '#6b7280'
|
||||||
|
if (a === 'CREATE') return '#2563eb'
|
||||||
|
if (a === 'UPDATE') return '#d97706'
|
||||||
|
if (a === 'DELETE') return '#dc2626'
|
||||||
|
return '#374151'
|
||||||
|
}
|
||||||
|
|
||||||
|
const logRows = recentLogs.map((log, i) => `
|
||||||
|
<tr style="background:${i % 2 === 0 ? '#fff' : '#f9fafb'}">
|
||||||
|
<td style="white-space:nowrap;font-size:11px">${dayjs(log.timestamp).format('DD MMM YYYY HH:mm')}</td>
|
||||||
|
<td style="font-weight:600;font-size:11px">${log.userName}</td>
|
||||||
|
<td><span style="font-size:10px;font-weight:800;color:${actionColor(log.action)}">${log.action}</span></td>
|
||||||
|
<td style="font-size:11px;color:#6b7280">${log.desc || '-'}</td>
|
||||||
|
</tr>`).join('')
|
||||||
|
|
||||||
|
const inactiveRows = inactiveUsers.length === 0
|
||||||
|
? '<tr><td colspan="4" style="text-align:center;color:#9ca3af;padding:14px">No inactive users in this period.</td></tr>'
|
||||||
|
: inactiveUsers.map((u, i) => `
|
||||||
|
<tr style="background:${i % 2 === 0 ? '#fff' : '#f9fafb'}">
|
||||||
|
<td>
|
||||||
|
<strong style="font-size:11px">${u.name}</strong><br>
|
||||||
|
<span style="font-size:10px;color:#9ca3af">${u.email}</span>
|
||||||
|
</td>
|
||||||
|
<td style="text-align:center;font-size:10px;font-weight:700">${u.role}</td>
|
||||||
|
<td style="font-size:10px">${u.group || '-'}${u.position ? ` · ${u.position}` : ''}</td>
|
||||||
|
<td style="text-align:center">
|
||||||
|
${u.daysSince === null
|
||||||
|
? '<span style="color:#9ca3af;font-size:10px">Never</span>'
|
||||||
|
: `<span style="font-weight:700;font-size:10px;color:${u.daysSince > 30 ? '#dc2626' : u.daysSince > 7 ? '#d97706' : '#059669'}">${u.daysSince}d ago</span>`}
|
||||||
|
</td>
|
||||||
|
</tr>`).join('')
|
||||||
|
|
||||||
|
const html = `<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8"/>
|
||||||
|
<title>${village.name} — Village Report</title>
|
||||||
|
<style>
|
||||||
|
* { box-sizing: border-box; margin: 0; padding: 0; }
|
||||||
|
body { font-family: Arial, sans-serif; color: #111; background: #fff; font-size: 12px; }
|
||||||
|
.cover { background: linear-gradient(135deg, #1d4ed8, #7c3aed); color: white; padding: 36px 40px 28px; }
|
||||||
|
.cover h1 { font-size: 24px; font-weight: 800; margin-bottom: 6px; }
|
||||||
|
.cover p { font-size: 12px; opacity: 0.85; margin-top: 4px; }
|
||||||
|
.summary { display: grid; grid-template-columns: repeat(4, 1fr); border-bottom: 2px solid #e5e7eb; }
|
||||||
|
.summary-card { padding: 14px 16px; border-right: 1px solid #e5e7eb; }
|
||||||
|
.summary-card:last-child { border-right: none; }
|
||||||
|
.summary-card .label { font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: #6b7280; margin-bottom: 4px; }
|
||||||
|
.summary-card .value { font-size: 26px; font-weight: 800; }
|
||||||
|
.summary-card .sub { font-size: 10px; color: #9ca3af; margin-top: 2px; }
|
||||||
|
.section { padding: 18px 32px; border-bottom: 1px solid #f3f4f6; }
|
||||||
|
.section h2 { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: #6b7280; padding-bottom: 8px; border-bottom: 2px solid #e5e7eb; margin-bottom: 14px; }
|
||||||
|
table { width: 100%; border-collapse: collapse; }
|
||||||
|
th { font-size: 9px; font-weight: 700; text-transform: uppercase; color: #6b7280; padding: 7px 10px; border-bottom: 2px solid #e5e7eb; text-align: left; background: #f9fafb; }
|
||||||
|
td { padding: 7px 10px; border-bottom: 1px solid #f3f4f6; vertical-align: middle; line-height: 1.4; }
|
||||||
|
.two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
|
||||||
|
.footer { padding: 14px 32px; border-top: 2px solid #e5e7eb; font-size: 10px; color: #9ca3af; text-align: center; }
|
||||||
|
@media print { body { -webkit-print-color-adjust: exact; print-color-adjust: exact; } .section { page-break-inside: avoid; } }
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<div class="cover">
|
||||||
|
<h1>${village.name}</h1>
|
||||||
|
<p>Village Head (Perbekel): <strong>${village.perbekel || '-'}</strong></p>
|
||||||
|
<p>Status: <strong style="color:${village.isActive ? '#6ee7b7' : '#fca5a5'}">${village.isActive ? 'Active' : 'Inactive'}</strong>${village.isDummy ? ' · <span style="color:#fde68a">Dummy Data</span>' : ''}</p>
|
||||||
|
<p>Created: ${village.createdAt} · Last Updated: ${village.updatedAt || '-'}</p>
|
||||||
|
<p style="margin-top:10px;opacity:0.65">Generated: ${generatedAt}</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="summary">
|
||||||
|
<div class="summary-card">
|
||||||
|
<div class="label">Active Users</div>
|
||||||
|
<div class="value" style="color:#2563eb">${stats.user.active.toLocaleString()}</div>
|
||||||
|
<div class="sub">${stats.user.nonActive} inactive</div>
|
||||||
|
</div>
|
||||||
|
<div class="summary-card">
|
||||||
|
<div class="label">Groups</div>
|
||||||
|
<div class="value" style="color:#7c3aed">${stats.group.active.toLocaleString()}</div>
|
||||||
|
<div class="sub">${stats.group.nonActive} inactive</div>
|
||||||
|
</div>
|
||||||
|
<div class="summary-card">
|
||||||
|
<div class="label">Divisions</div>
|
||||||
|
<div class="value" style="color:#0891b2">${stats.division.active.toLocaleString()}</div>
|
||||||
|
<div class="sub">${stats.division.nonActive} inactive</div>
|
||||||
|
</div>
|
||||||
|
<div class="summary-card">
|
||||||
|
<div class="label">Projects</div>
|
||||||
|
<div class="value" style="color:#d97706">${stats.project.active.toLocaleString()}</div>
|
||||||
|
<div class="sub">${stats.project.nonActive} inactive</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="section">
|
||||||
|
<div class="two-col">
|
||||||
|
<div>
|
||||||
|
<h2>Activity Trend — Last 14 Days</h2>
|
||||||
|
${activityData.length === 0
|
||||||
|
? '<p style="color:#9ca3af;font-size:11px;padding:8px 0">No activity data available.</p>'
|
||||||
|
: `<table>
|
||||||
|
<thead><tr><th>Date</th><th>Distribution</th><th style="text-align:right">Count</th></tr></thead>
|
||||||
|
<tbody>${activityRows}</tbody>
|
||||||
|
</table>`}
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<h2>Peak Activity Hours</h2>
|
||||||
|
${peak && peak.count > 0
|
||||||
|
? `<p style="font-size:11px;color:#6b7280;margin-bottom:10px">Busiest hour: <strong>${peak.label}</strong> (${peak.count.toLocaleString()} activities)</p>`
|
||||||
|
: '<p style="font-size:11px;color:#9ca3af;margin-bottom:10px">No peak data available.</p>'}
|
||||||
|
<table>
|
||||||
|
<thead><tr><th>Hour</th><th>Distribution</th><th style="text-align:right">Count</th></tr></thead>
|
||||||
|
<tbody>${peakRows || '<tr><td colspan="3" style="text-align:center;color:#9ca3af;padding:12px">No data</td></tr>'}</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="section">
|
||||||
|
<h2>Recent Activity — Last 10 Logs</h2>
|
||||||
|
${recentLogs.length === 0
|
||||||
|
? '<p style="color:#9ca3af;font-size:11px">No recent activity recorded.</p>'
|
||||||
|
: `<table>
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<th style="width:18%">Time</th>
|
||||||
|
<th style="width:22%">User</th>
|
||||||
|
<th style="width:10%">Action</th>
|
||||||
|
<th>Description</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>${logRows}</tbody>
|
||||||
|
</table>`}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="section">
|
||||||
|
<h2>Inactive Users — No Activity in Last 7 Days (${totalInactive}${totalInactive > inactiveUsers.length ? `, showing first ${inactiveUsers.length}` : ''})</h2>
|
||||||
|
<table>
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<th style="width:32%">Name / Email</th>
|
||||||
|
<th style="text-align:center;width:15%">Role</th>
|
||||||
|
<th style="width:30%">Group / Position</th>
|
||||||
|
<th style="text-align:center;width:13%">Last Activity</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>${inactiveRows}</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="footer">
|
||||||
|
${village.name} · ${generatedAt} · Desa+ Monitoring System
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script>window.onload = () => window.print()<\/script>
|
||||||
|
</body>
|
||||||
|
</html>`
|
||||||
|
|
||||||
|
const win = window.open('', '_blank')
|
||||||
|
if (win) { win.document.write(html); win.document.close() }
|
||||||
|
} finally {
|
||||||
|
setIsExporting(false)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
const handleConfirmToggle = async () => {
|
const handleConfirmToggle = async () => {
|
||||||
if (!village) return
|
if (!village) return
|
||||||
|
|
||||||
@@ -429,10 +824,22 @@ function VillageDetailPage() {
|
|||||||
|
|
||||||
{/* Action Buttons */}
|
{/* Action Buttons */}
|
||||||
<Group gap="sm">
|
<Group gap="sm">
|
||||||
|
<Button
|
||||||
|
variant="light"
|
||||||
|
color="gray"
|
||||||
|
size="sm"
|
||||||
|
radius="md"
|
||||||
|
leftSection={<TbFileText size={16} />}
|
||||||
|
onClick={handleDownloadPDF}
|
||||||
|
loading={isExporting}
|
||||||
|
disabled={!village || !stats}
|
||||||
|
>
|
||||||
|
Download PDF
|
||||||
|
</Button>
|
||||||
<Button
|
<Button
|
||||||
variant="filled"
|
variant="filled"
|
||||||
color={village.isActive ? 'red' : 'green'}
|
color={village.isActive ? 'red' : 'green'}
|
||||||
leftSection={village.isActive ? <TbPower size={16} /> : <TbPower size={16} />}
|
leftSection={<TbPower size={16} />}
|
||||||
onClick={openConfirmModal}
|
onClick={openConfirmModal}
|
||||||
radius="md"
|
radius="md"
|
||||||
loading={isUpdating}
|
loading={isUpdating}
|
||||||
@@ -560,48 +967,49 @@ function VillageDetailPage() {
|
|||||||
{/* ── Activity Chart ── */}
|
{/* ── Activity Chart ── */}
|
||||||
<ActivityChart villageId={villageId} />
|
<ActivityChart villageId={villageId} />
|
||||||
|
|
||||||
{/* ── Recent Logs + System Info ── */}
|
{/* ── Peak Hours Chart ── */}
|
||||||
<Box
|
<PeakHoursChart villageId={villageId} />
|
||||||
style={{
|
|
||||||
display: 'grid',
|
|
||||||
gridTemplateColumns: '2fr 1fr',
|
|
||||||
gap: '1rem',
|
|
||||||
alignItems: 'start',
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<Box style={{ minWidth: 0 }}>
|
|
||||||
<RecentVillageLogs villageId={villageId} />
|
|
||||||
</Box>
|
|
||||||
|
|
||||||
<Paper withBorder radius="xl" p="lg">
|
{/* ── Recent Logs + System Info ── */}
|
||||||
<Group gap="xs" mb="md">
|
<Grid gutter="md" align="flex-start">
|
||||||
<ThemeIcon size={28} radius="md" variant="light" color="teal">
|
<Grid.Col span={{ base: 12, md: 8 }}>
|
||||||
<TbCalendar size={14} />
|
<RecentVillageLogs villageId={villageId} />
|
||||||
</ThemeIcon>
|
</Grid.Col>
|
||||||
<Text fw={700} size="sm">System Information</Text>
|
|
||||||
</Group>
|
<Grid.Col span={{ base: 12, md: 4 }}>
|
||||||
<Stack gap={0}>
|
<Paper withBorder radius="xl" p="lg">
|
||||||
{[
|
<Group gap="xs" mb="md">
|
||||||
{ label: 'Date Created', value: village.createdAt },
|
<ThemeIcon size={28} radius="md" variant="light" color="teal">
|
||||||
{ label: 'Created By', value: '-' },
|
<TbCalendar size={14} />
|
||||||
{ label: 'Last Updated', value: village.updatedAt },
|
</ThemeIcon>
|
||||||
].map((item, idx, arr) => (
|
<Text fw={700} size="sm">System Information</Text>
|
||||||
<Group
|
</Group>
|
||||||
key={item.label}
|
<Stack gap={0}>
|
||||||
justify="space-between"
|
{[
|
||||||
py="xs"
|
{ label: 'Date Created', value: village.createdAt },
|
||||||
wrap="wrap"
|
{ label: 'Created By', value: '-' },
|
||||||
style={{
|
{ label: 'Last Updated', value: village.updatedAt },
|
||||||
borderBottom: idx < arr.length - 1 ? '1px solid var(--mantine-color-default-border)' : 'none',
|
].map((item, idx, arr) => (
|
||||||
}}
|
<Group
|
||||||
>
|
key={item.label}
|
||||||
<Text size="xs" c="dimmed">{item.label}</Text>
|
justify="space-between"
|
||||||
<Text size="xs" fw={600} ta="right">{item.value}</Text>
|
py="xs"
|
||||||
</Group>
|
wrap="wrap"
|
||||||
))}
|
style={{
|
||||||
</Stack>
|
borderBottom: idx < arr.length - 1 ? '1px solid var(--mantine-color-default-border)' : 'none',
|
||||||
</Paper>
|
}}
|
||||||
</Box>
|
>
|
||||||
|
<Text size="xs" c="dimmed">{item.label}</Text>
|
||||||
|
<Text size="xs" fw={600} ta="right">{item.value}</Text>
|
||||||
|
</Group>
|
||||||
|
))}
|
||||||
|
</Stack>
|
||||||
|
</Paper>
|
||||||
|
</Grid.Col>
|
||||||
|
</Grid>
|
||||||
|
|
||||||
|
{/* ── Inactive Users ── */}
|
||||||
|
<InactiveVillageUsers villageId={villageId} />
|
||||||
|
|
||||||
{/* ── Confirmation Modal ── */}
|
{/* ── Confirmation Modal ── */}
|
||||||
<Modal
|
<Modal
|
||||||
|
|||||||
@@ -700,27 +700,29 @@ function ListErrorsPage() {
|
|||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<Accordion.Control>
|
<Accordion.Control>
|
||||||
<Group wrap="nowrap">
|
<Group wrap="nowrap" style={{ minWidth: 0 }}>
|
||||||
<ThemeIcon
|
<ThemeIcon
|
||||||
color={STATUS_COLOR[bug.status] ?? 'gray'}
|
color={STATUS_COLOR[bug.status] ?? 'gray'}
|
||||||
variant="light"
|
variant="light"
|
||||||
size="lg"
|
size="lg"
|
||||||
radius="md"
|
radius="md"
|
||||||
|
style={{ flexShrink: 0 }}
|
||||||
>
|
>
|
||||||
<TbAlertTriangle size={20} />
|
<TbAlertTriangle size={20} />
|
||||||
</ThemeIcon>
|
</ThemeIcon>
|
||||||
<Box style={{ flex: 1 }}>
|
<Box style={{ flex: 1, minWidth: 0 }}>
|
||||||
<Group justify="space-between">
|
<Group wrap="nowrap" gap="xs">
|
||||||
<Text size="sm" fw={600} lineClamp={1}>{bug.description}</Text>
|
<Text size="sm" fw={600} lineClamp={1} style={{ flex: 1, minWidth: 0 }}>{bug.description}</Text>
|
||||||
<Badge
|
<Badge
|
||||||
color={STATUS_COLOR[bug.status] ?? 'gray'}
|
color={STATUS_COLOR[bug.status] ?? 'gray'}
|
||||||
variant="dot"
|
variant="dot"
|
||||||
size="sm"
|
size="sm"
|
||||||
|
style={{ flexShrink: 0 }}
|
||||||
>
|
>
|
||||||
{STATUS_LABEL[bug.status] ?? bug.status}
|
{STATUS_LABEL[bug.status] ?? bug.status}
|
||||||
</Badge>
|
</Badge>
|
||||||
</Group>
|
</Group>
|
||||||
<Text size="xs" c="dimmed">
|
<Text size="xs" c="dimmed" lineClamp={1}>
|
||||||
{dayjs(bug.createdAt).format('D MMM YYYY, HH:mm')} · {bug.appId?.toUpperCase()} · v{bug.affectedVersion}
|
{dayjs(bug.createdAt).format('D MMM YYYY, HH:mm')} · {bug.appId?.toUpperCase()} · v{bug.affectedVersion}
|
||||||
</Text>
|
</Text>
|
||||||
</Box>
|
</Box>
|
||||||
|
|||||||
@@ -198,15 +198,15 @@ function DashboardPage() {
|
|||||||
</Button>
|
</Button>
|
||||||
</Group>
|
</Group>
|
||||||
|
|
||||||
<Paper withBorder radius="2xl" className="glass" p="md">
|
<Paper withBorder radius="2xl" className="glass" p="md" style={{ overflowX: 'auto' }}>
|
||||||
<Table className="data-table" verticalSpacing="sm">
|
<Table className="data-table" verticalSpacing="sm" style={{ minWidth: 560 }}>
|
||||||
<Table.Thead>
|
<Table.Thead>
|
||||||
<Table.Tr>
|
<Table.Tr>
|
||||||
<Table.Th>App</Table.Th>
|
<Table.Th style={{ whiteSpace: 'nowrap' }}>App</Table.Th>
|
||||||
<Table.Th>Error Message</Table.Th>
|
<Table.Th>Error Message</Table.Th>
|
||||||
<Table.Th>Version</Table.Th>
|
<Table.Th style={{ whiteSpace: 'nowrap' }}>Version</Table.Th>
|
||||||
<Table.Th>Reported</Table.Th>
|
<Table.Th style={{ whiteSpace: 'nowrap' }}>Reported</Table.Th>
|
||||||
<Table.Th>Status</Table.Th>
|
<Table.Th style={{ whiteSpace: 'nowrap' }}>Status</Table.Th>
|
||||||
</Table.Tr>
|
</Table.Tr>
|
||||||
</Table.Thead>
|
</Table.Thead>
|
||||||
<Table.Tbody>
|
<Table.Tbody>
|
||||||
@@ -227,7 +227,7 @@ function DashboardPage() {
|
|||||||
</Table.Tr>
|
</Table.Tr>
|
||||||
) : recentErrors.map((error: any) => (
|
) : recentErrors.map((error: any) => (
|
||||||
<Table.Tr key={error.id}>
|
<Table.Tr key={error.id}>
|
||||||
<Table.Td>
|
<Table.Td style={{ whiteSpace: 'nowrap' }}>
|
||||||
<Text fw={600} size="sm" tt="uppercase">{error.app}</Text>
|
<Text fw={600} size="sm" tt="uppercase">{error.app}</Text>
|
||||||
</Table.Td>
|
</Table.Td>
|
||||||
<Table.Td style={{ maxWidth: 280 }}>
|
<Table.Td style={{ maxWidth: 280 }}>
|
||||||
@@ -237,13 +237,13 @@ function DashboardPage() {
|
|||||||
</Text>
|
</Text>
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
</Table.Td>
|
</Table.Td>
|
||||||
<Table.Td>
|
<Table.Td style={{ whiteSpace: 'nowrap' }}>
|
||||||
<Badge variant="light" color="gray" size="sm">v{error.version}</Badge>
|
<Badge variant="light" color="gray" size="sm">v{error.version}</Badge>
|
||||||
</Table.Td>
|
</Table.Td>
|
||||||
<Table.Td>
|
<Table.Td style={{ whiteSpace: 'nowrap' }}>
|
||||||
<Text size="xs" c="dimmed">{formatTimeAgo(error.time)}</Text>
|
<Text size="xs" c="dimmed">{formatTimeAgo(error.time)}</Text>
|
||||||
</Table.Td>
|
</Table.Td>
|
||||||
<Table.Td>
|
<Table.Td style={{ whiteSpace: 'nowrap' }}>
|
||||||
<Badge
|
<Badge
|
||||||
color={SEVERITY_COLOR[error.severity] ?? 'gray'}
|
color={SEVERITY_COLOR[error.severity] ?? 'gray'}
|
||||||
variant="light"
|
variant="light"
|
||||||
|
|||||||
@@ -1,6 +1,7 @@
|
|||||||
import {
|
import {
|
||||||
ActionIcon,
|
ActionIcon,
|
||||||
Badge,
|
Badge,
|
||||||
|
Box,
|
||||||
Container,
|
Container,
|
||||||
Group,
|
Group,
|
||||||
Loader,
|
Loader,
|
||||||
@@ -100,39 +101,43 @@ function GlobalLogsPage() {
|
|||||||
</Group>
|
</Group>
|
||||||
|
|
||||||
<Paper withBorder radius="xl" p="md" className="glass">
|
<Paper withBorder radius="xl" p="md" className="glass">
|
||||||
<Group gap="sm" wrap="wrap" align="flex-end">
|
<Stack gap="md">
|
||||||
<Select
|
<Group gap="sm" wrap="wrap" align="flex-end">
|
||||||
label="User"
|
<Select
|
||||||
placeholder="All users"
|
label="User"
|
||||||
value={operatorId}
|
placeholder="All users"
|
||||||
onChange={(v) => { setOperatorId(v ?? 'all'); setPage(1) }}
|
value={operatorId}
|
||||||
data={operatorOptions}
|
onChange={(v) => { setOperatorId(v ?? 'all'); setPage(1) }}
|
||||||
w={200}
|
data={operatorOptions}
|
||||||
clearable
|
style={{ flex: 1, minWidth: 160 }}
|
||||||
size="sm"
|
clearable
|
||||||
/>
|
size="sm"
|
||||||
<DatePickerInput
|
/>
|
||||||
type="range"
|
<DatePickerInput
|
||||||
label="Date range"
|
type="range"
|
||||||
placeholder="Pick a date range"
|
label="Date range"
|
||||||
value={dateRange}
|
placeholder="Pick a date range"
|
||||||
onChange={(v) => { setDateRange(v); setPage(1) }}
|
value={dateRange}
|
||||||
locale="id"
|
onChange={(v) => { setDateRange(v); setPage(1) }}
|
||||||
valueFormat="DD MMM YYYY"
|
locale="id"
|
||||||
clearable
|
valueFormat="DD MMM YYYY"
|
||||||
w={280}
|
clearable
|
||||||
size="sm"
|
style={{ flex: 2, minWidth: 220 }}
|
||||||
/>
|
size="sm"
|
||||||
|
/>
|
||||||
|
</Group>
|
||||||
<Stack gap={4}>
|
<Stack gap={4}>
|
||||||
<Text size="xs" fw={500} c="dimmed">Action type</Text>
|
<Text size="xs" fw={500} c="dimmed">Action type</Text>
|
||||||
<SegmentedControl
|
<Box style={{ overflowX: 'auto' }}>
|
||||||
value={type}
|
<SegmentedControl
|
||||||
onChange={(v) => { setType(v); setPage(1) }}
|
value={type}
|
||||||
size="sm"
|
onChange={(v) => { setType(v); setPage(1) }}
|
||||||
data={LOG_TYPES.map((t) => ({ label: LOG_TYPE_LABEL[t] ?? t, value: t }))}
|
size="sm"
|
||||||
/>
|
data={LOG_TYPES.map((t) => ({ label: LOG_TYPE_LABEL[t] ?? t, value: t }))}
|
||||||
|
/>
|
||||||
|
</Box>
|
||||||
</Stack>
|
</Stack>
|
||||||
</Group>
|
</Stack>
|
||||||
</Paper>
|
</Paper>
|
||||||
|
|
||||||
{isLoading && !data ? (
|
{isLoading && !data ? (
|
||||||
|
|||||||
@@ -309,14 +309,15 @@ function UsersPage() {
|
|||||||
)}
|
)}
|
||||||
</Group>
|
</Group>
|
||||||
|
|
||||||
<Paper withBorder radius="2xl" className="glass" p={0} style={{ overflow: 'hidden' }}>
|
<Paper withBorder radius="2xl" className="glass" p={0} style={{ overflowX: 'auto' }}>
|
||||||
|
<Table.ScrollContainer minWidth={480}>
|
||||||
<Table className="data-table" verticalSpacing="md" highlightOnHover>
|
<Table className="data-table" verticalSpacing="md" highlightOnHover>
|
||||||
<Table.Thead>
|
<Table.Thead>
|
||||||
<Table.Tr>
|
<Table.Tr>
|
||||||
<Table.Th>Name & Contact</Table.Th>
|
<Table.Th>Name & Contact</Table.Th>
|
||||||
<Table.Th>Role</Table.Th>
|
<Table.Th style={{ whiteSpace: 'nowrap' }}>Role</Table.Th>
|
||||||
<Table.Th>Joined</Table.Th>
|
<Table.Th style={{ whiteSpace: 'nowrap' }}>Joined</Table.Th>
|
||||||
<Table.Th>Actions</Table.Th>
|
<Table.Th style={{ whiteSpace: 'nowrap' }}>Actions</Table.Th>
|
||||||
</Table.Tr>
|
</Table.Tr>
|
||||||
</Table.Thead>
|
</Table.Thead>
|
||||||
<Table.Tbody>
|
<Table.Tbody>
|
||||||
@@ -341,8 +342,8 @@ function UsersPage() {
|
|||||||
operators.map((user: any) => (
|
operators.map((user: any) => (
|
||||||
<Table.Tr key={user.id}>
|
<Table.Tr key={user.id}>
|
||||||
<Table.Td style={{ opacity: user.active === false ? 0.45 : 1 }}>
|
<Table.Td style={{ opacity: user.active === false ? 0.45 : 1 }}>
|
||||||
<Group gap="sm">
|
<Group gap="sm" wrap="nowrap">
|
||||||
<Box style={{ position: 'relative' }}>
|
<Box style={{ position: 'relative', flexShrink: 0 }}>
|
||||||
<Avatar
|
<Avatar
|
||||||
size="sm"
|
size="sm"
|
||||||
radius="xl"
|
radius="xl"
|
||||||
@@ -384,7 +385,7 @@ function UsersPage() {
|
|||||||
{ROLE_LABEL[user.role] ?? user.role}
|
{ROLE_LABEL[user.role] ?? user.role}
|
||||||
</Badge>
|
</Badge>
|
||||||
</Table.Td>
|
</Table.Td>
|
||||||
<Table.Td style={{ opacity: user.active === false ? 0.45 : 1 }}>
|
<Table.Td style={{ opacity: user.active === false ? 0.45 : 1, whiteSpace: 'nowrap' }}>
|
||||||
<Text size="xs" fw={500} c={user.active === false ? 'dimmed' : undefined}>
|
<Text size="xs" fw={500} c={user.active === false ? 'dimmed' : undefined}>
|
||||||
{new Date(user.createdAt).toLocaleDateString('en-GB', {
|
{new Date(user.createdAt).toLocaleDateString('en-GB', {
|
||||||
day: 'numeric',
|
day: 'numeric',
|
||||||
@@ -440,6 +441,7 @@ function UsersPage() {
|
|||||||
)}
|
)}
|
||||||
</Table.Tbody>
|
</Table.Tbody>
|
||||||
</Table>
|
</Table>
|
||||||
|
</Table.ScrollContainer>
|
||||||
</Paper>
|
</Paper>
|
||||||
|
|
||||||
{response?.totalPages > 1 && (
|
{response?.totalPages > 1 && (
|
||||||
|
|||||||
Reference in New Issue
Block a user