diff --git a/Gruntfile.js b/Gruntfile.js
index 336498303a1..b039764be61 100644
--- a/Gruntfile.js
+++ b/Gruntfile.js
@@ -196,8 +196,9 @@ module.exports = function(grunt) {
'frontend/express/public/core/home/javascripts/countly.models.js',
'frontend/express/public/core/home/javascripts/countly.views.js',
'frontend/express/public/core/notes/javascripts/countly.views.js',
+ 'frontend/express/public/core/version-history/javascripts/countly.views.js',
'frontend/express/public/core/onboarding/javascripts/countly.models.js',
- 'frontend/express/public/core/onboarding/javascripts/countly.views.js',
+ 'frontend/express/public/core/onboarding/javascripts/countly.views.js'
],
dest: 'frontend/express/public/javascripts/min/countly.lib.concat.js'
}
diff --git a/frontend/express/public/core/version-history/javascripts/countly.views.js b/frontend/express/public/core/version-history/javascripts/countly.views.js
new file mode 100755
index 00000000000..1993d2bc802
--- /dev/null
+++ b/frontend/express/public/core/version-history/javascripts/countly.views.js
@@ -0,0 +1,63 @@
+/* global countlyVue, app, countlyGlobal, countlyVersionHistoryManager, CV, jQuery*/
+var VersionHistoryView = countlyVue.views.create({
+ template: CV.T('/core/version-history/templates/version-history.html'),
+ data: function() {
+ return {
+ tableData: {
+ db: [],
+ fs: [],
+ pkg: "",
+ mongo: ""
+ }
+ };
+ },
+ mounted: function() {
+ this.tableData = countlyVersionHistoryManager.getData(true) || this.tableData;
+ },
+ methods: {
+ getTable: function(dataObj) {
+ if (!Array.isArray(dataObj)) {
+ dataObj = [];
+ }
+ if (dataObj.length === 0) {
+ dataObj.push({"version": countlyGlobal.countlyVersion, "updated": new Date().toString()});
+ dataObj[dataObj.length - 1].version += " " + jQuery.i18n.map["version_history.current-version"];
+
+ }
+ else {
+ dataObj[dataObj.length - 1].version = this.tableData.pkg + " " + jQuery.i18n.map["version_history.current-version"];
+ dataObj[dataObj.length - 1].updated = new Date(dataObj[dataObj.length - 1].updated).toString();
+ }
+
+ return dataObj;
+ }
+ },
+ computed: {
+ dbTitle: function() {
+ return jQuery.i18n.map["version_history.page-title"] + " (DB)";
+ },
+ fsTitle: function() {
+ return jQuery.i18n.map["version_history.page-title"] + " (FS)";
+ },
+ packageVersion: function() {
+ return jQuery.i18n.map["version_history.package-version"] + ": " + this.tableData.pkg;
+ },
+ mongoVersion: function() {
+ return "MongDb version: " + this.tableData.mongo;
+ },
+ versionHistoryViewDbRows: function() {
+ return this.getTable(this.tableData.db);
+
+ },
+ versionHistoryViewFsRows: function() {
+ return this.getTable(this.tableData.fs);
+ }
+
+ }
+});
+
+app.route("/versions", 'versions', function() {
+ this.renderWhenReady(new CV.views.BackboneWrapper({
+ component: VersionHistoryView
+ }));
+});
diff --git a/frontend/express/public/core/version-history/stylesheets/_main.scss b/frontend/express/public/core/version-history/stylesheets/_main.scss
new file mode 100755
index 00000000000..df188ba040e
--- /dev/null
+++ b/frontend/express/public/core/version-history/stylesheets/_main.scss
@@ -0,0 +1,5 @@
+.header{
+ display: flex;
+ flex-direction: column; /* Stack divs vertically */
+ gap: 20px; /* Add space between divs */
+ }
\ No newline at end of file
diff --git a/frontend/express/public/core/version-history/templates/version-history.html b/frontend/express/public/core/version-history/templates/version-history.html
new file mode 100755
index 00000000000..d6f9c1f6956
--- /dev/null
+++ b/frontend/express/public/core/version-history/templates/version-history.html
@@ -0,0 +1,38 @@
+
+
+
+
+
+
+
+
+
+
+
+ {{ dbTitle }}
+
+
+
+
+
+
+
+
+
+
+
+ {{ fsTitle }}
+
+
+
+
+
+
+
+
+
+
+
diff --git a/frontend/express/public/javascripts/countly/countly.views.js b/frontend/express/public/javascripts/countly/countly.views.js
index e784a68b284..dbbfe076ad8 100644
--- a/frontend/express/public/javascripts/countly/countly.views.js
+++ b/frontend/express/public/javascripts/countly/countly.views.js
@@ -1,4 +1,4 @@
-/* global countlyView, countlyCommon, app, CountlyHelpers, countlyGlobal, Handlebars, countlyTaskManager, countlyVersionHistoryManager, DownloadView, VersionHistoryView, Backbone, jQuery, $*/
+/* global countlyView, countlyCommon, app, CountlyHelpers, countlyGlobal, countlyTaskManager, countlyVersionHistoryManager, DownloadView, Backbone, jQuery, $*/
window.DashboardView = countlyView.extend({
renderCommon: function() {
@@ -58,83 +58,6 @@ window.DownloadView = countlyView.extend({
}
});
-window.VersionHistoryView = countlyView.extend({
- initialize: function() {
- this.template = Handlebars.compile($("#version-history-template").html());
- },
- beforeRender: function() {
- return $.when(countlyVersionHistoryManager.initialize()).then(function() {});
- },
- renderCommon: function(isRefresh) {
-
- var tableData = countlyVersionHistoryManager.getData(true) || {fs: [], db: [], pkg: "", "mongo": ""};
-
- //provide template data
- this.templateData = {
- "db-title": jQuery.i18n.map["version_history.page-title"] + " (DB)",
- "fs-title": jQuery.i18n.map["version_history.page-title"] + " (FS)",
- "package-version": jQuery.i18n.map["version_history.package-version"] + ": " + tableData.pkg,
- "mongo-version": "MongDb version:" + tableData.mongo
- };
-
- /**
- * Processes version history and returns a DataTable config
- * @param {object} dataObj Version history array
- * @returns {object} DataTable configuration
- */
- function getTable(dataObj) {
-
- if (!Array.isArray(dataObj)) {
- dataObj = [];
- }
- if (dataObj.length === 0) {
- dataObj.push({"version": countlyGlobal.countlyVersion, "updated": Date.now()});
- }
- else {
- dataObj[dataObj.length - 1].version += (" " + jQuery.i18n.map["version_history.current-version"]);
- }
-
- return {
- "aaData": dataObj,
- "fnRowCallback": function(nRow, aData) {
- $(nRow).attr("data-id", aData._id);
- //$(nRow).attr("data-name", aData.report_name || aData.name || '-');
- },
- "aoColumns": [
- {
- "mData": function(row) {
- return row.version;
- },
- "sType": "string",
- "sTitle": jQuery.i18n.map["version_history.version"],
- "bSortable": false,
- "sClass": "break"
- },
- {
- "mData": function(row) {
- return new Date(row.updated);
- },
- "sType": "numeric",
- "sTitle": jQuery.i18n.map["version_history.upgraded"],
- "bSortable": true,
- "sClass": "break"
- }
- ]
- };
- }
-
- if (!isRefresh) {
- //set data
- $(this.el).html(this.template(this.templateData));
-
- this.dtableFs = $('#data-table-fs').dataTable($.extend({"searching": false, "paging": false}, $.fn.dataTable.defaults, getTable(tableData.fs)));
- this.dtableFs.fnSort([ [1, 'desc'] ]);
- this.dtableDb = $('#data-table-db').dataTable($.extend({"searching": false, "paging": false}, $.fn.dataTable.defaults, getTable(tableData.db)));
- this.dtableDb.fnSort([ [1, 'desc'] ]);
- }
- }
-});
-
$.ajaxPrefilter(function(options, originalOptions, jqXHR) {
//jqXHR.setRequestHeader('X-CSRFToken', csrf_token);
if (countlyGlobal.auth_token) {
@@ -151,7 +74,6 @@ $.ajaxPrefilter(function(options, originalOptions, jqXHR) {
//register views
app.DownloadView = new DownloadView();
-app.VersionHistoryView = new VersionHistoryView();
// app.route("/analytics/events", "events", function() {
@@ -169,10 +91,6 @@ app.route('/exportedData/tableExport/:task_id', 'userExportTask', function(task_
this.renderWhenReady(this.DownloadView);
});
-app.route('/versions', 'version_history', function() {
- this.renderWhenReady(this.VersionHistoryView);
-});
-
app.addAppSwitchCallback(function() {
$.when(countlyVersionHistoryManager.initialize()).then(function() {
var versionsData = countlyVersionHistoryManager.getData(true) || {fs: [], db: [], pkg: ""};
diff --git a/frontend/express/public/javascripts/countly/vue/components/sidebar.js b/frontend/express/public/javascripts/countly/vue/components/sidebar.js
index ecb1a876640..514fa05c0f1 100644
--- a/frontend/express/public/javascripts/countly/vue/components/sidebar.js
+++ b/frontend/express/public/javascripts/countly/vue/components/sidebar.js
@@ -567,6 +567,7 @@
return {
selectedMenuOptionLocal: null,
versionInfo: countlyGlobal.countlyTypeName,
+ countlySidebarVersionPath: '/dashboard#/' + countlyCommon.ACTIVE_APP_ID + '/versions',
showMainMenu: true,
redirectHomePage: '/dashboard#/' + countlyCommon.ACTIVE_APP_ID,
onOptionsMenu: false,
diff --git a/frontend/express/public/javascripts/countly/vue/templates/sidebar/sidebar.html b/frontend/express/public/javascripts/countly/vue/templates/sidebar/sidebar.html
index fd893df921c..51b730b3447 100644
--- a/frontend/express/public/javascripts/countly/vue/templates/sidebar/sidebar.html
+++ b/frontend/express/public/javascripts/countly/vue/templates/sidebar/sidebar.html
@@ -41,7 +41,7 @@
-
+
diff --git a/frontend/express/public/stylesheets/styles/manifest.scss b/frontend/express/public/stylesheets/styles/manifest.scss
index c7b6ba56753..e5bf0b70380 100644
--- a/frontend/express/public/stylesheets/styles/manifest.scss
+++ b/frontend/express/public/stylesheets/styles/manifest.scss
@@ -51,4 +51,5 @@
@use "../../core/home/stylesheets/main" as home-main-style;
@use "../../core/app-management/stylesheets/main" as app-management-main-style;
@use "../../core/report-manager/stylesheets/main" as report-manager-main-style;
-@use "../../core/onboarding/stylesheets/main" as onboarding-main-style;
\ No newline at end of file
+@use "../../core/version-history/stylesheets/main" as version-history-main-style;
+@use "../../core/onboarding/stylesheets/main" as onboarding-main-style;
diff --git a/frontend/express/views/dashboard.html b/frontend/express/views/dashboard.html
index 75ef10f9491..2a41d52f2cf 100644
--- a/frontend/express/views/dashboard.html
+++ b/frontend/express/views/dashboard.html
@@ -1601,28 +1601,6 @@