Add code to update scoregraph when active bracket changes

assets/js/scoreboard.js

@@ -12,9 +12,10 @@ const scoreboardUpdateInterval = window.scoreboardUpdateInterval || 300000;
 Alpine.data("ScoreboardDetail", () => ({
   data: {},
   show: true,
+  activeBracket: null,
 
   async update() {
-    this.data = await CTFd.pages.scoreboard.getScoreboardDetail(10);
+    this.data = await CTFd.pages.scoreboard.getScoreboardDetail(10, this.activeBracket);
 
     let optionMerge = window.scoreboardChartOptions;
     let option = getOption(CTFd.config.userMode, this.data, optionMerge);
@@ -38,15 +39,15 @@ Alpine.data("ScoreboardList", () => ({
   activeBracket: null,
 
   async update() {
-    let response = await CTFd.fetch(`/api/v1/brackets?type=${CTFd.config.userMode}`, {
-      method: "GET",
-    });
-    const body = await response.json();
-    this.brackets = body["data"];
+    this.brackets = await CTFd.pages.scoreboard.getBrackets(CTFd.config.userMode);
     this.standings = await CTFd.pages.scoreboard.getScoreboard();
   },
 
   async init() {
+    this.$watch("activeBracket", value => {
+      this.$dispatch("bracket-change", value);
+    });
+
     this.update();
 
     setInterval(() => {

assets/js/utils/graphs/echarts/index.js

@@ -34,7 +34,11 @@ echarts.use([
 
 export function embed(target, option) {
   let chart = echarts.init(target);
-  chart.setOption(option);
+
+  // https://echarts.apache.org/en/api.html#echartsInstance.setOption
+  // https://github.com/apache/echarts/issues/6202#issuecomment-315054637
+  // https://stackoverflow.com/a/72211534
+  chart.setOption(option, true);
 
   window.addEventListener("resize", () => {
     if (chart) {

package.json

@@ -10,7 +10,7 @@
     "verify": "vite build; git diff --quiet --exit-code"
   },
   "dependencies": {
-    "@ctfdio/ctfd-js": "^0.0.12",
+    "@ctfdio/ctfd-js": "^0.0.14",
     "@fontsource/lato": "^4.5.3",
     "@fontsource/raleway": "^4.5.3",
     "@fortawesome/fontawesome-free": "6.5.1",

static/assets/page.3c5083de.js

@@ -0,0 +1 @@
+import{C as o,m as d}from"./index.2e31e3b8.js";window.CTFd=o;window.Alpine=d;d.start();