Merge branch 'main' of https://github.com/transformerlab/transformerlab-app

d2d7fd61 · deep1401 · db0b6d4d · f6033a3c · d2d7fd61 · d2d7fd61
Commit d2d7fd61 authored 1 month ago by deep1401
--- a/package-lock.json
+++ b/package-lock.json
@@ -14,6 +14,10 @@
        "@monaco-editor/react": "^4.6.0",
        "@mui/joy": "^5.0.0-beta.48",
        "@mux/mux-player-react": "^2.9.0",
+        "@nivo/bar": "^0.88.0",
+        "@nivo/core": "^0.88.0",
+        "@nivo/line": "^0.88.0",
+        "@nivo/radar": "^0.88.0",
        "@rjsf/core": "^5.15.1",
        "@rjsf/utils": "^5.15.1",
        "@rjsf/validator-ajv8": "^5.15.1",
@@ -3717,6 +3721,218 @@
        "mux-embed": "~5.2.0"
      }
    },
+    "node_modules/@nivo/annotations": {
+      "version": "0.88.0",
+      "resolved": "https://registry.npmjs.org/@nivo/annotations/-/annotations-0.88.0.tgz",
+      "integrity": "sha512-NXE+1oIUn+EGWMQpnpeRMLgi2wyuzhGDoJQY4OUHissCUiNotid2oNQ/PXJwN0toiu+/j9SyhzI32xr70OPi7Q==",
+      "license": "MIT",
+      "dependencies": {
+        "@nivo/colors": "0.88.0",
+        "@nivo/core": "0.88.0",
+        "@react-spring/web": "9.4.5 || ^9.7.2",
+        "lodash": "^4.17.21"
+      },
+      "peerDependencies": {
+        "react": ">= 16.14.0 < 19.0.0"
+      }
+    },
+    "node_modules/@nivo/axes": {
+      "version": "0.88.0",
+      "resolved": "https://registry.npmjs.org/@nivo/axes/-/axes-0.88.0.tgz",
+      "integrity": "sha512-jF7aIxzTNayV5cI1J/b9Q1FfpMBxTXGk3OwSigXMSfYWlliskDn2u0qGRLiYhuXFdQAWIp4oXsO1GcAQ0eRVdg==",
+      "license": "MIT",
+      "dependencies": {
+        "@nivo/core": "0.88.0",
+        "@nivo/scales": "0.88.0",
+        "@react-spring/web": "9.4.5 || ^9.7.2",
+        "@types/d3-format": "^1.4.1",
+        "@types/d3-time-format": "^2.3.1",
+        "d3-format": "^1.4.4",
+        "d3-time-format": "^3.0.0"
+      },
+      "peerDependencies": {
+        "react": ">= 16.14.0 < 19.0.0"
+      }
+    },
+    "node_modules/@nivo/bar": {
+      "version": "0.88.0",
+      "resolved": "https://registry.npmjs.org/@nivo/bar/-/bar-0.88.0.tgz",
+      "integrity": "sha512-wckwuHWeCikxGvvdRfGL+dVFsUD9uHk1r9s7bWUfOD+p8BWhxtYqfXpHolEfgGg3UyPaHtpGA7P4zgE5vgo7gQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@nivo/annotations": "0.88.0",
+        "@nivo/axes": "0.88.0",
+        "@nivo/colors": "0.88.0",
+        "@nivo/core": "0.88.0",
+        "@nivo/legends": "0.88.0",
+        "@nivo/scales": "0.88.0",
+        "@nivo/tooltip": "0.88.0",
+        "@react-spring/web": "9.4.5 || ^9.7.2",
+        "@types/d3-scale": "^4.0.8",
+        "@types/d3-shape": "^3.1.6",
+        "d3-scale": "^4.0.2",
+        "d3-shape": "^3.2.0",
+        "lodash": "^4.17.21"
+      },
+      "peerDependencies": {
+        "react": ">= 16.14.0 < 19.0.0"
+      }
+    },
+    "node_modules/@nivo/colors": {
+      "version": "0.88.0",
+      "resolved": "https://registry.npmjs.org/@nivo/colors/-/colors-0.88.0.tgz",
+      "integrity": "sha512-IZ+leYIqAlo7dyLHmsQwujanfRgXyoQ5H7PU3RWLEn1PP0zxDKLgEjFEDADpDauuslh2Tx0L81GNkWR6QSP0Mw==",
+      "license": "MIT",
+      "dependencies": {
+        "@nivo/core": "0.88.0",
+        "@types/d3-color": "^3.0.0",
+        "@types/d3-scale": "^4.0.8",
+        "@types/d3-scale-chromatic": "^3.0.0",
+        "@types/prop-types": "^15.7.2",
+        "d3-color": "^3.1.0",
+        "d3-scale": "^4.0.2",
+        "d3-scale-chromatic": "^3.0.0",
+        "lodash": "^4.17.21",
+        "prop-types": "^15.7.2"
+      },
+      "peerDependencies": {
+        "react": ">= 16.14.0 < 19.0.0"
+      }
+    },
+    "node_modules/@nivo/core": {
+      "version": "0.88.0",
+      "resolved": "https://registry.npmjs.org/@nivo/core/-/core-0.88.0.tgz",
+      "integrity": "sha512-XjUkA5MmwjLP38bdrJwn36Gj7T5SYMKD55LYQp/1nIJPdxqJ38dUfE4XyBDfIEgfP6yrHOihw3C63cUdnUBoiw==",
+      "license": "MIT",
+      "dependencies": {
+        "@nivo/tooltip": "0.88.0",
+        "@react-spring/web": "9.4.5 || ^9.7.2",
+        "@types/d3-shape": "^3.1.6",
+        "d3-color": "^3.1.0",
+        "d3-format": "^1.4.4",
+        "d3-interpolate": "^3.0.1",
+        "d3-scale": "^4.0.2",
+        "d3-scale-chromatic": "^3.0.0",
+        "d3-shape": "^3.2.0",
+        "d3-time-format": "^3.0.0",
+        "lodash": "^4.17.21",
+        "prop-types": "^15.7.2"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/nivo/donate"
+      },
+      "peerDependencies": {
+        "react": ">= 16.14.0 < 19.0.0"
+      }
+    },
+    "node_modules/@nivo/legends": {
+      "version": "0.88.0",
+      "resolved": "https://registry.npmjs.org/@nivo/legends/-/legends-0.88.0.tgz",
+      "integrity": "sha512-d4DF9pHbD8LmGJlp/Gp1cF4e8y2wfQTcw3jVhbZj9zkb7ZWB7JfeF60VHRfbXNux9bjQ9U78/SssQqueVDPEmg==",
+      "license": "MIT",
+      "dependencies": {
+        "@nivo/colors": "0.88.0",
+        "@nivo/core": "0.88.0",
+        "@types/d3-scale": "^4.0.8",
+        "d3-scale": "^4.0.2"
+      },
+      "peerDependencies": {
+        "react": ">= 16.14.0 < 19.0.0"
+      }
+    },
+    "node_modules/@nivo/line": {
+      "version": "0.88.0",
+      "resolved": "https://registry.npmjs.org/@nivo/line/-/line-0.88.0.tgz",
+      "integrity": "sha512-hFTyZ3BdAZvq2HwdwMj2SJGUeodjEW+7DLtFMIIoVIxmjZlAs3z533HcJ9cJd3it928fDm8SF/rgHs0TztYf9Q==",
+      "license": "MIT",
+      "dependencies": {
+        "@nivo/annotations": "0.88.0",
+        "@nivo/axes": "0.88.0",
+        "@nivo/colors": "0.88.0",
+        "@nivo/core": "0.88.0",
+        "@nivo/legends": "0.88.0",
+        "@nivo/scales": "0.88.0",
+        "@nivo/tooltip": "0.88.0",
+        "@nivo/voronoi": "0.88.0",
+        "@react-spring/web": "9.4.5 || ^9.7.2",
+        "d3-shape": "^3.2.0"
+      },
+      "peerDependencies": {
+        "react": ">= 16.14.0 < 19.0.0"
+      }
+    },
+    "node_modules/@nivo/radar": {
+      "version": "0.88.0",
+      "resolved": "https://registry.npmjs.org/@nivo/radar/-/radar-0.88.0.tgz",
+      "integrity": "sha512-KYdfbKPl8n5NUanqrVm2GVS+xeesrxu6bgh1t7PJmKoxGbJ5mTQMvHtadjXei3N+1/3RlNOxi5ZZDx+LuoupSQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@nivo/colors": "0.88.0",
+        "@nivo/core": "0.88.0",
+        "@nivo/legends": "0.88.0",
+        "@nivo/tooltip": "0.88.0",
+        "@react-spring/web": "9.4.5 || ^9.7.2",
+        "@types/d3-scale": "^4.0.8",
+        "@types/d3-shape": "^3.1.6",
+        "d3-scale": "^4.0.2",
+        "d3-shape": "^3.2.0"
+      },
+      "peerDependencies": {
+        "react": ">= 16.14.0 < 19.0.0"
+      }
+    },
+    "node_modules/@nivo/scales": {
+      "version": "0.88.0",
+      "resolved": "https://registry.npmjs.org/@nivo/scales/-/scales-0.88.0.tgz",
+      "integrity": "sha512-HbpxkQp6tHCltZ1yDGeqdLcaJl5ze54NPjurfGtx/Uq+H5IQoBd4Tln49bUar5CsFAMsXw8yF1HQvASr7I1SIA==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/d3-scale": "^4.0.8",
+        "@types/d3-time": "^1.1.1",
+        "@types/d3-time-format": "^3.0.0",
+        "d3-scale": "^4.0.2",
+        "d3-time": "^1.0.11",
+        "d3-time-format": "^3.0.0",
+        "lodash": "^4.17.21"
+      }
+    },
+    "node_modules/@nivo/scales/node_modules/@types/d3-time-format": {
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/@types/d3-time-format/-/d3-time-format-3.0.4.tgz",
+      "integrity": "sha512-or9DiDnYI1h38J9hxKEsw513+KVuFbEVhl7qdxcaudoiqWWepapUen+2vAriFGexr6W5+P4l9+HJrB39GG+oRg==",
+      "license": "MIT"
+    },
+    "node_modules/@nivo/tooltip": {
+      "version": "0.88.0",
+      "resolved": "https://registry.npmjs.org/@nivo/tooltip/-/tooltip-0.88.0.tgz",
+      "integrity": "sha512-iEjVfQA8gumAzg/yUinjTwswygCkE5Iwuo8opwnrbpNIqMrleBV+EAKIgB0PrzepIoW8CFG/SJhoiRfbU8jhOw==",
+      "license": "MIT",
+      "dependencies": {
+        "@nivo/core": "0.88.0",
+        "@react-spring/web": "9.4.5 || ^9.7.2"
+      },
+      "peerDependencies": {
+        "react": ">= 16.14.0 < 19.0.0"
+      }
+    },
+    "node_modules/@nivo/voronoi": {
+      "version": "0.88.0",
+      "resolved": "https://registry.npmjs.org/@nivo/voronoi/-/voronoi-0.88.0.tgz",
+      "integrity": "sha512-MyiNLvODthFoMjQ7Wjp693nogbTmVEx8Yn/7QkJhyPQbFyyA37TF/D1a/ox4h2OslXtP6K9QFN+42gB/zu7ixw==",
+      "license": "MIT",
+      "dependencies": {
+        "@nivo/core": "0.88.0",
+        "@nivo/tooltip": "0.88.0",
+        "@types/d3-delaunay": "^6.0.4",
+        "@types/d3-scale": "^4.0.8",
+        "d3-delaunay": "^6.0.4",
+        "d3-scale": "^4.0.2"
+      },
+      "peerDependencies": {
+        "react": ">= 16.14.0 < 19.0.0"
+      }
+    },
    "node_modules/@nodelib/fs.scandir": {
      "version": "2.1.5",
      "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz",
@@ -3889,6 +4105,78 @@
        "url": "https://opencollective.com/popperjs"
      }
    },
