Add comments section to admin users/teams pages. (#1600)

* Add a comments section for a user's page in the Admin Panel
* Move user graphs into a modal for Admin Panel
* Create a new webpack JS chunk for the admin section for the Vue components (`components.js`)
  - Not really sure why webpack needed this to be separated out
* Closes #1052

CTFd/themes/admin/assets/js/components/comments/CommentBox.vue

@@ -97,7 +97,7 @@ export default {
       if (comment.length > 0) {
         helpers.comments.add_comment(
           comment,
-          "challenge",
+          this.$props.type,
           this.getArgs(),
           () => {
             this.loadComments();

CTFd/themes/admin/assets/js/pages/team.js

@@ -4,6 +4,8 @@ import CTFd from "core/CTFd";
 import { htmlEntities } from "core/utils";
 import { ezAlert, ezQuery, ezBadge } from "core/ezq";
 import { createGraph, updateGraph } from "core/graphs";
+import Vue from "vue/dist/vue.esm.browser";
+import CommentBox from "../components/comments/CommentBox.vue";
 
 function createTeam(event) {
   event.preventDefault();
@@ -481,11 +483,30 @@ $(() => {
 
   $("#team-info-edit-form").submit(updateTeam);
 
+  // Insert CommentBox element
+  const commentBox = Vue.extend(CommentBox);
+  let vueContainer = document.createElement("div");
+  document.querySelector("#comment-box").appendChild(vueContainer);
+  new commentBox({
+    propsData: { type: "team", id: window.TEAM_ID }
+  }).$mount(vueContainer);
+
   let type, id, name, account_id;
   ({ type, id, name, account_id } = window.stats_data);
 
+  let intervalId;
+  $("#team-statistics-modal").on("shown.bs.modal", function(_e) {
     createGraphs(type, id, name, account_id);
-  setInterval(() => {
+    intervalId = setInterval(() => {
       updateGraphs(type, id, name, account_id);
     }, 300000);
   });
+
+  $("#team-statistics-modal").on("hidden.bs.modal", function(_e) {
+    clearInterval(intervalId);
+  });
+
+  $(".statistics-team").click(function(_event) {
+    $("#team-statistics-modal").modal("toggle");
+  });
+});

CTFd/themes/admin/assets/js/pages/user.js

@@ -4,6 +4,8 @@ import CTFd from "core/CTFd";
 import { htmlEntities } from "core/utils";
 import { ezQuery, ezBadge } from "core/ezq";
 import { createGraph, updateGraph } from "core/graphs";
+import Vue from "vue/dist/vue.esm.browser";
+import CommentBox from "../components/comments/CommentBox.vue";
 
 function createUser(event) {
   event.preventDefault();
@@ -441,11 +443,30 @@ $(() => {
   $("#user-info-edit-form").submit(updateUser);
   $("#user-award-form").submit(awardUser);
 
+  // Insert CommentBox element
+  const commentBox = Vue.extend(CommentBox);
+  let vueContainer = document.createElement("div");
+  document.querySelector("#comment-box").appendChild(vueContainer);
+  new commentBox({
+    propsData: { type: "user", id: window.USER_ID }
+  }).$mount(vueContainer);
+
   let type, id, name, account_id;
   ({ type, id, name, account_id } = window.stats_data);
 
+  let intervalId;
+  $("#user-statistics-modal").on("shown.bs.modal", function(_e) {
     createGraphs(type, id, name, account_id);
-  setInterval(() => {
+    intervalId = setInterval(() => {
       updateGraphs(type, id, name, account_id);
     }, 300000);
   });
+
+  $("#user-statistics-modal").on("hidden.bs.modal", function(_e) {
+    clearInterval(intervalId);
+  });
+
+  $(".statistics-user").click(function(_event) {
+    $("#user-statistics-modal").modal("toggle");
+  });
+});

CTFd/themes/admin/static/js/helpers.min.js

@@ -1 +1 @@
-(window.webpackJsonp=window.webpackJsonp||[]).push([[0],{"./CTFd/themes/core/assets/js/helpers.js":function(e,t,n){Object.defineProperty(t,"__esModule",{value:!0}),t.default=void 0;var d=r(n("./node_modules/jquery/dist/jquery.js")),p=r(n("./CTFd/themes/core/assets/js/ezq.js")),o=n("./CTFd/themes/core/assets/js/utils.js");function r(e){return e&&e.__esModule?e:{default:e}}function s(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function f(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var n=[],o=!0,r=!1,i=void 0;try{for(var s,a=e[Symbol.iterator]();!(o=(s=a.next()).done)&&(n.push(s.value),!t||n.length!==t);o=!0);}catch(e){r=!0,i=e}finally{try{o||null==a.return||a.return()}finally{if(r)throw i}}return n}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance")}()}var i={files:{upload:function(t,e,n){var o=window.CTFd;t instanceof d.default&&(t=t[0]);var r=new FormData(t);r.append("nonce",o.config.csrfNonce);for(var i=0,s=Object.entries(e);i<s.length;i++){var a=f(s[i],2),l=a[0],c=a[1];r.append(l,c)}var u=p.default.ezProgressBar({width:0,title:"Upload Progress"});d.default.ajax({url:o.config.urlRoot+"/api/v1/files",data:r,type:"POST",cache:!1,contentType:!1,processData:!1,xhr:function(){var e=d.default.ajaxSettings.xhr();return e.upload.onprogress=function(e){if(e.lengthComputable){var t=e.loaded/e.total*100;u=p.default.ezProgressBar({target:u,width:t})}},e},success:function(e){t.reset(),u=p.default.ezProgressBar({target:u,width:100}),setTimeout(function(){u.modal("hide")},500),n&&n(e)}})}},comments:{get_comments:function(e){return window.CTFd.fetch("/api/v1/comments?"+d.default.param(e),{method:"GET",credentials:"same-origin",headers:{Accept:"application/json","Content-Type":"application/json"}}).then(function(e){return e.json()})},add_comment:function(e,t,n,o){var r=window.CTFd,i=function(t){for(var e=1;e<arguments.length;e++)if(e%2){var n=null!=arguments[e]?arguments[e]:{},o=Object.keys(n);"function"==typeof Object.getOwnPropertySymbols&&(o=o.concat(Object.getOwnPropertySymbols(n).filter(function(e){return Object.getOwnPropertyDescriptor(n,e).enumerable}))),o.forEach(function(e){s(t,e,n[e])})}else Object.defineProperties(t,Object.getOwnPropertyDescriptors(arguments[e]));return t}({content:e,type:t},n);r.fetch("/api/v1/comments",{method:"POST",credentials:"same-origin",headers:{Accept:"application/json","Content-Type":"application/json"},body:JSON.stringify(i)}).then(function(e){return e.json()}).then(function(e){o&&o(e)})},delete_comment:function(e){return window.CTFd.fetch("/api/v1/comments/".concat(e),{method:"DELETE",credentials:"same-origin",headers:{Accept:"application/json","Content-Type":"application/json"}}).then(function(e){return e.json()})}},utils:{htmlEntities:o.htmlEntities,colorHash:o.colorHash,copyToClipboard:o.copyToClipboard},ezq:p.default};t.default=i},"./node_modules/markdown-it/lib/helpers/index.js":function(e,t,n){t.parseLinkLabel=n("./node_modules/markdown-it/lib/helpers/parse_link_label.js"),t.parseLinkDestination=n("./node_modules/markdown-it/lib/helpers/parse_link_destination.js"),t.parseLinkTitle=n("./node_modules/markdown-it/lib/helpers/parse_link_title.js")},"./node_modules/markdown-it/lib/helpers/parse_link_destination.js":function(e,t,n){var a=n("./node_modules/markdown-it/lib/common/utils.js").unescapeAll;e.exports=function(e,t,n){var o,r,i=t,s={ok:!1,pos:0,lines:0,str:""};if(60===e.charCodeAt(t)){for(t++;t<n;){if(10===(o=e.charCodeAt(t)))return s;if(62===o)return s.pos=t+1,s.str=a(e.slice(i+1,t)),s.ok=!0,s;92===o&&t+1<n?t+=2:t++}return s}for(r=0;t<n&&32!==(o=e.charCodeAt(t))&&!(o<32||127===o);)if(92===o&&t+1<n)t+=2;else{if(40===o&&r++,41===o){if(0===r)break;r--}t++}return i===t||0!==r||(s.str=a(e.slice(i,t)),s.lines=0,s.pos=t,s.ok=!0),s}},"./node_modules/markdown-it/lib/helpers/parse_link_label.js":function(e,t,n){e.exports=function(e,t,n){var o,r,i,s,a=-1,l=e.posMax,c=e.pos;for(e.pos=t+1,o=1;e.pos<l;){if(93===(i=e.src.charCodeAt(e.pos))&&0===--o){r=!0;break}if(s=e.pos,e.md.inline.skipToken(e),91===i)if(s===e.pos-1)o++;else if(n)return e.pos=c,-1}return r&&(a=e.pos),e.pos=c,a}},"./node_modules/markdown-it/lib/helpers/parse_link_title.js":function(e,t,n){var l=n("./node_modules/markdown-it/lib/common/utils.js").unescapeAll;e.exports=function(e,t,n){var o,r,i=0,s=t,a={ok:!1,pos:0,lines:0,str:""};if(n<=t)return a;if(34!==(r=e.charCodeAt(t))&&39!==r&&40!==r)return a;for(t++,40===r&&(r=41);t<n;){if((o=e.charCodeAt(t))===r)return a.pos=t+1,a.lines=i,a.str=l(e.slice(s+1,t)),a.ok=!0,a;10===o?i++:92===o&&t+1<n&&(t++,10===e.charCodeAt(t)&&i++),t++}return a}}}]);
+(window.webpackJsonp=window.webpackJsonp||[]).push([[1],{"./CTFd/themes/core/assets/js/helpers.js":function(e,t,n){Object.defineProperty(t,"__esModule",{value:!0}),t.default=void 0;var d=r(n("./node_modules/jquery/dist/jquery.js")),p=r(n("./CTFd/themes/core/assets/js/ezq.js")),o=n("./CTFd/themes/core/assets/js/utils.js");function r(e){return e&&e.__esModule?e:{default:e}}function s(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function f(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var n=[],o=!0,r=!1,i=void 0;try{for(var s,a=e[Symbol.iterator]();!(o=(s=a.next()).done)&&(n.push(s.value),!t||n.length!==t);o=!0);}catch(e){r=!0,i=e}finally{try{o||null==a.return||a.return()}finally{if(r)throw i}}return n}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance")}()}var i={files:{upload:function(t,e,n){var o=window.CTFd;t instanceof d.default&&(t=t[0]);var r=new FormData(t);r.append("nonce",o.config.csrfNonce);for(var i=0,s=Object.entries(e);i<s.length;i++){var a=f(s[i],2),l=a[0],c=a[1];r.append(l,c)}var u=p.default.ezProgressBar({width:0,title:"Upload Progress"});d.default.ajax({url:o.config.urlRoot+"/api/v1/files",data:r,type:"POST",cache:!1,contentType:!1,processData:!1,xhr:function(){var e=d.default.ajaxSettings.xhr();return e.upload.onprogress=function(e){if(e.lengthComputable){var t=e.loaded/e.total*100;u=p.default.ezProgressBar({target:u,width:t})}},e},success:function(e){t.reset(),u=p.default.ezProgressBar({target:u,width:100}),setTimeout(function(){u.modal("hide")},500),n&&n(e)}})}},comments:{get_comments:function(e){return window.CTFd.fetch("/api/v1/comments?"+d.default.param(e),{method:"GET",credentials:"same-origin",headers:{Accept:"application/json","Content-Type":"application/json"}}).then(function(e){return e.json()})},add_comment:function(e,t,n,o){var r=window.CTFd,i=function(t){for(var e=1;e<arguments.length;e++)if(e%2){var n=null!=arguments[e]?arguments[e]:{},o=Object.keys(n);"function"==typeof Object.getOwnPropertySymbols&&(o=o.concat(Object.getOwnPropertySymbols(n).filter(function(e){return Object.getOwnPropertyDescriptor(n,e).enumerable}))),o.forEach(function(e){s(t,e,n[e])})}else Object.defineProperties(t,Object.getOwnPropertyDescriptors(arguments[e]));return t}({content:e,type:t},n);r.fetch("/api/v1/comments",{method:"POST",credentials:"same-origin",headers:{Accept:"application/json","Content-Type":"application/json"},body:JSON.stringify(i)}).then(function(e){return e.json()}).then(function(e){o&&o(e)})},delete_comment:function(e){return window.CTFd.fetch("/api/v1/comments/".concat(e),{method:"DELETE",credentials:"same-origin",headers:{Accept:"application/json","Content-Type":"application/json"}}).then(function(e){return e.json()})}},utils:{htmlEntities:o.htmlEntities,colorHash:o.colorHash,copyToClipboard:o.copyToClipboard},ezq:p.default};t.default=i},"./node_modules/markdown-it/lib/helpers/index.js":function(e,t,n){t.parseLinkLabel=n("./node_modules/markdown-it/lib/helpers/parse_link_label.js"),t.parseLinkDestination=n("./node_modules/markdown-it/lib/helpers/parse_link_destination.js"),t.parseLinkTitle=n("./node_modules/markdown-it/lib/helpers/parse_link_title.js")},"./node_modules/markdown-it/lib/helpers/parse_link_destination.js":function(e,t,n){var a=n("./node_modules/markdown-it/lib/common/utils.js").unescapeAll;e.exports=function(e,t,n){var o,r,i=t,s={ok:!1,pos:0,lines:0,str:""};if(60===e.charCodeAt(t)){for(t++;t<n;){if(10===(o=e.charCodeAt(t)))return s;if(62===o)return s.pos=t+1,s.str=a(e.slice(i+1,t)),s.ok=!0,s;92===o&&t+1<n?t+=2:t++}return s}for(r=0;t<n&&32!==(o=e.charCodeAt(t))&&!(o<32||127===o);)if(92===o&&t+1<n)t+=2;else{if(40===o&&r++,41===o){if(0===r)break;r--}t++}return i===t||0!==r||(s.str=a(e.slice(i,t)),s.lines=0,s.pos=t,s.ok=!0),s}},"./node_modules/markdown-it/lib/helpers/parse_link_label.js":function(e,t,n){e.exports=function(e,t,n){var o,r,i,s,a=-1,l=e.posMax,c=e.pos;for(e.pos=t+1,o=1;e.pos<l;){if(93===(i=e.src.charCodeAt(e.pos))&&0===--o){r=!0;break}if(s=e.pos,e.md.inline.skipToken(e),91===i)if(s===e.pos-1)o++;else if(n)return e.pos=c,-1}return r&&(a=e.pos),e.pos=c,a}},"./node_modules/markdown-it/lib/helpers/parse_link_title.js":function(e,t,n){var l=n("./node_modules/markdown-it/lib/common/utils.js").unescapeAll;e.exports=function(e,t,n){var o,r,i=0,s=t,a={ok:!1,pos:0,lines:0,str:""};if(n<=t)return a;if(34!==(r=e.charCodeAt(t))&&39!==r&&40!==r)return a;for(t++,40===r&&(r=41);t<n;){if((o=e.charCodeAt(t))===r)return a.pos=t+1,a.lines=i,a.str=l(e.slice(s+1,t)),a.ok=!0,a;10===o?i++:92===o&&t+1<n&&(t++,10===e.charCodeAt(t)&&i++),t++}return a}}}]);

CTFd/themes/admin/static/js/pages/challenges.dev.js

@@ -147,7 +147,7 @@
 /******/
 /******/
 /******/ 	// add entry module to deferred list
-/******/ 	deferredModules.push(["./CTFd/themes/admin/assets/js/pages/challenges.js","helpers","vendor","default~pages/challenge~pages/challenges~pages/configs~pages/editor~pages/main~pages/notifications~p~d5a3cc0a"]);
+/******/ 	deferredModules.push(["./CTFd/themes/admin/assets/js/pages/challenges.js","components","helpers","vendor","default~pages/challenge~pages/challenges~pages/configs~pages/editor~pages/main~pages/notifications~p~d5a3cc0a"]);
 /******/ 	// run deferred modules when ready
 /******/ 	return checkDeferredModules();
 /******/ })

CTFd/themes/admin/static/js/pages/configs.dev.js

@@ -147,7 +147,7 @@
 /******/
 /******/
 /******/ 	// add entry module to deferred list
-/******/ 	deferredModules.push(["./CTFd/themes/admin/assets/js/pages/configs.js","helpers","vendor","default~pages/challenge~pages/challenges~pages/configs~pages/editor~pages/main~pages/notifications~p~d5a3cc0a"]);
+/******/ 	deferredModules.push(["./CTFd/themes/admin/assets/js/pages/configs.js","components","helpers","vendor","default~pages/challenge~pages/challenges~pages/configs~pages/editor~pages/main~pages/notifications~p~d5a3cc0a"]);
 /******/ 	// run deferred modules when ready
 /******/ 	return checkDeferredModules();
 /******/ })

CTFd/themes/admin/static/js/pages/editor.dev.js

@@ -147,7 +147,7 @@
 /******/
 /******/
 /******/ 	// add entry module to deferred list
-/******/ 	deferredModules.push(["./CTFd/themes/admin/assets/js/pages/editor.js","helpers","vendor","default~pages/challenge~pages/challenges~pages/configs~pages/editor~pages/main~pages/notifications~p~d5a3cc0a"]);
+/******/ 	deferredModules.push(["./CTFd/themes/admin/assets/js/pages/editor.js","components","helpers","vendor","default~pages/challenge~pages/challenges~pages/configs~pages/editor~pages/main~pages/notifications~p~d5a3cc0a"]);
 /******/ 	// run deferred modules when ready
 /******/ 	return checkDeferredModules();
 /******/ })

CTFd/themes/admin/static/js/pages/main.dev.js

@@ -147,7 +147,7 @@
 /******/
 /******/
 /******/ 	// add entry module to deferred list
-/******/ 	deferredModules.push(["./CTFd/themes/admin/assets/js/pages/main.js","helpers","vendor","default~pages/challenge~pages/challenges~pages/configs~pages/editor~pages/main~pages/notifications~p~d5a3cc0a"]);
+/******/ 	deferredModules.push(["./CTFd/themes/admin/assets/js/pages/main.js","components","helpers","vendor","default~pages/challenge~pages/challenges~pages/configs~pages/editor~pages/main~pages/notifications~p~d5a3cc0a"]);
 /******/ 	// run deferred modules when ready
 /******/ 	return checkDeferredModules();
 /******/ })

CTFd/themes/admin/static/js/pages/notifications.dev.js

@@ -147,7 +147,7 @@
 /******/
 /******/
 /******/ 	// add entry module to deferred list
-/******/ 	deferredModules.push(["./CTFd/themes/admin/assets/js/pages/notifications.js","helpers","vendor","default~pages/challenge~pages/challenges~pages/configs~pages/editor~pages/main~pages/notifications~p~d5a3cc0a"]);
+/******/ 	deferredModules.push(["./CTFd/themes/admin/assets/js/pages/notifications.js","components","helpers","vendor","default~pages/challenge~pages/challenges~pages/configs~pages/editor~pages/main~pages/notifications~p~d5a3cc0a"]);
 /******/ 	// run deferred modules when ready
 /******/ 	return checkDeferredModules();
 /******/ })

CTFd/themes/admin/static/js/pages/pages.dev.js

@@ -147,7 +147,7 @@
 /******/
 /******/
 /******/ 	// add entry module to deferred list
-/******/ 	deferredModules.push(["./CTFd/themes/admin/assets/js/pages/pages.js","helpers","vendor","default~pages/challenge~pages/challenges~pages/configs~pages/editor~pages/main~pages/notifications~p~d5a3cc0a"]);
+/******/ 	deferredModules.push(["./CTFd/themes/admin/assets/js/pages/pages.js","components","helpers","vendor","default~pages/challenge~pages/challenges~pages/configs~pages/editor~pages/main~pages/notifications~p~d5a3cc0a"]);
 /******/ 	// run deferred modules when ready
 /******/ 	return checkDeferredModules();
 /******/ })

CTFd/themes/admin/static/js/pages/reset.dev.js

@@ -147,7 +147,7 @@
 /******/
 /******/
 /******/ 	// add entry module to deferred list
-/******/ 	deferredModules.push(["./CTFd/themes/admin/assets/js/pages/reset.js","helpers","vendor","default~pages/challenge~pages/challenges~pages/configs~pages/editor~pages/main~pages/notifications~p~d5a3cc0a"]);
+/******/ 	deferredModules.push(["./CTFd/themes/admin/assets/js/pages/reset.js","components","helpers","vendor","default~pages/challenge~pages/challenges~pages/configs~pages/editor~pages/main~pages/notifications~p~d5a3cc0a"]);
 /******/ 	// run deferred modules when ready
 /******/ 	return checkDeferredModules();
 /******/ })

CTFd/themes/admin/static/js/pages/scoreboard.dev.js

@@ -147,7 +147,7 @@
 /******/
 /******/
 /******/ 	// add entry module to deferred list
-/******/ 	deferredModules.push(["./CTFd/themes/admin/assets/js/pages/scoreboard.js","helpers","vendor","default~pages/challenge~pages/challenges~pages/configs~pages/editor~pages/main~pages/notifications~p~d5a3cc0a"]);
+/******/ 	deferredModules.push(["./CTFd/themes/admin/assets/js/pages/scoreboard.js","components","helpers","vendor","default~pages/challenge~pages/challenges~pages/configs~pages/editor~pages/main~pages/notifications~p~d5a3cc0a"]);
 /******/ 	// run deferred modules when ready
 /******/ 	return checkDeferredModules();
 /******/ })

CTFd/themes/admin/static/js/pages/statistics.dev.js

@@ -147,7 +147,7 @@
 /******/
 /******/
 /******/ 	// add entry module to deferred list
-/******/ 	deferredModules.push(["./CTFd/themes/admin/assets/js/pages/statistics.js","helpers","echarts","vendor","default~pages/challenge~pages/challenges~pages/configs~pages/editor~pages/main~pages/notifications~p~d5a3cc0a"]);
+/******/ 	deferredModules.push(["./CTFd/themes/admin/assets/js/pages/statistics.js","components","helpers","echarts","vendor","default~pages/challenge~pages/challenges~pages/configs~pages/editor~pages/main~pages/notifications~p~d5a3cc0a"]);
 /******/ 	// run deferred modules when ready
 /******/ 	return checkDeferredModules();
 /******/ })

CTFd/themes/admin/static/js/pages/submissions.dev.js

@@ -147,7 +147,7 @@
 /******/
 /******/
 /******/ 	// add entry module to deferred list
-/******/ 	deferredModules.push(["./CTFd/themes/admin/assets/js/pages/submissions.js","helpers","vendor","default~pages/challenge~pages/challenges~pages/configs~pages/editor~pages/main~pages/notifications~p~d5a3cc0a"]);
+/******/ 	deferredModules.push(["./CTFd/themes/admin/assets/js/pages/submissions.js","components","helpers","vendor","default~pages/challenge~pages/challenges~pages/configs~pages/editor~pages/main~pages/notifications~p~d5a3cc0a"]);
 /******/ 	// run deferred modules when ready
 /******/ 	return checkDeferredModules();
 /******/ })

CTFd/themes/admin/static/js/pages/teams.dev.js

@@ -147,7 +147,7 @@
 /******/
 /******/
 /******/ 	// add entry module to deferred list
-/******/ 	deferredModules.push(["./CTFd/themes/admin/assets/js/pages/teams.js","helpers","vendor","default~pages/challenge~pages/challenges~pages/configs~pages/editor~pages/main~pages/notifications~p~d5a3cc0a"]);
+/******/ 	deferredModules.push(["./CTFd/themes/admin/assets/js/pages/teams.js","components","helpers","vendor","default~pages/challenge~pages/challenges~pages/configs~pages/editor~pages/main~pages/notifications~p~d5a3cc0a"]);
 /******/ 	// run deferred modules when ready
 /******/ 	return checkDeferredModules();
 /******/ })