+    "node_modules/@react-spring/animated": {
+      "version": "9.7.5",
+      "resolved": "https://registry.npmjs.org/@react-spring/animated/-/animated-9.7.5.tgz",
+      "integrity": "sha512-Tqrwz7pIlsSDITzxoLS3n/v/YCUHQdOIKtOJf4yL6kYVSDTSmVK1LI1Q3M/uu2Sx4X3pIWF3xLUhlsA6SPNTNg==",
+      "license": "MIT",
+      "dependencies": {
+        "@react-spring/shared": "~9.7.5",
+        "@react-spring/types": "~9.7.5"
+      },
+      "peerDependencies": {
+        "react": "^16.8.0 || ^17.0.0 || ^18.0.0"
+      }
+    },
+    "node_modules/@react-spring/core": {
+      "version": "9.7.5",
+      "resolved": "https://registry.npmjs.org/@react-spring/core/-/core-9.7.5.tgz",
+      "integrity": "sha512-rmEqcxRcu7dWh7MnCcMXLvrf6/SDlSokLaLTxiPlAYi11nN3B5oiCUAblO72o+9z/87j2uzxa2Inm8UbLjXA+w==",
+      "license": "MIT",
+      "dependencies": {
+        "@react-spring/animated": "~9.7.5",
+        "@react-spring/shared": "~9.7.5",
+        "@react-spring/types": "~9.7.5"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/react-spring/donate"
+      },
+      "peerDependencies": {
+        "react": "^16.8.0 || ^17.0.0 || ^18.0.0"
+      }
+    },
+    "node_modules/@react-spring/rafz": {
+      "version": "9.7.5",
+      "resolved": "https://registry.npmjs.org/@react-spring/rafz/-/rafz-9.7.5.tgz",
+      "integrity": "sha512-5ZenDQMC48wjUzPAm1EtwQ5Ot3bLIAwwqP2w2owG5KoNdNHpEJV263nGhCeKKmuA3vG2zLLOdu3or6kuDjA6Aw==",
+      "license": "MIT"
+    },
+    "node_modules/@react-spring/shared": {
+      "version": "9.7.5",
+      "resolved": "https://registry.npmjs.org/@react-spring/shared/-/shared-9.7.5.tgz",
+      "integrity": "sha512-wdtoJrhUeeyD/PP/zo+np2s1Z820Ohr/BbuVYv+3dVLW7WctoiN7std8rISoYoHpUXtbkpesSKuPIw/6U1w1Pw==",
+      "license": "MIT",
+      "dependencies": {
+        "@react-spring/rafz": "~9.7.5",
+        "@react-spring/types": "~9.7.5"
+      },
+      "peerDependencies": {
+        "react": "^16.8.0 || ^17.0.0 || ^18.0.0"
+      }
+    },
+    "node_modules/@react-spring/types": {
+      "version": "9.7.5",
+      "resolved": "https://registry.npmjs.org/@react-spring/types/-/types-9.7.5.tgz",
+      "integrity": "sha512-HVj7LrZ4ReHWBimBvu2SKND3cDVUPWKLqRTmWe/fNY6o1owGOX0cAHbdPDTMelgBlVbrTKrre6lFkhqGZErK/g==",
+      "license": "MIT"
+    },
+    "node_modules/@react-spring/web": {
+      "version": "9.7.5",
+      "resolved": "https://registry.npmjs.org/@react-spring/web/-/web-9.7.5.tgz",
+      "integrity": "sha512-lmvqGwpe+CSttsWNZVr+Dg62adtKhauGwLyGE/RRyZ8AAMLgb9x3NDMA5RMElXo+IMyTkPp7nxTB8ZQlmhb6JQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@react-spring/animated": "~9.7.5",
+        "@react-spring/core": "~9.7.5",
+        "@react-spring/shared": "~9.7.5",
+        "@react-spring/types": "~9.7.5"
+      },
+      "peerDependencies": {
+        "react": "^16.8.0 || ^17.0.0 || ^18.0.0",
+        "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0"
+      }
+    },
    "node_modules/@remix-run/router": {
      "version": "1.19.1",
      "resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.19.1.tgz",
@@ -4579,6 +4867,66 @@
        "@types/node": "*"
      }
    },
+    "node_modules/@types/d3-color": {
+      "version": "3.1.3",
+      "resolved": "https://registry.npmjs.org/@types/d3-color/-/d3-color-3.1.3.tgz",
+      "integrity": "sha512-iO90scth9WAbmgv7ogoq57O9YpKmFBbmoEoCHDB2xMBY0+/KVrqAaCDyCE16dUspeOvIxFFRI+0sEtqDqy2b4A==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-delaunay": {
+      "version": "6.0.4",
+      "resolved": "https://registry.npmjs.org/@types/d3-delaunay/-/d3-delaunay-6.0.4.tgz",
+      "integrity": "sha512-ZMaSKu4THYCU6sV64Lhg6qjf1orxBthaC161plr5KuPHo3CNm8DTHiLw/5Eq2b6TsNP0W0iJrUOFscY6Q450Hw==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-format": {
+      "version": "1.4.5",
+      "resolved": "https://registry.npmjs.org/@types/d3-format/-/d3-format-1.4.5.tgz",
+      "integrity": "sha512-mLxrC1MSWupOSncXN/HOlWUAAIffAEBaI4+PKy2uMPsKe4FNZlk7qrbTjmzJXITQQqBHivaks4Td18azgqnotA==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-path": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/@types/d3-path/-/d3-path-3.1.1.tgz",
+      "integrity": "sha512-VMZBYyQvbGmWyWVea0EHs/BwLgxc+MKi1zLDCONksozI4YJMcTt8ZEuIR4Sb1MMTE8MMW49v0IwI5+b7RmfWlg==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-scale": {
+      "version": "4.0.9",
+      "resolved": "https://registry.npmjs.org/@types/d3-scale/-/d3-scale-4.0.9.tgz",
+      "integrity": "sha512-dLmtwB8zkAeO/juAMfnV+sItKjlsw2lKdZVVy6LRr0cBmegxSABiLEpGVmSJJ8O08i4+sGR6qQtb6WtuwJdvVw==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/d3-time": "*"
+      }
+    },
+    "node_modules/@types/d3-scale-chromatic": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/@types/d3-scale-chromatic/-/d3-scale-chromatic-3.1.0.tgz",
+      "integrity": "sha512-iWMJgwkK7yTRmWqRB5plb1kadXyQ5Sj8V/zYlFGMUBbIPKQScw+Dku9cAAMgJG+z5GYDoMjWGLVOvjghDEFnKQ==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-shape": {
+      "version": "3.1.7",
+      "resolved": "https://registry.npmjs.org/@types/d3-shape/-/d3-shape-3.1.7.tgz",
+      "integrity": "sha512-VLvUQ33C+3J+8p+Daf+nYSOsjB4GXp19/S/aGo60m9h1v6XaxjiT82lKVWJCfzhtuZ3yD7i/TPeC/fuKLLOSmg==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/d3-path": "*"
+      }
+    },
+    "node_modules/@types/d3-time": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/@types/d3-time/-/d3-time-1.1.4.tgz",
+      "integrity": "sha512-JIvy2HjRInE+TXOmIGN5LCmeO0hkFZx5f9FZ7kiN+D+YTcc8pptsiLiuHsvwxwC7VVKmJ2ExHUgNlAiV7vQM9g==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-time-format": {
+      "version": "2.3.4",
+      "resolved": "https://registry.npmjs.org/@types/d3-time-format/-/d3-time-format-2.3.4.tgz",
+      "integrity": "sha512-xdDXbpVO74EvadI3UDxjxTdR6QIxm1FKzEA/+F8tL4GWWUg/hgvBqf6chql64U5A9ZUGWo7pEu4eNlyLwbKdhg==",
+      "license": "MIT"
+    },
    "node_modules/@types/debug": {
      "version": "4.1.12",
      "resolved": "https://registry.npmjs.org/@types/debug/-/debug-4.1.12.tgz",
@@ -8413,6 +8761,134 @@
      "resolved": "https://registry.npmjs.org/custom-media-element/-/custom-media-element-1.3.2.tgz",
      "integrity": "sha512-nDyMobZgoAVqz7mA8rsn7i1/6bjH6N9ab2Ge7LyyNxrvxAq7zQJPg8i3u2VH7wEB+Y1T1+C3/h1G774/D+ZLag=="
    },
+    "node_modules/d3-array": {
+      "version": "3.2.4",
+      "resolved": "https://registry.npmjs.org/d3-array/-/d3-array-3.2.4.tgz",
+      "integrity": "sha512-tdQAmyA18i4J7wprpYq8ClcxZy3SC31QMeByyCFyRt7BVHdREQZ5lpzoe5mFEYZUWe+oq8HBvk9JjpibyEV4Jg==",
+      "license": "ISC",
+      "dependencies": {
+        "internmap": "1 - 2"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-color": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/d3-color/-/d3-color-3.1.0.tgz",
+      "integrity": "sha512-zg/chbXyeBtMQ1LbD/WSoW2DpC3I0mpmPdW+ynRTj/x2DAWYrIY7qeZIHidozwV24m4iavr15lNwIwLxRmOxhA==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-delaunay": {
+      "version": "6.0.4",
+      "resolved": "https://registry.npmjs.org/d3-delaunay/-/d3-delaunay-6.0.4.tgz",
+      "integrity": "sha512-mdjtIZ1XLAM8bm/hx3WwjfHt6Sggek7qH043O8KEjDXN40xi3vx/6pYSVTwLjEgiXQTbvaouWKynLBiUZ6SK6A==",
+      "license": "ISC",
+      "dependencies": {
+        "delaunator": "5"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-format": {
+      "version": "1.4.5",
+      "resolved": "https://registry.npmjs.org/d3-format/-/d3-format-1.4.5.tgz",
+      "integrity": "sha512-J0piedu6Z8iB6TbIGfZgDzfXxUFN3qQRMofy2oPdXzQibYGqPB/9iMcxr/TGalU+2RsyDO+U4f33id8tbnSRMQ==",
+      "license": "BSD-3-Clause"
+    },
+    "node_modules/d3-interpolate": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/d3-interpolate/-/d3-interpolate-3.0.1.tgz",
+      "integrity": "sha512-3bYs1rOD33uo8aqJfKP3JWPAibgw8Zm2+L9vBKEHJ2Rg+viTR7o5Mmv5mZcieN+FRYaAOWX5SJATX6k1PWz72g==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-color": "1 - 3"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-path": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/d3-path/-/d3-path-3.1.0.tgz",
+      "integrity": "sha512-p3KP5HCf/bvjBSSKuXid6Zqijx7wIfNW+J/maPs+iwR35at5JCbLUT0LzF1cnjbCHWhqzQTIN2Jpe8pRebIEFQ==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-scale": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/d3-scale/-/d3-scale-4.0.2.tgz",
+      "integrity": "sha512-GZW464g1SH7ag3Y7hXjf8RoUuAFIqklOAq3MRl4OaWabTFJY9PN/E1YklhXLh+OQ3fM9yS2nOkCoS+WLZ6kvxQ==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-array": "2.10.0 - 3",
+        "d3-format": "1 - 3",
+        "d3-interpolate": "1.2.0 - 3",
+        "d3-time": "2.1.1 - 3",
+        "d3-time-format": "2 - 4"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-scale-chromatic": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/d3-scale-chromatic/-/d3-scale-chromatic-3.1.0.tgz",
+      "integrity": "sha512-A3s5PWiZ9YCXFye1o246KoscMWqf8BsD9eRiJ3He7C9OBaxKhAd5TFCdEx/7VbKtxxTsu//1mMJFrEt572cEyQ==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-color": "1 - 3",
+        "d3-interpolate": "1 - 3"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-scale/node_modules/d3-time": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/d3-time/-/d3-time-3.1.0.tgz",
+      "integrity": "sha512-VqKjzBLejbSMT4IgbmVgDjpkYrNWUYJnbCGo874u7MMKIWsILRX+OpX/gTk8MqjpT1A/c6HY2dCA77ZN0lkQ2Q==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-array": "2 - 3"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-shape": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/d3-shape/-/d3-shape-3.2.0.tgz",
+      "integrity": "sha512-SaLBuwGm3MOViRq2ABk3eLoxwZELpH6zhl3FbAoJ7Vm1gofKx6El1Ib5z23NUEhF9AsGl7y+dzLe5Cw2AArGTA==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-path": "^3.1.0"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-time": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/d3-time/-/d3-time-1.1.0.tgz",
+      "integrity": "sha512-Xh0isrZ5rPYYdqhAVk8VLnMEidhz5aP7htAADH6MfzgmmicPkTo8LhkLxci61/lCB7n7UmE3bN0leRt+qvkLxA==",
+      "license": "BSD-3-Clause"
+    },
+    "node_modules/d3-time-format": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/d3-time-format/-/d3-time-format-3.0.0.tgz",
+      "integrity": "sha512-UXJh6EKsHBTjopVqZBhFysQcoXSv/5yLONZvkQ5Kk3qbwiUYkdX17Xa1PT6U1ZWXGGfB1ey5L8dKMlFq2DO0Ag==",
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "d3-time": "1 - 2"
+      }
+    },
    "node_modules/damerau-levenshtein": {
      "version": "1.0.8",
      "resolved": "https://registry.npmjs.org/damerau-levenshtein/-/damerau-levenshtein-1.0.8.tgz",
@@ -8732,6 +9208,15 @@
        "url": "https://github.com/sponsors/ljharb"
      }
    },