CTFd/themes/admin/static/js/pages/users.dev.js

@@ -147,7 +147,7 @@
 /******/
 /******/
 /******/ 	// add entry module to deferred list
-/******/ 	deferredModules.push(["./CTFd/themes/admin/assets/js/pages/users.js","helpers","vendor","default~pages/challenge~pages/challenges~pages/configs~pages/editor~pages/main~pages/notifications~p~d5a3cc0a"]);
+/******/ 	deferredModules.push(["./CTFd/themes/admin/assets/js/pages/users.js","components","helpers","vendor","default~pages/challenge~pages/challenges~pages/configs~pages/editor~pages/main~pages/notifications~p~d5a3cc0a"]);
 /******/ 	// run deferred modules when ready
 /******/ 	return checkDeferredModules();
 /******/ })

CTFd/themes/admin/static/js/vendor.bundle.min.js

@@ -1,4 +1,4 @@
-(window.webpackJsonp=window.webpackJsonp||[]).push([[1],{"./node_modules/bootstrap/dist/js/bootstrap.bundle.js":function(o,i,a){(function(no){var e,t,n,r;function ro(e){return(ro="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}
+(window.webpackJsonp=window.webpackJsonp||[]).push([[2],{"./node_modules/bootstrap/dist/js/bootstrap.bundle.js":function(o,i,a){(function(no){var e,t,n,r;function ro(e){return(ro="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}
 /*!
   * Bootstrap v4.3.1 (https://getbootstrap.com/)
   * Copyright 2011-2019 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)

CTFd/themes/admin/templates/base.html

@@ -143,6 +143,7 @@
 	<script defer src="{{ url_for('views.themes', theme='admin', path='js/vendor.bundle.js') }}"></script>
 	<script defer src="{{ url_for('views.themes', theme='admin', path='js/core.js') }}"></script>
 	<script defer src="{{ url_for('views.themes', theme='admin', path='js/helpers.js') }}"></script>
+	<script defer src="{{ url_for('views.themes', theme='admin', path='js/components.js') }}"></script>
 
 	{% block entrypoint %}
 	<script defer src="{{ url_for('views.themes', theme='admin', path='js/pages/main.js') }}"></script>

CTFd/themes/admin/templates/modals/teams/statistics.html

@@ -0,0 +1,23 @@
+<div class="row min-vh-25">
+	{% if solves %}
+		<div id="keys-pie-graph" class="col-md-6 d-flex align-items-center">
+			<div class="text-center w-100">
+				<i class="fas fa-circle-notch fa-spin fa-3x fa-fw spinner"></i>
+			</div>
+		</div>
+		<div id="categories-pie-graph" class="col-md-6 d-flex align-items-center">
+			<div class="text-center w-100">
+				<i class="fas fa-circle-notch fa-spin fa-3x fa-fw spinner"></i>
+			</div>
+		</div>
+		<div id="score-graph" class="col-md-12 d-flex align-items-center">
+			<div class="text-center w-100">
+				<i class="fas fa-circle-notch fa-spin fa-3x fa-fw spinner"></i>
+			</div>
+		</div>
+	{% else %}
+		<h3 class="opacity-50 text-center w-100 justify-content-center align-self-center">
+			No data yet
+		</h3>
+	{% endif %}
+</div>

CTFd/themes/admin/templates/modals/users/statistics.html

@@ -0,0 +1,23 @@
+<div class="row min-vh-25">
+	{% if solves %}
+		<div id="keys-pie-graph" class="col-md-6 d-flex align-items-center">
+			<div class="text-center w-100">
+				<i class="fas fa-circle-notch fa-spin fa-3x fa-fw spinner"></i>
+			</div>
+		</div>
+		<div id="categories-pie-graph" class="col-md-6 d-flex align-items-center">
+			<div class="text-center w-100">
+				<i class="fas fa-circle-notch fa-spin fa-3x fa-fw spinner"></i>
+			</div>
+		</div>
+		<div id="score-graph" class="col-md-12 d-flex align-items-center">
+			<div class="text-center w-100">
+				<i class="fas fa-circle-notch fa-spin fa-3x fa-fw spinner"></i>
+			</div>
+		</div>
+	{% else %}
+		<h3 class="opacity-50 text-center w-100 justify-content-center align-self-center">
+			No data yet
+		</h3>
+	{% endif %}
+</div>

CTFd/themes/admin/templates/teams/team.html

@@ -20,6 +20,22 @@
 	</div>
 </div>
 
+<div id="team-statistics-modal" class="modal fade">
+	<div class="modal-dialog modal-xl">
+		<div class="modal-content">
+			<div class="modal-header">
+				<h2 class="modal-action text-center w-100">Team Statistics</h2>
+				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
+					<span aria-hidden="true">&times;</span>
+				</button>
+			</div>
+			<div class="modal-body clearfix">
+				{% include "admin/modals/teams/statistics.html" %}
+			</div>
+		</div>
+	</div>
+</div>
+
 <div id="team-captain-modal" class="modal fade">
 	<div class="modal-dialog">
 		<div class="modal-content">
@@ -140,6 +156,10 @@
 				<i class="btn-fa fas fa-pencil-alt fa-2x px-2" data-toggle="tooltip" data-placement="top"
 				   title="Edit Team"></i>
 			</a>
+			<a class="statistics-team text-dark">
+				<i class="btn-fa fas fa-chart-pie fa-2x px-2" data-toggle="tooltip" data-placement="top"
+				   title="Team Statistics"></i>
+			</a>
 			<a class="edit-captain text-dark">
 				<i class="btn-fa fas fa-user-tag fa-2x px-2" data-toggle="tooltip" data-placement="top"
 				   title="Choose Captain"></i>
@@ -167,31 +187,7 @@
 </div>
 
 <div class="container">
-	<div class="row min-vh-25">
+	<div class="row min-vh-25 pt-5 pb-5">
-		{% if solves %}
-			<div id="keys-pie-graph" class="col-md-6 d-flex align-items-center">
-				<div class="text-center w-100">
-					<i class="fas fa-circle-notch fa-spin fa-3x fa-fw spinner"></i>
-				</div>
-			</div>
-			<div id="categories-pie-graph" class="col-md-6 d-flex align-items-center">
-				<div class="text-center w-100">
-					<i class="fas fa-circle-notch fa-spin fa-3x fa-fw spinner"></i>
-				</div>
-			</div>
-			<div id="score-graph" class="col-md-12 d-flex align-items-center">
-				<div class="text-center w-100">
-					<i class="fas fa-circle-notch fa-spin fa-3x fa-fw spinner"></i>
-				</div>
-			</div>
-		{% else %}
-			<h3 class="opacity-50 text-center w-100 justify-content-center align-self-center">
-				No solves yet
-			</h3>
-		{% endif %}
-	</div>
-
-	<div class="row pt-5 min-vh-25">
 		<div class="col-md-12">
 			<table class="table table-striped">
 				<h3 class="text-center">Team Members</h3>
@@ -249,7 +245,7 @@
 		   aria-controls="nav-missing" aria-selected="false">Missing</a>
 	</nav>
 
-	<div class="tab-content min-vh-50" id="nav-tabContent">
+	<div class="tab-content min-vh-50 pb-5" id="nav-tabContent">
 		<div class="tab-pane fade show active" id="nav-solves" role="tabpanel" aria-labelledby="nav-solves-tab">
 			<h3 class="text-center pt-5 d-block">Solves</h3>
 			<div class="row">
@@ -489,6 +485,13 @@
 			</div>
 		</div>
 	</div>
+
+	<div class="row min-vh-25 pt-5">
+		<div class="col-md-10 offset-md-1">
+			<div id="comment-box">
+			</div>
+		</div>
+	</div>
 </div>
 
 {% endblock %}

CTFd/themes/admin/templates/users/user.html

@@ -20,6 +20,22 @@
 	</div>
 </div>
 
+<div id="user-statistics-modal" class="modal fade">
+	<div class="modal-dialog modal-xl">
+		<div class="modal-content">
+			<div class="modal-header">
+				<h2 class="modal-action text-center w-100">User Statistics</h2>
+				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
+					<span aria-hidden="true">&times;</span>
+				</button>
+			</div>
+			<div class="modal-body clearfix">
+				{% include "admin/modals/users/statistics.html" %}
+			</div>
+		</div>
+	</div>
+</div>
+
 <div id="user-award-modal" class="modal fade">
 	<div class="modal-dialog">
 		<div class="modal-content">
@@ -133,6 +149,9 @@
 			<a class="edit-user text-dark">
 				<i class="btn-fa fas fa-user-edit fa-2x px-2" data-toggle="tooltip" data-placement="top" title="Edit User"></i>
 			</a>
+			<a class="statistics-user text-dark">
+				<i class="btn-fa fas fa-chart-pie fa-2x px-2" data-toggle="tooltip" data-placement="top" title="User Statistics"></i>
+			</a>
 			<a class="award-user text-dark">
 				<i class="btn-fa fas fa-trophy fa-2x px-2" data-toggle="tooltip" data-placement="top" title="Award User"></i>
 			</a>
@@ -158,29 +177,6 @@
 </div>
 
 <div class="container">
-	<div class="row min-vh-25">
-		{% if solves %}
-			<div id="keys-pie-graph" class="col-md-6 d-flex align-items-center">
-				<div class="text-center w-100">
-					<i class="fas fa-circle-notch fa-spin fa-3x fa-fw spinner"></i>
-				</div>
-			</div>
-			<div id="categories-pie-graph" class="col-md-6 d-flex align-items-center">
-				<div class="text-center w-100">
-					<i class="fas fa-circle-notch fa-spin fa-3x fa-fw spinner"></i>
-				</div>
-			</div>
-			<div id="score-graph" class="col-md-12 d-flex align-items-center">
-				<div class="text-center w-100">
-					<i class="fas fa-circle-notch fa-spin fa-3x fa-fw spinner"></i>
-				</div>
-			</div>
-		{% else %}
-			<h3 class="opacity-50 text-center w-100 justify-content-center align-self-center">No solves yet</h3>
-		{% endif %}
-	</div>
-
-
 	<nav class="nav nav-tabs nav-fill pt-5" id="myTab" role="tablist">
 		<a class="nav-item nav-link active" id="nav-solves-tab" data-toggle="tab" href="#nav-solves" role="tab"
 		   aria-controls="nav-solves" aria-selected="true">Solves</a>
@@ -195,7 +191,7 @@
 		   aria-controls="nav-missing" aria-selected="false">Missing</a>
 	</nav>
 
-	<div class="tab-content min-vh-50" id="nav-tabContent">
+	<div class="tab-content min-vh-25 pb-5" id="nav-tabContent">
 		<div class="tab-pane fade show active" id="nav-solves" role="tabpanel" aria-labelledby="nav-solves-tab">
 			<h3 class="text-center pt-5 d-block">Solves</h3>
 			<div class="row">
@@ -419,6 +415,13 @@
 			</div>
 		</div>
 	</div>
+
+	<div class="row min-vh-25 pt-5">
+		<div class="col-md-10 offset-md-1">
+			<div id="comment-box">
+			</div>
+		</div>
+	</div>
 </div>
 
 {% endblock %}

CTFd/themes/core/assets/js/graphs.js

@@ -318,3 +318,7 @@ export function updateGraph(
   let chart = echarts.init(document.querySelector(target));
   chart.setOption(cfg.format(type, id, name, account_id, data));
 }
+
+export function disposeGraph(target) {
+  echarts.dispose(document.querySelector(target));
+}

webpack.config.js

@@ -104,6 +104,13 @@ function getJSConfig(root, type, entries, mode) {
             priority: 1,
             reuseExistingChunk: true,
           },
+          components: {
+            name: 'components',
+            filename: `components.${ext}.js`,
+            test: /components/,
+            priority: 1,
+            reuseExistingChunk: true,
+          },
           default: {
             filename: `core.${ext}.js`,
             minChunks: 2,