+    "node_modules/delaunator": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/delaunator/-/delaunator-5.0.1.tgz",
+      "integrity": "sha512-8nvh+XBe96aCESrGOqMp/84b13H9cdKbG5P2ejQCh4d4sK9RL4371qou9drQjMhvnPmhWl5hnmqbEE0fXr9Xnw==",
+      "license": "ISC",
+      "dependencies": {
+        "robust-predicates": "^3.0.2"
+      }
+    },
    "node_modules/delayed-stream": {
      "version": "1.0.0",
      "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
@@ -12817,6 +13302,15 @@
        "node": ">= 0.4"
      }
    },
+    "node_modules/internmap": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/internmap/-/internmap-2.0.3.tgz",
+      "integrity": "sha512-5Hh7Y1wQbvY5ooGgPbDaL5iYLAPzMTUrjMulskHLH6wnv/A+1q5rgEaiuqEjB+oxGXIVZs1FF+R/KPN3ZSQYYg==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=12"
+      }
+    },
    "node_modules/interpret": {
      "version": "1.4.0",
      "resolved": "https://registry.npmjs.org/interpret/-/interpret-1.4.0.tgz",
@@ -18824,6 +19318,12 @@
        "node": ">=8.0"
      }
    },
+    "node_modules/robust-predicates": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/robust-predicates/-/robust-predicates-3.0.2.tgz",
+      "integrity": "sha512-IXgzBWvWQwE6PrDI05OvmXUIruQTcoMDzRsOd5CDvHCVLcLHMTSYvOK5Cm46kWqlV3yAbuSpBZdJ5oP5OUoStg==",
+      "license": "Unlicense"
+    },
    "node_modules/run-parallel": {
      "version": "1.2.0",
      "resolved": "https://registry.npmjs.org/run-parallel/-/run-parallel-1.2.0.tgz",

--- a/package.json
+++ b/package.json
@@ -94,6 +94,10 @@
    "@monaco-editor/react": "^4.6.0",
    "@mui/joy": "^5.0.0-beta.48",
    "@mux/mux-player-react": "^2.9.0",
+    "@nivo/bar": "^0.88.0",
+    "@nivo/core": "^0.88.0",
+    "@nivo/line": "^0.88.0",
+    "@nivo/radar": "^0.88.0",
    "@rjsf/core": "^5.15.1",
    "@rjsf/utils": "^5.15.1",
    "@rjsf/validator-ajv8": "^5.15.1",

--- a/src/renderer/components/Experiment/Eval/Chart.tsx
+++ b/src/renderer/components/Experiment/Eval/Chart.tsx
+import React, { useState } from 'react';
+import { ResponsiveLine } from '@nivo/line';
+import { ResponsiveBar } from '@nivo/bar';
+import { ResponsiveRadar } from '@nivo/radar';
+import { Select, Option } from '@mui/joy';
+const Chart = ({ metrics }) => {
+  const [chartType, setChartType] = useState('line');
+  const handleChartTypeChange = (event, newValue) => {
+    setChartType(newValue);
+  };
+  if (!metrics || metrics.length === 0) {
+    return <div>No metrics available</div>;
+  }
+  console.log(metrics);
+  const data = metrics.map((metric) => ({
+    id: metric.type,
+    value: metric.score,
+  }));
+  const lineData = [
+    {
+      id: 'metrics',
+      data: metrics.map((metric) => ({ x: metric.type, y: metric.score })),
+    },
+  ];
+  const barData = metrics.map((metric) => ({
+    type: metric.type,
+    score: metric.score,
+  }));
+  const radarData = metrics.map((metric) => ({
+    metric: metric.type,
+    score: metric.score,
+  }));
+  return (
+    <div>
+      <Select value={chartType} onChange={handleChartTypeChange}>
+        <Option value="line">Line</Option>
+        <Option value="bar">Bar</Option>
+        <Option value="radar">Radar</Option>
+      </Select>
+      <div style={{ height: 400 }}>
+        {chartType === 'line' && (
+          <ResponsiveLine
+            data={lineData}
+            margin={{ top: 50, right: 110, bottom: 50, left: 60 }}
+            xScale={{ type: 'point' }}
+            yScale={{
+              type: 'linear',
+              min: 'auto',
+              max: 'auto',
+              stacked: true,
+              reverse: false,
+            }}
+            axisTop={null}
+            axisRight={null}
+            axisBottom={{
+              tickSize: 5,
+              tickPadding: 5,
+              tickRotation: 0,
+              legend: 'metric',
+              legendOffset: 36,
+              legendPosition: 'middle',
+            }}
+            axisLeft={{
+              tickSize: 5,
+              tickPadding: 5,
+              tickRotation: 0,
+              legend: 'score',
+              legendOffset: -40,
+              legendPosition: 'middle',
+            }}
+          />
+        )}
+        {chartType === 'bar' && (
+          <ResponsiveBar
+            data={barData}
+            keys={['score']}
+            indexBy="type"
+            margin={{ top: 50, right: 130, bottom: 50, left: 60 }}
+            padding={0.3}
+            axisTop={null}
+            axisRight={null}
+            axisBottom={{
+              tickSize: 5,
+              tickPadding: 5,
+              tickRotation: 0,
+              legend: 'metric',
+              legendPosition: 'middle',
+              legendOffset: 32,
+            }}
+            axisLeft={{
+              tickSize: 5,
+              tickPadding: 5,
+              tickRotation: 0,
+              legend: 'score',
+              legendPosition: 'middle',
+              legendOffset: -40,
+            }}
+          />
+        )}
+        {chartType === 'radar' && (
+          <ResponsiveRadar
+            data={radarData}
+            keys={['score']}
+            indexBy="metric"
+            margin={{ top: 70, right: 80, bottom: 40, left: 80 }}
+            gridShape="circular"
+            gridLabelOffset={36}
+            dotSize={10}
+            dotColor={{ from: 'color', modifiers: [] }}
+            dotBorderWidth={2}
+            dotBorderColor={{ from: 'color', modifiers: [] }}
+            colors={{ scheme: 'nivo' }}
+            fillOpacity={0.25}
+            blendMode="multiply"
+            animate={true}
+            motionConfig="wobbly"
+          />
+        )}
+      </div>
+    </div>
+  );
+};
+export default Chart;
--- a/src/renderer/components/Experiment/Eval/EvalJobsTable.tsx
+++ b/src/renderer/components/Experiment/Eval/EvalJobsTable.tsx
@@ -11,6 +11,7 @@ import {
 } from '@mui/joy';
 import {
  ChartColumnBigIcon,
+  ChartColumnIncreasingIcon,
  FileDigitIcon,
  Grid3X3Icon,
  Trash2Icon,
@@ -76,7 +77,9 @@ const EvalJobsTable = () => {
  const [openCSVModal, setOpenCSVModal] = useState(false);
  const [openPlotModal, setOpenPlotModal] = useState(false);
  const [currentJobId, setCurrentJobId] = useState('');
-  const [fileNameForDetailedReport, setFileNameForDetailedReport] = useState('');
+  const [currentScore, setCurrentScore] = useState('');
+  const [fileNameForDetailedReport, setFileNameForDetailedReport] =
+    useState('');
  const fetchCSV = async (jobId) => {
    const response = await fetch(
@@ -100,8 +103,9 @@ const EvalJobsTable = () => {
    setOpenCSVModal(true);
  };
-  const handleOpenPlotModal = (jobId) => {
+  const handleOpenPlotModal = (jobId, score) => {
    setCurrentJobId(jobId);
+    setCurrentScore(score);
    setOpenPlotModal(true);
  };
@@ -121,6 +125,7 @@ const EvalJobsTable = () => {
        open={openPlotModal}
        onClose={() => setOpenPlotModal(false)}
        jobId={currentJobId}
+        score={currentScore}
      />
      <ViewOutputModalStreaming
        jobId={viewOutputFromJob}
@@ -165,40 +170,44 @@ const EvalJobsTable = () => {
                </td> */}
                <td>
                  <RenderScore score={job?.job_data?.score} />
-                  {job?.job_data?.additional_output_path && (
+                  {job?.job_data?.additional_output_path &&
-                  job.job_data.additional_output_path.toLowerCase().endsWith('.csv') ? (
+                    (job.job_data.additional_output_path
-                    <Link
+                      .toLowerCase()
-                      onClick={() => handleOpenCSVModal(job?.id)}
+                      .endsWith('.csv') ? (
-                      sx={{ mt: 1, ml: 1 }}
+                      <Link
-                      startDecorator={<Grid3X3Icon size="14px" />}
+                        onClick={() => handleOpenCSVModal(job?.id)}
-                    >
+                        sx={{ mt: 1, ml: 1 }}
-                      Detailed Report
+                        startDecorator={<Grid3X3Icon size="14px" />}
-                    </Link>
+                      >
-                  ) : (
+                        Detailed Report
-                    <Link
+                      </Link>
-                      onClick={() => {
+                    ) : (
-                        setFileNameForDetailedReport(job?.job_data?.additional_output_path);
+                      <Link
-                        setViewOutputFromJob(job?.id);
+                        onClick={() => {
-                      }}
+                          setFileNameForDetailedReport(
-                      sx={{ mt: 1, ml: 1 }}
+                            job?.job_data?.additional_output_path
-                      startDecorator={<Grid3X3Icon size="14px" />}
+                          );
-                    >
+                          setViewOutputFromJob(job?.id);
-                      Detailed Report
+                        }}
-                    </Link>
+                        sx={{ mt: 1, ml: 1 }}
-                  )
+                        startDecorator={<Grid3X3Icon size="14px" />}
-                )}
+                      >
-                  {/* {job?.job_data?.plot_data_path && (
+                        Detailed Report
+                      </Link>
+                    ))}
+                  {job?.job_data?.plot_data_path && (
                    <Link
-                      onClick={() => handleOpenPlotModal(job?.id)}
+                      onClick={() =>
+                        handleOpenPlotModal(job?.id, job?.job_data?.score)
+                      }
                      sx={{ mt: 1, ml: 1 }}
-                      startDecorator={<Grid3X3Icon size="14px" />}
+                      startDecorator={<ChartColumnIncreasingIcon size="14px" />}
                    >
-                      View Figure
+                      Chart
                    </Link>
-                  )} */}
+                  )}
                </td>
                <td>
                  <ButtonGroup
                    variant="soft"

--- a/src/renderer/components/Experiment/Eval/ViewPlotModal.tsx
+++ b/src/renderer/components/Experiment/Eval/ViewPlotModal.tsx
 import React from 'react';
 import { Modal, ModalDialog, ModalClose, Box, Typography } from '@mui/joy';
+import Chart from './Chart';
 import * as chatAPI from 'renderer/lib/transformerlab-api-sdk';
-interface ViewPlotModalProps {
+function parseJSON(score) {
-  isOpen: boolean;
+  try {
-  imageUrl: string;
+    return JSON.parse(score);
-  onClose: () => void;
+  } catch {
+    return [];
+  }
 }
-const ViewPlotModal: React.FC<ViewPlotModalProps> = ({ open, onClose, jobId }) => {
+export default function ViewPlotModal({ open, onClose, jobId, score }) {
-  const [plotData, setPlotData] = React.useState<string | null>(null);
+  if (!jobId) {
+    return <></>;
-  const fetchPlot = async (jobId: string) => {
+  }
-    const response = await fetch(chatAPI.Endpoints.Experiment.GetPlotJSON(jobId));
-    const jsonResponse = await response.json();
-    return JSON.stringify(jsonResponse);
-  };
-  React.useEffect(() => {
-    if (jobId) {
-      fetchPlot(jobId).then(setPlotData);
-    }
-  }, [jobId]);
  return (
    <Modal open={open} onClose={onClose}>
-      <ModalDialog sx={{ width: '90vw', height: '90vh', pt: 5, position: 'relative' }}>
+      <ModalDialog
+        sx={{ width: '90vw', height: '90vh', pt: 5, position: 'relative' }}
+      >
        <ModalClose />
-        <Box sx={{ display: 'flex', flexDirection: 'column', alignItems: 'center' }}>
+        <Box
+          sx={{
+            display: 'flex',
+            flexDirection: 'column',
+            alignItems: 'center',
+          }}
+        >
          <Typography level="h4" mb={2}>
-            Figure Preview
+            Chart
          </Typography>
          <Box
            sx={{
-              maxWidth: '100%',
+              width: '100%',
+              maxWidth: '800px',
              maxHeight: '80vh',
              overflowY: 'auto',
              borderRadius: '8px',
@@ -41,12 +43,10 @@ const ViewPlotModal: React.FC<ViewPlotModalProps> = ({ open, onClose, jobId }) =
              p: 2,
            }}
          >
-            {plotData}
+            <Chart metrics={parseJSON(score)} />
          </Box>
        </Box>
      </ModalDialog>
    </Modal>
  );
-};
+}
-export default ViewPlotModal;
--- a/src/renderer/components/Nav/Sidebar.tsx
+++ b/src/renderer/components/Nav/Sidebar.tsx
@@ -25,6 +25,7 @@ import {
  LogsIcon,
  SquareStackIcon,
  FileIcon,
+  ChartColumnIncreasingIcon,
 } from 'lucide-react';
 import { ButtonGroup, IconButton, Sheet, Tooltip } from '@mui/joy';
@@ -177,7 +178,7 @@ export default function Sidebar({
        <SubNavItem
          title="Evaluate"
          path="/projects/eval"
-          icon={<HelpCircleIcon />}
+          icon={<ChartColumnIncreasingIcon />}
          disabled={!experimentInfo?.name}
        />
        <SubNavItem