remove pipeline() chain

it cannot be chained afaict

.eslintrc.json

@@ -8,10 +8,6 @@
         "ecmaVersion": 2020
     },
     "rules": {
-        "indent": [
-            "error",
-            4
-        ],
         "linebreak-style": [
             "error",
             "unix"

CHANGES

@@ -2591,6 +2591,7 @@
 * support: fix crash when opening tickets with 0 length files
 
 [7.4.0]
+* **IMPORTANT**: This is the last release of Cloudron to support Ubuntu 18.04. Please [upgrade](https://docs.cloudron.io/guides/upgrade-ubuntu-20/) to Ubuntu 20.04 (Focal Fossa) at the earliest.
 * Update base image to jammy
 * backups: Add idrive e2
 * Support proxyAuth for proxy app
@@ -2623,3 +2624,63 @@
 * notifications: email configuration error shown incorrectly
 * OpenID: add RSA-SHA256 signature algorithm
 
+[7.4.2]
+* dns: Add Bunny.net
+* Fix ipv4 vs ipv6 detection
+* Fix misleading pending security updates message
+
+[7.4.3]
+* **IMPORTANT**: This is the last release of Cloudron to support Ubuntu 18.04. Please [upgrade](https://docs.cloudron.io/guides/upgrade-ubuntu-20/) to Ubuntu 20.04 (Focal Fossa) at the earliest.
+* postgresql: fix for supporting Taiga with postgres 14
+
+[7.5.0]
+* **IMPORTANT**: This is the last release of Cloudron to support CPUs without AVX support. AVX support is required for MongoDB 5.0. See https://forum.cloudron.io/topic/8785/avx-support-in-your-vps-server for more information.
+* acme: handle LE validation type cache logic
+* improve viewing of logs
+* redis: update to 7.0.11
+* ionos profitbricks: add new regions Berlin and Logrono
+* docker: update to 23.0.6
+* network: trusted IPs
+* mail: fix crash when editing quota of new mailboxes
+* mail: update haraka to 3.0.2
+* mail: fix issue where client IP was leaked in headers
+* mail: skip SPF check of authenticated senders
+* filemanager: new UI, support for large folders and lazy loading
+* oidc: make UI translatable
+* oidc: dashboard login uses oidc
+* web terminal: Copy selected terminal text with ctrl shift c
+* Expose alias domains as `CLOUDRON_ALIAS_DOMAINS`
+
+[7.5.1]
+* **IMPORTANT**: This is the last release of Cloudron to support CPUs without AVX support. AVX support is required for MongoDB 5.0. See https://forum.cloudron.io/topic/8785/avx-support-in-your-vps-server for more information.
+* mail: Fix issue where mail usage sizes where reported incorrectly
+* filemanager: Only init vue app after we fetch language files to avoid UI shaking
+* mail: Clear the correct mail status notification
+* filemanager: allow pasting on non-folders to cwd
+* mail: give resolver more time
+* dashboard: backup logs links are grayed out because of z-index
+* branding: make oidc login does not use cloudron name
+* translation: fix crash when translated text has single quote (french)
+* dyndns: show logs
+* mail: server location get it's own section
+* optional services: redis & turn . joins sendmail, recvmail
+* backups: encrypted backups must have .enc extension
+* mail: add virtual all mail mailbox
+* redirections: use 301 (permanent) instead of 302 (temporary) for redirections. this is better for SEO links
+* graphs: show old backup size if > 1GB
+* docker: fix image pruning
+* Major overhaul of the REST API
+* Fix import via SSHFS and CIFS
+
+[7.5.2]
+* mail: Fix default max mail size to 25MB (and not 25MiB)
+* dashboard: disable 2fa setup for external users
+* filemanager: Always show app or volume name
+* filemanager: fix logs button link
+* backups: add Contabo object storage
+* Fix incorrect migration of directory server setting
+* support: Add explicit billing issue ticket type
+* Fix broken directory server config migration
+* system: fix crash updating disk usage
+* Fix crash in renew certs call from cron
+

README.md

@@ -50,17 +50,6 @@ the dashboard, database addons, graph container, base image etc. Cloudron also r
 on external services such as the App Store for apps to be installed. As such, don't
 clone this repo and npm install and expect something to work.
 
-## Development
-
-This is the backend code of Cloudron. The frontend code is [here](https://git.cloudron.io/cloudron/dashboard).
-
-The way to develop is to first install a full instance of Cloudron in a VM. Then you can use the [hotfix](https://git.cloudron.io/cloudron/cloudron-machine)
-tool to patch the VM with the latest code.
-
-```
-SSH_PASSPHRASE=sshkeypassword cloudron-machine hotfix --cloudron my.example.com --release 6.0.0 --ssh-key keyname
-```
-
 ## License
 
 Please note that the Cloudron code is under a source-available license. This is not the same as an

box.js

@@ -9,7 +9,6 @@ const fs = require('fs'),
     proxyAuth = require('./src/proxyauth.js'),
     safe = require('safetydance'),
     server = require('./src/server.js'),
-    settings = require('./src/settings.js'),
     directoryServer = require('./src/directoryserver.js');
 
 let logFd;
@@ -39,7 +38,7 @@ async function startServers() {
     await proxyAuth.start();
     await ldap.start();
 
-    const conf = await settings.getDirectoryServerConfig();
+    const conf = await directoryServer.getConfig();
     if (conf.enabled) await directoryServer.start();
 }
 
@@ -52,7 +51,7 @@ async function main() {
 
     process.on('SIGHUP', async function () {
         debug('Received SIGHUP. Re-reading configs.');
-        const conf = await settings.getDirectoryServerConfig();
+        const conf = await directoryServer.getConfig();
         if (conf.enabled) await directoryServer.checkCertificate();
     });
 
@@ -79,8 +78,6 @@ async function main() {
     });
 
     process.on('uncaughtException', (error) => exitSync({ error, code: 1 }));
-
-    console.log(`Cloudron is up and running. Logs are at ${paths.BOX_LOG_FILE}`); // this goes to journalctl
 }
 
 main();

crashnotifierservice.js

@@ -1,22 +0,0 @@
-#!/usr/bin/env node
-
-'use strict';
-
-const database = require('./src/database.js');
-
-const crashNotifier = require('./src/crashnotifier.js');
-
-// This is triggered by systemd with the crashed unit name as argument
-async function main() {
-    if (process.argv.length !== 3) return console.error('Usage: crashnotifier.js <unitName>');
-
-    const unitName = process.argv[2];
-    console.log('Started crash notifier for', unitName);
-
-    // eventlog api needs the db
-    await database.initialize();
-
-    await crashNotifier.sendFailureLogs(unitName);
-}
-
-main();

dashboard/gulpfile.js

@@ -2,15 +2,15 @@
 
 'use strict';
 
-var argv = require('yargs').argv,
+const argv = require('yargs').argv,
     autoprefixer = require('gulp-autoprefixer'),
     concat = require('gulp-concat'),
     cssnano = require('gulp-cssnano'),
     ejs = require('gulp-ejs'),
     execSync = require('child_process').execSync,
+    fs = require('fs'),
     gulp = require('gulp'),
-    rimraf = require('rimraf'),
-    sass = require('gulp-sass')(require('node-sass')),
+    sass = require('gulp-sass')(require('sass')),
     serve = require('gulp-serve'),
     sourcemaps = require('gulp-sourcemaps');
 
@@ -53,28 +53,11 @@ gulp.task('bootstrap', function () {
         .pipe(gulp.dest('dist/3rdparty/js'));
 });
 
-gulp.task('monaco', function () {
-    return gulp.src('node_modules/monaco-editor/min/**/*')
-        .pipe(gulp.dest('dist/3rdparty/'));
+gulp.task('moment', function () {
+    return gulp.src('node_modules/moment/min/*')
+        .pipe(gulp.dest('dist/3rdparty/js'));
 });
 
-gulp.task('xterm-core', function () {
-    return gulp.src('node_modules/xterm/**/*')
-        .pipe(gulp.dest('dist/3rdparty/xterm'));
-});
-
-gulp.task('xterm-addon-attach', function () {
-    return gulp.src('node_modules/xterm-addon-attach/**/*')
-        .pipe(gulp.dest('dist/3rdparty/xterm-addon-attach'));
-});
-
-gulp.task('xterm-addon-fit', function () {
-    return gulp.src('node_modules/xterm-addon-fit/**/*')
-        .pipe(gulp.dest('dist/3rdparty/xterm-addon-fit'));
-});
-
-gulp.task('xterm', gulp.series(['xterm-core', 'xterm-addon-attach', 'xterm-addon-fit']));
-
 gulp.task('3rdparty-copy', function () {
     return gulp.src([
         'src/3rdparty/**/*.js',
@@ -89,7 +72,7 @@ gulp.task('3rdparty-copy', function () {
     ]).pipe(gulp.dest('dist/3rdparty/'));
 });
 
-gulp.task('3rdparty', gulp.series(['3rdparty-copy', 'monaco', 'xterm', 'bootstrap', 'fontawesome']));
+gulp.task('3rdparty', gulp.series(['3rdparty-copy', 'moment', 'bootstrap', 'fontawesome']));
 
 // --------------
 // JavaScript
@@ -99,7 +82,6 @@ gulp.task('js-index', function () {
     return gulp.src([
         'src/js/index.js',
         'src/js/client.js',
-        'src/js/main.js',
         'src/js/utils.js',
         'src/views/*.js'
     ])
@@ -110,38 +92,11 @@ gulp.task('js-index', function () {
         .pipe(gulp.dest('dist/js'));
 });
 
-gulp.task('js-logs', function () {
-    return gulp.src(['src/js/logs.js', 'src/js/client.js', 'src/js/utils.js'])
+gulp.task('js-passwordreset', function () {
+    return gulp.src(['src/js/passwordreset.js', 'src/js/utils.js'])
         .pipe(ejs({ apiOrigin: apiOrigin, revision: revision, appstore: appstore }, {}, { ext: '.js' }))
         .pipe(sourcemaps.init())
-        .pipe(concat('logs.js', { newLine: ';' }))
-        .pipe(sourcemaps.write())
-        .pipe(gulp.dest('dist/js'));
-});
-
-gulp.task('js-filemanager', function () {
-    return gulp.src(['src/js/filemanager.js', 'src/js/client.js', 'src/js/utils.js', 'src/components/*.js'])
-        .pipe(ejs({ apiOrigin: apiOrigin, revision: revision, appstore: appstore }, {}, { ext: '.js' }))
-        .pipe(sourcemaps.init())
-        .pipe(concat('filemanager.js', { newLine: ';' }))
-        .pipe(sourcemaps.write())
-        .pipe(gulp.dest('dist/js'));
-});
-
-gulp.task('js-terminal', function () {
-    return gulp.src(['src/js/terminal.js', 'src/js/client.js', 'src/js/utils.js'])
-        .pipe(ejs({ apiOrigin: apiOrigin, revision: revision, appstore: appstore }, {}, { ext: '.js' }))
-        .pipe(sourcemaps.init())
-        .pipe(concat('terminal.js', { newLine: ';' }))
-        .pipe(sourcemaps.write())
-        .pipe(gulp.dest('dist/js'));
-});
-
-gulp.task('js-login', function () {
-    return gulp.src(['src/js/login.js', 'src/js/utils.js'])
-        .pipe(ejs({ apiOrigin: apiOrigin, revision: revision, appstore: appstore }, {}, { ext: '.js' }))
-        .pipe(sourcemaps.init())
-        .pipe(concat('login.js', { newLine: ';' }))
+        .pipe(concat('passwordreset.js', { newLine: ';' }))
         .pipe(sourcemaps.write())
         .pipe(gulp.dest('dist/js'));
 });
@@ -182,7 +137,7 @@ gulp.task('js-restore', function () {
         .pipe(gulp.dest('dist/js'));
 });
 
-gulp.task('js', gulp.series([ 'js-index', 'js-logs', 'js-filemanager', 'js-terminal', 'js-login', 'js-setupaccount', 'js-setup', 'js-setupdns', 'js-restore' ]));
+gulp.task('js', gulp.series([ 'js-index', 'js-passwordreset', 'js-setupaccount', 'js-setup', 'js-setupdns', 'js-restore' ]));
 
 // --------------
 // HTML
@@ -192,10 +147,6 @@ gulp.task('html-views', function () {
     return gulp.src('src/views/**/*.html').pipe(gulp.dest('dist/views'));
 });
 
-gulp.task('html-components', function () {
-    return gulp.src('src/components/**/*.html').pipe(gulp.dest('dist/components'));
-});
-
 gulp.task('html-templates', function () {
     return gulp.src('src/templates/**/*').pipe(gulp.dest('dist/templates'));
 });
@@ -204,7 +155,7 @@ gulp.task('html-raw', function () {
     return gulp.src('src/*.html').pipe(ejs({ apiOrigin: apiOrigin, revision: revision }, {}, { ext: '.html' })).pipe(gulp.dest('dist'));
 });
 
-gulp.task('html', gulp.series(['html-views', 'html-components', 'html-templates', 'html-raw']));
+gulp.task('html', gulp.series(['html-views', 'html-templates', 'html-raw']));
 
 // --------------
 // CSS
@@ -240,8 +191,7 @@ gulp.task('timezones', function (done) {
 // --------------
 
 gulp.task('clean', function (done) {
-    rimraf.sync('dist');
-    done();
+    fs.rm('dist', { recursive: true, force: true }, done);
 });
 
 gulp.task('default', gulp.series(['clean', 'html', 'js', 'timezones', '3rdparty', 'translation', 'images', 'css']));
@@ -252,18 +202,14 @@ gulp.task('watch', function (done) {
     gulp.watch(['src/translation/*'], gulp.series(['translation']));
     gulp.watch(['src/**/*.html'], gulp.series(['html']));
     gulp.watch(['src/views/*.html'], gulp.series(['html-views']));
-    gulp.watch(['src/components/*.html'], gulp.series(['html-components']));
     gulp.watch(['src/templates/*.html'], gulp.series(['html-templates']));
     gulp.watch(['scripts/createTimezones.js', 'src/js/utils.js'], gulp.series(['timezones']));
     gulp.watch(['src/js/setup.js', 'src/js/client.js', 'src/js/utils.js'], gulp.series(['js-setup']));
     gulp.watch(['src/js/setupdns.js', 'src/js/client.js', 'src/js/utils.js'], gulp.series(['js-setupdns']));
     gulp.watch(['src/js/restore.js', 'src/js/client.js', 'src/js/utils.js'], gulp.series(['js-restore']));
-    gulp.watch(['src/js/logs.js', 'src/js/client.js', 'src/js/utils.js'], gulp.series(['js-logs']));
-    gulp.watch(['src/js/filemanager.js', 'src/js/client.js', 'src/js/utils.js', 'src/components/*.js'], gulp.series(['js-filemanager']));
-    gulp.watch(['src/js/terminal.js', 'src/js/client.js', 'src/js/utils.js'], gulp.series(['js-terminal']));
-    gulp.watch(['src/js/login.js', 'src/js/utils.js'], gulp.series(['js-login']));
+    gulp.watch(['src/js/passwordreset.js', 'src/js/utils.js'], gulp.series(['js-passwordreset']));
     gulp.watch(['src/js/setupaccount.js', 'src/js/utils.js'], gulp.series(['js-setupaccount']));
-    gulp.watch(['src/js/index.js', 'src/js/client.js', 'src/js/main.js', 'src/views/*.js', 'src/js/utils.js'], gulp.series(['js-index']));
+    gulp.watch(['src/js/index.js', 'src/js/client.js', 'src/views/*.js', 'src/js/utils.js'], gulp.series(['js-index']));
     gulp.watch(['src/3rdparty/**/*'], gulp.series(['3rdparty']));
     done();
 });

dashboard/package.json

@@ -13,9 +13,9 @@
   "author": "",
   "license": "SEE LICENSE IN LICENSE",
   "dependencies": {
-    "@fortawesome/fontawesome-free": "^5.15.4",
-    "bootstrap-sass": "^3.4.1",
-    "chart.js": "^4.1.1",
+    "@fortawesome/fontawesome-free": "^6.4.0",
+    "bootstrap-sass": "^3.4.3",
+    "chart.js": "^4.3.0",
     "gulp": "^4.0.2",
     "gulp-autoprefixer": "^8.0.0",
     "gulp-concat": "^2.6.1",
@@ -24,13 +24,9 @@
     "gulp-sass": "^5.1.0",
     "gulp-serve": "^1.4.0",
     "gulp-sourcemaps": "^3.0.0",
-    "monaco-editor": "^0.34.0",
-    "node-sass": "^7.0.3",
-    "rimraf": "^3.0.2",
-    "xterm": "^5.1.0",
-    "xterm-addon-attach": "^0.8.0",
-    "xterm-addon-fit": "^0.7.0",
-    "yargs": "^17.5.1"
+    "moment": "^2.29.4",
+    "sass": "^1.63.3",
+    "yargs": "^17.7.2"
   },
   "eslintConfig": {
     "env": {

dashboard/scripts/addUsers.js

@@ -24,7 +24,7 @@ function getAccessToken(callback) {
     let username = readlineSync.question('Username: ', {});
     let password = readlineSync.question('Password: ', { noEchoBack: true });
 
-    superagent.post(`https://${cloudronDomain}/api/v1/cloudron/login`, { username: username, password: password }).end(function (error, result) {
+    superagent.post(`https://${cloudronDomain}/api/v1/auth/login`, { username: username, password: password }).end(function (error, result) {
         if (error || result.statusCode !== 200) {
             console.log('Login failed');
             return getAccessToken(callback);
@@ -63,4 +63,4 @@ getAccessToken(function (accessToken) {
 
         console.log('Done');
     });
-});
+});

dashboard/scripts/delUsers.js

@@ -20,7 +20,7 @@ function getAccessToken(callback) {
     let username = readlineSync.question('Username: ', {});
     let password = readlineSync.question('Password: ', { noEchoBack: true });
 
-    superagent.post(`https://${cloudronDomain}/api/v1/cloudron/login`, { username: username, password: password }).end(function (error, result) {
+    superagent.post(`https://${cloudronDomain}/api/v1/auth/login`, { username: username, password: password }).end(function (error, result) {
         if (error || result.statusCode !== 200) {
             console.log('Login failed');
             return getAccessToken(callback);
@@ -66,4 +66,4 @@ getAccessToken(function (accessToken) {
             });
         });
 
-});
+});

dashboard/src/3rdparty/js/contextMenu.js

@@ -1,639 +0,0 @@
-(function($, angular) {
-
-  // eslint-disable-next-line angular/file-name, angular/no-service-method
-  angular.module('ui.bootstrap.contextMenu', [])
-    .service('CustomService', function () {
-      'use strict';
-
-      return {
-        initialize: function (item) {
-          console.log('got here', item);
-        }
-      };
-
-    })
-    .constant('ContextMenuEvents', {
-      // Triggers when all the context menus have been closed
-      ContextMenuAllClosed: 'context-menu-all-closed',
-      // Triggers when any single conext menu is called.
-      // Closing all context menus triggers this for each level open
-      ContextMenuClosed: 'context-menu-closed',
-      // Triggers right before the very first context menu is opened
-      ContextMenuOpening: 'context-menu-opening',
-      // Triggers right after any context menu is opened
-      ContextMenuOpened: 'context-menu-opened'
-    })
-    .directive('contextMenu', ['$rootScope', 'ContextMenuEvents', '$parse', '$q', 'CustomService', '$sce', '$document', '$window', '$compile',
-      function ($rootScope, ContextMenuEvents, $parse, $q, custom, $sce, $document, $window, $compile) {
-
-        var _contextMenus = [];
-        // Contains the element that was clicked to show the context menu
-        var _clickedElement = null;
-        var DEFAULT_ITEM_TEXT = '"New Item';
-        var _emptyText = 'empty';
-
-        function createAndAddOptionText(params) {
-          // Destructuring:
-          var $scope = params.$scope;
-          var item = params.item;
-          var event = params.event;
-          var modelValue = params.modelValue;
-          var $promises = params.$promises;
-          var nestedMenu = params.nestedMenu;
-          var $li = params.$li;
-          var leftOriented = String(params.orientation).toLowerCase() === 'left';
-
-          var optionText = null;
-
-          if (item.html) {
-            if (angular.isFunction(item.html)) {
-              // runs the function that expects a jQuery/jqLite element
-              optionText = item.html($scope);
-            } else {
-              // Incase we want to compile html string to initialize their custom directive in html string
-              if (item.compile) {
-                optionText = $compile(item.html)($scope);
-              } else {
-                // Assumes that the developer already placed a valid jQuery/jqLite element
-                optionText = item.html;
-              }
-            }
-          } else {
-
-            var $a = $('<a>');
-            var $anchorStyle = {};
-
-            if (leftOriented) {
-              $anchorStyle.textAlign = 'right';
-              $anchorStyle.paddingLeft = '8px';
-            } else {
-              $anchorStyle.textAlign = 'left';
-              $anchorStyle.paddingRight = '8px';
-            }
-
-            $a.css($anchorStyle);
-            $a.addClass('dropdown-item');
-            $a.attr({ tabindex: '-1', href: '#' });
-
-            var textParam = item.text || item[0];
-            var text = DEFAULT_ITEM_TEXT;
-
-            if (typeof textParam === 'string') {
-              text = textParam;
-            } else if (typeof textParam === 'function') {
-              text = textParam.call($scope, $scope, event, modelValue);
-            }
-
-            var $promise = $q.when(text);
-            $promises.push($promise);
-            $promise.then(function (pText) {
-              if (nestedMenu) {
-                var $arrow;
-                var $boldStyle = {
-                  fontFamily: 'monospace',
-                  fontWeight: 'bold'
-                };
-
-                if (leftOriented) {
-                  $arrow = '&lt;';
-                  $boldStyle.float = 'left';
-                } else {
-                  $arrow = '&gt;';
-                  $boldStyle.float = 'right';
-                }
-
-                var $bold = $('<strong style="font-family:monospace;font-weight:bold;float:right;">' + $arrow + '</strong>');
-                $bold.css($boldStyle);
-                $a.css('cursor', 'default');
-                $a.append($bold);
-              }
-              $a.append(pText);
-            });
-
-            optionText = $a;
-          }
-
-          $li.append(optionText);
-
-          return optionText;
-        };
-
-        /**
-         * Process each individual item
-         *
-         * Properties of params:
-         * - $scope
-         * - event
-         * - modelValue
-         * - level
-         * - item
-         * - $ul
-         * - $li
-         * - $promises
-         */
-        function processItem(params) {
-          var nestedMenu = extractNestedMenu(params);
-
-          // if html property is not defined, fallback to text, otherwise use default text
-          // if first item in the item array is a function then invoke .call()
-          // if first item is a string, then text should be the string.
-
-          var text = DEFAULT_ITEM_TEXT;
-          var currItemParam = angular.extend({}, params);
-          var item = params.item;
-          var enabled = item.enabled === undefined ? item[2] : item.enabled;
-
-          currItemParam.nestedMenu = nestedMenu;
-          currItemParam.enabled = resolveBoolOrFunc(enabled, params);
-          currItemParam.text = createAndAddOptionText(currItemParam);
-
-          registerCurrentItemEvents(currItemParam);
-
-        };
-
-        /*
-         * Registers the appropriate mouse events for options if the item is enabled.
-         * Otherwise, it ensures that clicks to the item do not propagate.
-         */
-        function registerCurrentItemEvents (params) {
-          // Destructuring:
-          var item = params.item;
-          var $ul = params.$ul;
-          var $li = params.$li;
-          var $scope = params.$scope;
-          var modelValue = params.modelValue;
-          var level = params.level;
-          var event = params.event;
-          var text = params.text;
-          var nestedMenu = params.nestedMenu;
-          var enabled = params.enabled;
-          var orientation = String(params.orientation).toLowerCase();
-          var customClass = params.customClass;
-
-          if (enabled) {
-            var openNestedMenu = function ($event) {
-              removeContextMenus(level + 1);
-              /*
-               * The object here needs to be constructed and filled with data
-               * on an "as needed" basis. Copying the data from event directly
-               * or cloning the event results in unpredictable behavior.
-               */
-              /// adding the original event in the object to use the attributes of the mouse over event in the promises
-              var ev = {
-                pageX: orientation === 'left' ? event.pageX - $ul[0].offsetWidth + 1 : event.pageX + $ul[0].offsetWidth - 1,
-                pageY: $ul[0].offsetTop + $li[0].offsetTop - 3,
-                // eslint-disable-next-line angular/window-service
-                view: event.view || window,
-                target: event.target,
-                event: $event
-              };
-
-              /*
-               * At this point, nestedMenu can only either be an Array or a promise.
-               * Regardless, passing them to `when` makes the implementation singular.
-               */
-              $q.when(nestedMenu).then(function(promisedNestedMenu) {
-                if (angular.isFunction(promisedNestedMenu)) {
-                  //  support for dynamic subitems
-                  promisedNestedMenu = promisedNestedMenu.call($scope, $scope, event, modelValue, text, $li);
-                }
-                var nestedParam = {
-                  $scope : $scope,
-                  event : ev,
-                  options : promisedNestedMenu,
-                  modelValue : modelValue,
-                  level : level + 1,
-                  orientation: orientation,
-                  customClass: customClass
-                };
-                renderContextMenu(nestedParam);
-              });
-            };
-
-            $li.on('click', function ($event) {
-              if($event.which == 1) {
-                $event.preventDefault();
-                $scope.$apply(function () {
-
-                  var cleanupFunction = function () {
-                    $(event.currentTarget).removeClass('context');
-                    removeAllContextMenus();
-                  };
-                  var clickFunction = angular.isFunction(item.click)
-                    ? item.click
-                    : (angular.isFunction(item[1])
-                      ? item[1]
-                      : null);
-
-                  if (clickFunction) {
-                    var res = clickFunction.call($scope, $scope, event, modelValue, text, $li);
-                    if(res === undefined || res) {
-                      cleanupFunction();
-                    }
-                  } else {
-                    cleanupFunction();
-                  }
-                });
-              }
-            });
-
-            $li.on('mouseover', function ($event) {
-              $scope.$apply(function () {
-                if (nestedMenu) {
-                  openNestedMenu($event);
-                } else {
-                  removeContextMenus(level + 1);
-                }
-              });
-            });
-          } else {
-            setElementDisabled($li);
-          }
-        };
-
-        /**
-         * @param params - an object containing the `item` parameter
-         * @returns an Array or a Promise containing the children,
-         *          or null if the option has no submenu
-         */
-        function extractNestedMenu(params) {
-          // Destructuring:
-          var item = params.item;
-
-          // New implementation:
-          if (item.children) {
-            if (angular.isFunction(item.children)) {
-              // Expects a function that returns a Promise or an Array
-              return item.children();
-            } else if (angular.isFunction(item.children.then) || angular.isArray(item.children)) {
-              // Returns the promise
-              // OR, returns the actual array
-              return item.children;
-            }
-
-            return null;
-
-          } else {
-            // nestedMenu is either an Array or a Promise that will return that array.
-            // NOTE: This might be changed soon as it's a hangover from an old implementation
-
-            return angular.isArray(item[1]) ||
-                (item[1] && angular.isFunction(item[1].then)) ? item[1] : angular.isArray(item[2]) ||
-                (item[2] && angular.isFunction(item[2].then)) ? item[2] : angular.isArray(item[3]) ||
-                (item[3] && angular.isFunction(item[3].then)) ? item[3] : null;
-          }
-        }
-
-        /**
-         * Responsible for the actual rendering of the context menu.
-         *
-         * The parameters in params are:
-         * - $scope = the scope of this context menu
-         * - event = the event that triggered this context menu
-         * - options = the options for this context menu
-         * - modelValue = the value of the model attached to this context menu
-         * - level = the current context menu level (defauts to 0)
-         * - customClass = the custom class to be used for the context menu
-         */
-        function renderContextMenu (params) {
-          /// <summary>Render context menu recursively.</summary>
-
-          // Destructuring:
-          var $scope = params.$scope;
-          var event = params.event;
-          var options = params.options;
-          var modelValue = params.modelValue;
-          var level = params.level;
-          var customClass = params.customClass;
-
-          // Initialize the container. This will be passed around
-          var $ul = initContextMenuContainer(params);
-          params.$ul = $ul;
-
-          // Register this level of the context menu
-          _contextMenus.push($ul);
-
-          /*
-           * This object will contain any promises that we have
-           * to wait for before trying to adjust the context menu.
-           */
-          var $promises = [];
-          params.$promises = $promises;
-
-          angular.forEach(options, function (item) {
-
-            if (item === null) {
-              appendDivider($ul);
-            } else {
-              // If displayed is anything other than a function or a boolean
-              var displayed = resolveBoolOrFunc(item.displayed, params);
-
-              // Only add the <li> if the item is displayed
-              if (displayed) {
-                var $li = $('<li>');
-                var itemParams = angular.extend({}, params);
-                itemParams.item = item;
-                itemParams.$li = $li;
-
-                if (typeof item[0] === 'object') {
-                  custom.initialize($li, item);
-                } else {
-                  processItem(itemParams);
-                }
-                if (resolveBoolOrFunc(item.hasTopDivider, itemParams, false)) {
-                  appendDivider($ul);
-                }
-                $ul.append($li);
-                if (resolveBoolOrFunc(item.hasBottomDivider, itemParams, false)) {
-                  appendDivider($ul);
-                }
-              }
-            }
-          });
-
-          if ($ul.children().length === 0) {
-            var $emptyLi = angular.element('<li>');
-            setElementDisabled($emptyLi);
-            $emptyLi.html('<a>' + _emptyText + '</a>');
-            $ul.append($emptyLi);
-          }
-
-          $document.find('body').append($ul);
-
-          doAfterAllPromises(params);
-
-          $rootScope.$broadcast(ContextMenuEvents.ContextMenuOpened, {
-            context: _clickedElement,
-            contextMenu: $ul,
-            params: params
-          });
-        };
-
-        /**
-         * calculate if drop down menu would go out of screen at left or bottom
-         * calculation need to be done after element has been added (and all texts are set; thus the promises)
-         * to the DOM the get the actual height
-         */
-        function doAfterAllPromises (params) {
-
-          // Desctructuring:
-          var $ul = params.$ul;
-          var $promises = params.$promises;
-          var level = params.level;
-          var event = params.event;
-          var leftOriented = String(params.orientation).toLowerCase() === 'left';
-
-          $q.all($promises).then(function () {
-            var topCoordinate  = event.pageY;
-            var menuHeight = angular.element($ul[0]).prop('offsetHeight');
-            var winHeight = $window.pageYOffset + event.view.innerHeight;
-
-            /// the 20 pixels in second condition are considering the browser status bar that sometimes overrides the element
-            if (topCoordinate > menuHeight && winHeight - topCoordinate < menuHeight + 20) {
-              topCoordinate = event.pageY - menuHeight;
-              /// If the element is a nested menu, adds the height of the parent li to the topCoordinate to align with the parent
-              if(level && level > 0) {
-                topCoordinate += event.event.currentTarget.offsetHeight;
-              }
-            } else if(winHeight <= menuHeight) {
-              // If it really can't fit, reset the height of the menu to one that will fit
-              angular.element($ul[0]).css({ 'height': winHeight - 5, 'overflow-y': 'scroll' });
-              // ...then set the topCoordinate height to 0 so the menu starts from the top
-              topCoordinate = 0;
-            } else if(winHeight - topCoordinate < menuHeight) {
-              var reduceThresholdY = 5;
-              if(topCoordinate < reduceThresholdY) {
-                reduceThresholdY = topCoordinate;
-              }
-              topCoordinate = winHeight - menuHeight - reduceThresholdY;
-            }
-
-            var leftCoordinate = event.pageX;
-            var menuWidth = angular.element($ul[0]).prop('offsetWidth');
-            var winWidth = event.view.innerWidth + window.pageXOffset;
-            var padding = 5;
-
-            if (leftOriented) {
-              if (winWidth - leftCoordinate > menuWidth && leftCoordinate < menuWidth + padding) {
-                leftCoordinate = padding;
-              } else if (leftCoordinate < menuWidth) {
-                var reduceThresholdX = 5;
-                if (winWidth - leftCoordinate < reduceThresholdX + padding) {
-                  reduceThresholdX = winWidth - leftCoordinate + padding;
-                }
-                leftCoordinate = menuWidth + reduceThresholdX + padding;
-              } else {
-                leftCoordinate = leftCoordinate - menuWidth;
-              }
-            } else {
-              if (leftCoordinate > menuWidth && winWidth - leftCoordinate - padding < menuWidth) {
-                leftCoordinate = winWidth - menuWidth - padding;
-              } else if(winWidth - leftCoordinate < menuWidth) {
-                var reduceThresholdX = 5;
-                if(leftCoordinate < reduceThresholdX + padding) {
-                  reduceThresholdX = leftCoordinate + padding;
-                }
-                leftCoordinate = winWidth - menuWidth - reduceThresholdX - padding;
-              }
-            }
-
-            $ul.css({
-              display: 'block',
-              position: 'absolute',
-              left: leftCoordinate + 'px',
-              top: topCoordinate + 'px'
-            });
-          });
-
-        };
-
-        /**
-         * Creates the container of the context menu (a <ul> element),
-         * applies the appropriate styles and then returns that container
-         *
-         * @return a <ul> jqLite/jQuery element
-         */
-        function initContextMenuContainer(params) {
-          // Destructuring
-          var customClass = params.customClass;
-
-          var $ul = $('<ul>');
-          $ul.addClass('dropdown-menu');
-          $ul.attr({ 'role': 'menu' });
-          $ul.css({
-            display: 'block',
-            position: 'absolute',
-            left: params.event.pageX + 'px',
-            top: params.event.pageY + 'px',
-            'z-index': 10000
-          });
-
-          if(customClass) { $ul.addClass(customClass); }
-
-          return $ul;
-        }
-
-        function isTouchDevice() {
-          return 'ontouchstart' in window  || navigator.maxTouchPoints; // works on most browsers | works on IE10/11 and Surface
-        }
-
-        /**
-         * Removes the context menus with level greater than or equal
-         * to the value passed. If undefined, null or 0, all context menus
-         * are removed.
-         */
-        function removeContextMenus (level) {
-          while (_contextMenus.length && (!level || _contextMenus.length > level)) {
-            var cm = _contextMenus.pop();
-            $rootScope.$broadcast(ContextMenuEvents.ContextMenuClosed, { context: _clickedElement, contextMenu: cm });
-            cm.remove();
-          }
-          if(!level) {
-            $rootScope.$broadcast(ContextMenuEvents.ContextMenuAllClosed, { context: _clickedElement });
-          }
-        }
-
-        function removeOnScrollEvent(e) {
-          removeAllContextMenus(e);
-        }
-
-        function removeOnOutsideClickEvent(e) {
-
-          var $curr = $(e.target);
-          var shouldRemove = true;
-
-          while($curr.length) {
-            if ($curr.hasClass('dropdown-menu')) {
-              shouldRemove = false;
-              break;
-            } else {
-              $curr = $curr.parent();
-            }
-          }
-          if (shouldRemove) {
-            removeAllContextMenus(e);
-          }
-        }
-
-        function removeAllContextMenus(e) {
-          $document.find('body').off('mousedown touchstart', removeOnOutsideClickEvent);
-          $document.off('scroll', removeOnScrollEvent);
-          $(_clickedElement).removeClass('context');
-          removeContextMenus();
-          $rootScope.$broadcast('');
-        }
-
-        function isBoolean(a) {
-          return a === false || a === true;
-        }
-
-        /** Resolves a boolean or a function that returns a boolean
-         * Returns true by default if the param is null or undefined
-         * @param a - the parameter to be checked
-         * @param params - the object for the item's parameters
-         * @param defaultValue - the default boolean value to use if the parameter is
-         *  neither a boolean nor function. True by default.
-         */
-        function resolveBoolOrFunc(a, params, defaultValue) {
-          var item = params.item;
-          var $scope = params.$scope;
-          var event = params.event;
-          var modelValue = params.modelValue;
-
-          defaultValue = isBoolean(defaultValue) ? defaultValue : true;
-
-          if (isBoolean(a)) {
-            return a;
-          } else if (angular.isFunction(a)) {
-            return a.call($scope, $scope, event, modelValue);
-          } else {
-            return defaultValue;
-          }
-        }
-
-        function appendDivider($ul) {
-          var $li = angular.element('<li>');
-          $li.addClass('divider');
-          $ul.append($li);
-        }
-
-        function setElementDisabled($li) {
-          $li.on('click', function ($event) {
-            $event.preventDefault();
-          });
-          $li.addClass('disabled');
-        }
-
-        return function ($scope, element, attrs) {
-          var openMenuEvents = ['contextmenu'];
-          _emptyText = $scope.$eval(attrs.contextMenuEmptyText) || 'empty';
-
-          if(attrs.contextMenuOn && typeof(attrs.contextMenuOn) === 'string'){
-            openMenuEvents = attrs.contextMenuOn.split(',');
-          }
-
-          angular.forEach(openMenuEvents, function (openMenuEvent) {
-            element.on(openMenuEvent.trim(), function (event) {
-              // Cleanup any leftover contextmenus(there are cases with longpress on touch where we
-              // still see multiple contextmenus)
-              removeAllContextMenus();
-
-              if(!attrs.allowEventPropagation) {
-                event.stopPropagation();
-                event.preventDefault();
-              }
-
-              // Don't show context menu if on touch device and element is draggable
-              if(isTouchDevice() && element.attr('draggable') === 'true') {
-                return false;
-              }
-
-              // Remove if the user clicks outside
-              $document.find('body').on('mousedown touchstart', removeOnOutsideClickEvent);
-              // Remove the menu when the scroll moves
-              $document.on('scroll', removeOnScrollEvent);
-
-              _clickedElement = event.currentTarget;
-              $(_clickedElement).addClass('context');
-
-              $scope.$apply(function () {
-                var options = $scope.$eval(attrs.contextMenu);
-                var customClass = attrs.contextMenuClass;
-                var modelValue = $scope.$eval(attrs.model);
-                var orientation = attrs.contextMenuOrientation;
-
-                $q.when(options).then(function(promisedMenu) {
-                  if (angular.isFunction(promisedMenu)) {
-                    //  support for dynamic items
-                    promisedMenu = promisedMenu.call($scope, $scope, event, modelValue);
-                  }
-                  var params = {
-                    '$scope' : $scope,
-                    'event' : event,
-                    'options' : promisedMenu,
-                    'modelValue' : modelValue,
-                    'level' : 0,
-                    'customClass' : customClass,
-                    'orientation': orientation
-                  };
-                  $rootScope.$broadcast(ContextMenuEvents.ContextMenuOpening, { context: _clickedElement });
-                  renderContextMenu(params);
-                });
-              });
-
-              // Remove all context menus if the scope is destroyed
-              $scope.$on('$destroy', function () {
-                removeAllContextMenus();
-              });
-            });
-          });
-
-          if (attrs.closeMenuOn) {
-            $scope.$on(attrs.closeMenuOn, function () {
-              removeAllContextMenus();
-            });
-          }
-        };
-      }]);
-// eslint-disable-next-line angular/window-service
-})(window.angular.element, window.angular);

dashboard/src/3rdparty/js/moment.min.js

@@ -1,551 +0,0 @@
-//! moment.js
-//! version : 2.17.1
-//! authors : Tim Wood, Iskren Chernev, Moment.js contributors
-//! license : MIT
-//! momentjs.com
-!function(a,b){"object"==typeof exports&&"undefined"!=typeof module?module.exports=b():"function"==typeof define&&define.amd?define(b):a.moment=b()}(this,function(){"use strict";function a(){return od.apply(null,arguments)}
-// This is done to register the method called with moment()
-// without creating circular dependencies.
-function b(a){od=a}function c(a){return a instanceof Array||"[object Array]"===Object.prototype.toString.call(a)}function d(a){
-// IE8 will treat undefined and null as object if it wasn't for
-// input != null
-return null!=a&&"[object Object]"===Object.prototype.toString.call(a)}function e(a){var b;for(b in a)
-// even if its not own property I'd still call it non-empty
-return!1;return!0}function f(a){return"number"==typeof a||"[object Number]"===Object.prototype.toString.call(a)}function g(a){return a instanceof Date||"[object Date]"===Object.prototype.toString.call(a)}function h(a,b){var c,d=[];for(c=0;c<a.length;++c)d.push(b(a[c],c));return d}function i(a,b){return Object.prototype.hasOwnProperty.call(a,b)}function j(a,b){for(var c in b)i(b,c)&&(a[c]=b[c]);return i(b,"toString")&&(a.toString=b.toString),i(b,"valueOf")&&(a.valueOf=b.valueOf),a}function k(a,b,c,d){return rb(a,b,c,d,!0).utc()}function l(){
-// We need to deep clone this object.
-return{empty:!1,unusedTokens:[],unusedInput:[],overflow:-2,charsLeftOver:0,nullInput:!1,invalidMonth:null,invalidFormat:!1,userInvalidated:!1,iso:!1,parsedDateParts:[],meridiem:null}}function m(a){return null==a._pf&&(a._pf=l()),a._pf}function n(a){if(null==a._isValid){var b=m(a),c=qd.call(b.parsedDateParts,function(a){return null!=a}),d=!isNaN(a._d.getTime())&&b.overflow<0&&!b.empty&&!b.invalidMonth&&!b.invalidWeekday&&!b.nullInput&&!b.invalidFormat&&!b.userInvalidated&&(!b.meridiem||b.meridiem&&c);if(a._strict&&(d=d&&0===b.charsLeftOver&&0===b.unusedTokens.length&&void 0===b.bigHour),null!=Object.isFrozen&&Object.isFrozen(a))return d;a._isValid=d}return a._isValid}function o(a){var b=k(NaN);return null!=a?j(m(b),a):m(b).userInvalidated=!0,b}function p(a){return void 0===a}function q(a,b){var c,d,e;if(p(b._isAMomentObject)||(a._isAMomentObject=b._isAMomentObject),p(b._i)||(a._i=b._i),p(b._f)||(a._f=b._f),p(b._l)||(a._l=b._l),p(b._strict)||(a._strict=b._strict),p(b._tzm)||(a._tzm=b._tzm),p(b._isUTC)||(a._isUTC=b._isUTC),p(b._offset)||(a._offset=b._offset),p(b._pf)||(a._pf=m(b)),p(b._locale)||(a._locale=b._locale),rd.length>0)for(c in rd)d=rd[c],e=b[d],p(e)||(a[d]=e);return a}
-// Moment prototype object
-function r(b){q(this,b),this._d=new Date(null!=b._d?b._d.getTime():NaN),this.isValid()||(this._d=new Date(NaN)),
-// Prevent infinite loop in case updateOffset creates new moment
-// objects.
-sd===!1&&(sd=!0,a.updateOffset(this),sd=!1)}function s(a){return a instanceof r||null!=a&&null!=a._isAMomentObject}function t(a){return a<0?Math.ceil(a)||0:Math.floor(a)}function u(a){var b=+a,c=0;return 0!==b&&isFinite(b)&&(c=t(b)),c}
-// compare two arrays, return the number of differences
-function v(a,b,c){var d,e=Math.min(a.length,b.length),f=Math.abs(a.length-b.length),g=0;for(d=0;d<e;d++)(c&&a[d]!==b[d]||!c&&u(a[d])!==u(b[d]))&&g++;return g+f}function w(b){a.suppressDeprecationWarnings===!1&&"undefined"!=typeof console&&console.warn&&console.warn("Deprecation warning: "+b)}function x(b,c){var d=!0;return j(function(){if(null!=a.deprecationHandler&&a.deprecationHandler(null,b),d){for(var e,f=[],g=0;g<arguments.length;g++){if(e="","object"==typeof arguments[g]){e+="\n["+g+"] ";for(var h in arguments[0])e+=h+": "+arguments[0][h]+", ";e=e.slice(0,-2)}else e=arguments[g];f.push(e)}w(b+"\nArguments: "+Array.prototype.slice.call(f).join("")+"\n"+(new Error).stack),d=!1}return c.apply(this,arguments)},c)}function y(b,c){null!=a.deprecationHandler&&a.deprecationHandler(b,c),td[b]||(w(c),td[b]=!0)}function z(a){return a instanceof Function||"[object Function]"===Object.prototype.toString.call(a)}function A(a){var b,c;for(c in a)b=a[c],z(b)?this[c]=b:this["_"+c]=b;this._config=a,
-// Lenient ordinal parsing accepts just a number in addition to
-// number + (possibly) stuff coming from _ordinalParseLenient.
-this._ordinalParseLenient=new RegExp(this._ordinalParse.source+"|"+/\d{1,2}/.source)}function B(a,b){var c,e=j({},a);for(c in b)i(b,c)&&(d(a[c])&&d(b[c])?(e[c]={},j(e[c],a[c]),j(e[c],b[c])):null!=b[c]?e[c]=b[c]:delete e[c]);for(c in a)i(a,c)&&!i(b,c)&&d(a[c])&&(
-// make sure changes to properties don't modify parent config
-e[c]=j({},e[c]));return e}function C(a){null!=a&&this.set(a)}function D(a,b,c){var d=this._calendar[a]||this._calendar.sameElse;return z(d)?d.call(b,c):d}function E(a){var b=this._longDateFormat[a],c=this._longDateFormat[a.toUpperCase()];return b||!c?b:(this._longDateFormat[a]=c.replace(/MMMM|MM|DD|dddd/g,function(a){return a.slice(1)}),this._longDateFormat[a])}function F(){return this._invalidDate}function G(a){return this._ordinal.replace("%d",a)}function H(a,b,c,d){var e=this._relativeTime[c];return z(e)?e(a,b,c,d):e.replace(/%d/i,a)}function I(a,b){var c=this._relativeTime[a>0?"future":"past"];return z(c)?c(b):c.replace(/%s/i,b)}function J(a,b){var c=a.toLowerCase();Dd[c]=Dd[c+"s"]=Dd[b]=a}function K(a){return"string"==typeof a?Dd[a]||Dd[a.toLowerCase()]:void 0}function L(a){var b,c,d={};for(c in a)i(a,c)&&(b=K(c),b&&(d[b]=a[c]));return d}function M(a,b){Ed[a]=b}function N(a){var b=[];for(var c in a)b.push({unit:c,priority:Ed[c]});return b.sort(function(a,b){return a.priority-b.priority}),b}function O(b,c){return function(d){return null!=d?(Q(this,b,d),a.updateOffset(this,c),this):P(this,b)}}function P(a,b){return a.isValid()?a._d["get"+(a._isUTC?"UTC":"")+b]():NaN}function Q(a,b,c){a.isValid()&&a._d["set"+(a._isUTC?"UTC":"")+b](c)}
-// MOMENTS
-function R(a){return a=K(a),z(this[a])?this[a]():this}function S(a,b){if("object"==typeof a){a=L(a);for(var c=N(a),d=0;d<c.length;d++)this[c[d].unit](a[c[d].unit])}else if(a=K(a),z(this[a]))return this[a](b);return this}function T(a,b,c){var d=""+Math.abs(a),e=b-d.length,f=a>=0;return(f?c?"+":"":"-")+Math.pow(10,Math.max(0,e)).toString().substr(1)+d}
-// token:    'M'
-// padded:   ['MM', 2]
-// ordinal:  'Mo'
-// callback: function () { this.month() + 1 }
-function U(a,b,c,d){var e=d;"string"==typeof d&&(e=function(){return this[d]()}),a&&(Id[a]=e),b&&(Id[b[0]]=function(){return T(e.apply(this,arguments),b[1],b[2])}),c&&(Id[c]=function(){return this.localeData().ordinal(e.apply(this,arguments),a)})}function V(a){return a.match(/\[[\s\S]/)?a.replace(/^\[|\]$/g,""):a.replace(/\\/g,"")}function W(a){var b,c,d=a.match(Fd);for(b=0,c=d.length;b<c;b++)Id[d[b]]?d[b]=Id[d[b]]:d[b]=V(d[b]);return function(b){var e,f="";for(e=0;e<c;e++)f+=d[e]instanceof Function?d[e].call(b,a):d[e];return f}}
-// format date using native date object
-function X(a,b){return a.isValid()?(b=Y(b,a.localeData()),Hd[b]=Hd[b]||W(b),Hd[b](a)):a.localeData().invalidDate()}function Y(a,b){function c(a){return b.longDateFormat(a)||a}var d=5;for(Gd.lastIndex=0;d>=0&&Gd.test(a);)a=a.replace(Gd,c),Gd.lastIndex=0,d-=1;return a}function Z(a,b,c){$d[a]=z(b)?b:function(a,d){return a&&c?c:b}}function $(a,b){return i($d,a)?$d[a](b._strict,b._locale):new RegExp(_(a))}
-// Code from http://stackoverflow.com/questions/3561493/is-there-a-regexp-escape-function-in-javascript
-function _(a){return aa(a.replace("\\","").replace(/\\(\[)|\\(\])|\[([^\]\[]*)\]|\\(.)/g,function(a,b,c,d,e){return b||c||d||e}))}function aa(a){return a.replace(/[-\/\\^$*+?.()|[\]{}]/g,"\\$&")}function ba(a,b){var c,d=b;for("string"==typeof a&&(a=[a]),f(b)&&(d=function(a,c){c[b]=u(a)}),c=0;c<a.length;c++)_d[a[c]]=d}function ca(a,b){ba(a,function(a,c,d,e){d._w=d._w||{},b(a,d._w,d,e)})}function da(a,b,c){null!=b&&i(_d,a)&&_d[a](b,c._a,c,a)}function ea(a,b){return new Date(Date.UTC(a,b+1,0)).getUTCDate()}function fa(a,b){return a?c(this._months)?this._months[a.month()]:this._months[(this._months.isFormat||ke).test(b)?"format":"standalone"][a.month()]:this._months}function ga(a,b){return a?c(this._monthsShort)?this._monthsShort[a.month()]:this._monthsShort[ke.test(b)?"format":"standalone"][a.month()]:this._monthsShort}function ha(a,b,c){var d,e,f,g=a.toLocaleLowerCase();if(!this._monthsParse)for(
-// this is not used
-this._monthsParse=[],this._longMonthsParse=[],this._shortMonthsParse=[],d=0;d<12;++d)f=k([2e3,d]),this._shortMonthsParse[d]=this.monthsShort(f,"").toLocaleLowerCase(),this._longMonthsParse[d]=this.months(f,"").toLocaleLowerCase();return c?"MMM"===b?(e=je.call(this._shortMonthsParse,g),e!==-1?e:null):(e=je.call(this._longMonthsParse,g),e!==-1?e:null):"MMM"===b?(e=je.call(this._shortMonthsParse,g),e!==-1?e:(e=je.call(this._longMonthsParse,g),e!==-1?e:null)):(e=je.call(this._longMonthsParse,g),e!==-1?e:(e=je.call(this._shortMonthsParse,g),e!==-1?e:null))}function ia(a,b,c){var d,e,f;if(this._monthsParseExact)return ha.call(this,a,b,c);
-// TODO: add sorting
-// Sorting makes sure if one month (or abbr) is a prefix of another
-// see sorting in computeMonthsParse
-for(this._monthsParse||(this._monthsParse=[],this._longMonthsParse=[],this._shortMonthsParse=[]),d=0;d<12;d++){
-// test the regex
-if(
-// make the regex if we don't have it already
-e=k([2e3,d]),c&&!this._longMonthsParse[d]&&(this._longMonthsParse[d]=new RegExp("^"+this.months(e,"").replace(".","")+"$","i"),this._shortMonthsParse[d]=new RegExp("^"+this.monthsShort(e,"").replace(".","")+"$","i")),c||this._monthsParse[d]||(f="^"+this.months(e,"")+"|^"+this.monthsShort(e,""),this._monthsParse[d]=new RegExp(f.replace(".",""),"i")),c&&"MMMM"===b&&this._longMonthsParse[d].test(a))return d;if(c&&"MMM"===b&&this._shortMonthsParse[d].test(a))return d;if(!c&&this._monthsParse[d].test(a))return d}}
-// MOMENTS
-function ja(a,b){var c;if(!a.isValid())
-// No op
-return a;if("string"==typeof b)if(/^\d+$/.test(b))b=u(b);else
-// TODO: Another silent failure?
-if(b=a.localeData().monthsParse(b),!f(b))return a;return c=Math.min(a.date(),ea(a.year(),b)),a._d["set"+(a._isUTC?"UTC":"")+"Month"](b,c),a}function ka(b){return null!=b?(ja(this,b),a.updateOffset(this,!0),this):P(this,"Month")}function la(){return ea(this.year(),this.month())}function ma(a){return this._monthsParseExact?(i(this,"_monthsRegex")||oa.call(this),a?this._monthsShortStrictRegex:this._monthsShortRegex):(i(this,"_monthsShortRegex")||(this._monthsShortRegex=ne),this._monthsShortStrictRegex&&a?this._monthsShortStrictRegex:this._monthsShortRegex)}function na(a){return this._monthsParseExact?(i(this,"_monthsRegex")||oa.call(this),a?this._monthsStrictRegex:this._monthsRegex):(i(this,"_monthsRegex")||(this._monthsRegex=oe),this._monthsStrictRegex&&a?this._monthsStrictRegex:this._monthsRegex)}function oa(){function a(a,b){return b.length-a.length}var b,c,d=[],e=[],f=[];for(b=0;b<12;b++)
-// make the regex if we don't have it already
-c=k([2e3,b]),d.push(this.monthsShort(c,"")),e.push(this.months(c,"")),f.push(this.months(c,"")),f.push(this.monthsShort(c,""));for(
-// Sorting makes sure if one month (or abbr) is a prefix of another it
-// will match the longer piece.
-d.sort(a),e.sort(a),f.sort(a),b=0;b<12;b++)d[b]=aa(d[b]),e[b]=aa(e[b]);for(b=0;b<24;b++)f[b]=aa(f[b]);this._monthsRegex=new RegExp("^("+f.join("|")+")","i"),this._monthsShortRegex=this._monthsRegex,this._monthsStrictRegex=new RegExp("^("+e.join("|")+")","i"),this._monthsShortStrictRegex=new RegExp("^("+d.join("|")+")","i")}
-// HELPERS
-function pa(a){return qa(a)?366:365}function qa(a){return a%4===0&&a%100!==0||a%400===0}function ra(){return qa(this.year())}function sa(a,b,c,d,e,f,g){
-//can't just apply() to create a date:
-//http://stackoverflow.com/questions/181348/instantiating-a-javascript-object-by-calling-prototype-constructor-apply
-var h=new Date(a,b,c,d,e,f,g);
-//the date constructor remaps years 0-99 to 1900-1999
-return a<100&&a>=0&&isFinite(h.getFullYear())&&h.setFullYear(a),h}function ta(a){var b=new Date(Date.UTC.apply(null,arguments));
-//the Date.UTC function remaps years 0-99 to 1900-1999
-return a<100&&a>=0&&isFinite(b.getUTCFullYear())&&b.setUTCFullYear(a),b}
-// start-of-first-week - start-of-year
-function ua(a,b,c){var// first-week day -- which january is always in the first week (4 for iso, 1 for other)
-d=7+b-c,
-// first-week day local weekday -- which local weekday is fwd
-e=(7+ta(a,0,d).getUTCDay()-b)%7;return-e+d-1}
-//http://en.wikipedia.org/wiki/ISO_week_date#Calculating_a_date_given_the_year.2C_week_number_and_weekday
-function va(a,b,c,d,e){var f,g,h=(7+c-d)%7,i=ua(a,d,e),j=1+7*(b-1)+h+i;return j<=0?(f=a-1,g=pa(f)+j):j>pa(a)?(f=a+1,g=j-pa(a)):(f=a,g=j),{year:f,dayOfYear:g}}function wa(a,b,c){var d,e,f=ua(a.year(),b,c),g=Math.floor((a.dayOfYear()-f-1)/7)+1;return g<1?(e=a.year()-1,d=g+xa(e,b,c)):g>xa(a.year(),b,c)?(d=g-xa(a.year(),b,c),e=a.year()+1):(e=a.year(),d=g),{week:d,year:e}}function xa(a,b,c){var d=ua(a,b,c),e=ua(a+1,b,c);return(pa(a)-d+e)/7}
-// HELPERS
-// LOCALES
-function ya(a){return wa(a,this._week.dow,this._week.doy).week}function za(){return this._week.dow}function Aa(){return this._week.doy}
-// MOMENTS
-function Ba(a){var b=this.localeData().week(this);return null==a?b:this.add(7*(a-b),"d")}function Ca(a){var b=wa(this,1,4).week;return null==a?b:this.add(7*(a-b),"d")}
-// HELPERS
-function Da(a,b){return"string"!=typeof a?a:isNaN(a)?(a=b.weekdaysParse(a),"number"==typeof a?a:null):parseInt(a,10)}function Ea(a,b){return"string"==typeof a?b.weekdaysParse(a)%7||7:isNaN(a)?null:a}function Fa(a,b){return a?c(this._weekdays)?this._weekdays[a.day()]:this._weekdays[this._weekdays.isFormat.test(b)?"format":"standalone"][a.day()]:this._weekdays}function Ga(a){return a?this._weekdaysShort[a.day()]:this._weekdaysShort}function Ha(a){return a?this._weekdaysMin[a.day()]:this._weekdaysMin}function Ia(a,b,c){var d,e,f,g=a.toLocaleLowerCase();if(!this._weekdaysParse)for(this._weekdaysParse=[],this._shortWeekdaysParse=[],this._minWeekdaysParse=[],d=0;d<7;++d)f=k([2e3,1]).day(d),this._minWeekdaysParse[d]=this.weekdaysMin(f,"").toLocaleLowerCase(),this._shortWeekdaysParse[d]=this.weekdaysShort(f,"").toLocaleLowerCase(),this._weekdaysParse[d]=this.weekdays(f,"").toLocaleLowerCase();return c?"dddd"===b?(e=je.call(this._weekdaysParse,g),e!==-1?e:null):"ddd"===b?(e=je.call(this._shortWeekdaysParse,g),e!==-1?e:null):(e=je.call(this._minWeekdaysParse,g),e!==-1?e:null):"dddd"===b?(e=je.call(this._weekdaysParse,g),e!==-1?e:(e=je.call(this._shortWeekdaysParse,g),e!==-1?e:(e=je.call(this._minWeekdaysParse,g),e!==-1?e:null))):"ddd"===b?(e=je.call(this._shortWeekdaysParse,g),e!==-1?e:(e=je.call(this._weekdaysParse,g),e!==-1?e:(e=je.call(this._minWeekdaysParse,g),e!==-1?e:null))):(e=je.call(this._minWeekdaysParse,g),e!==-1?e:(e=je.call(this._weekdaysParse,g),e!==-1?e:(e=je.call(this._shortWeekdaysParse,g),e!==-1?e:null)))}function Ja(a,b,c){var d,e,f;if(this._weekdaysParseExact)return Ia.call(this,a,b,c);for(this._weekdaysParse||(this._weekdaysParse=[],this._minWeekdaysParse=[],this._shortWeekdaysParse=[],this._fullWeekdaysParse=[]),d=0;d<7;d++){
-// test the regex
-if(
-// make the regex if we don't have it already
-e=k([2e3,1]).day(d),c&&!this._fullWeekdaysParse[d]&&(this._fullWeekdaysParse[d]=new RegExp("^"+this.weekdays(e,"").replace(".",".?")+"$","i"),this._shortWeekdaysParse[d]=new RegExp("^"+this.weekdaysShort(e,"").replace(".",".?")+"$","i"),this._minWeekdaysParse[d]=new RegExp("^"+this.weekdaysMin(e,"").replace(".",".?")+"$","i")),this._weekdaysParse[d]||(f="^"+this.weekdays(e,"")+"|^"+this.weekdaysShort(e,"")+"|^"+this.weekdaysMin(e,""),this._weekdaysParse[d]=new RegExp(f.replace(".",""),"i")),c&&"dddd"===b&&this._fullWeekdaysParse[d].test(a))return d;if(c&&"ddd"===b&&this._shortWeekdaysParse[d].test(a))return d;if(c&&"dd"===b&&this._minWeekdaysParse[d].test(a))return d;if(!c&&this._weekdaysParse[d].test(a))return d}}
-// MOMENTS
-function Ka(a){if(!this.isValid())return null!=a?this:NaN;var b=this._isUTC?this._d.getUTCDay():this._d.getDay();return null!=a?(a=Da(a,this.localeData()),this.add(a-b,"d")):b}function La(a){if(!this.isValid())return null!=a?this:NaN;var b=(this.day()+7-this.localeData()._week.dow)%7;return null==a?b:this.add(a-b,"d")}function Ma(a){if(!this.isValid())return null!=a?this:NaN;
-// behaves the same as moment#day except
-// as a getter, returns 7 instead of 0 (1-7 range instead of 0-6)
-// as a setter, sunday should belong to the previous week.
-if(null!=a){var b=Ea(a,this.localeData());return this.day(this.day()%7?b:b-7)}return this.day()||7}function Na(a){return this._weekdaysParseExact?(i(this,"_weekdaysRegex")||Qa.call(this),a?this._weekdaysStrictRegex:this._weekdaysRegex):(i(this,"_weekdaysRegex")||(this._weekdaysRegex=ue),this._weekdaysStrictRegex&&a?this._weekdaysStrictRegex:this._weekdaysRegex)}function Oa(a){return this._weekdaysParseExact?(i(this,"_weekdaysRegex")||Qa.call(this),a?this._weekdaysShortStrictRegex:this._weekdaysShortRegex):(i(this,"_weekdaysShortRegex")||(this._weekdaysShortRegex=ve),this._weekdaysShortStrictRegex&&a?this._weekdaysShortStrictRegex:this._weekdaysShortRegex)}function Pa(a){return this._weekdaysParseExact?(i(this,"_weekdaysRegex")||Qa.call(this),a?this._weekdaysMinStrictRegex:this._weekdaysMinRegex):(i(this,"_weekdaysMinRegex")||(this._weekdaysMinRegex=we),this._weekdaysMinStrictRegex&&a?this._weekdaysMinStrictRegex:this._weekdaysMinRegex)}function Qa(){function a(a,b){return b.length-a.length}var b,c,d,e,f,g=[],h=[],i=[],j=[];for(b=0;b<7;b++)
-// make the regex if we don't have it already
-c=k([2e3,1]).day(b),d=this.weekdaysMin(c,""),e=this.weekdaysShort(c,""),f=this.weekdays(c,""),g.push(d),h.push(e),i.push(f),j.push(d),j.push(e),j.push(f);for(
-// Sorting makes sure if one weekday (or abbr) is a prefix of another it
-// will match the longer piece.
-g.sort(a),h.sort(a),i.sort(a),j.sort(a),b=0;b<7;b++)h[b]=aa(h[b]),i[b]=aa(i[b]),j[b]=aa(j[b]);this._weekdaysRegex=new RegExp("^("+j.join("|")+")","i"),this._weekdaysShortRegex=this._weekdaysRegex,this._weekdaysMinRegex=this._weekdaysRegex,this._weekdaysStrictRegex=new RegExp("^("+i.join("|")+")","i"),this._weekdaysShortStrictRegex=new RegExp("^("+h.join("|")+")","i"),this._weekdaysMinStrictRegex=new RegExp("^("+g.join("|")+")","i")}
-// FORMATTING
-function Ra(){return this.hours()%12||12}function Sa(){return this.hours()||24}function Ta(a,b){U(a,0,0,function(){return this.localeData().meridiem(this.hours(),this.minutes(),b)})}
-// PARSING
-function Ua(a,b){return b._meridiemParse}
-// LOCALES
-function Va(a){
-// IE8 Quirks Mode & IE7 Standards Mode do not allow accessing strings like arrays
-// Using charAt should be more compatible.
-return"p"===(a+"").toLowerCase().charAt(0)}function Wa(a,b,c){return a>11?c?"pm":"PM":c?"am":"AM"}function Xa(a){return a?a.toLowerCase().replace("_","-"):a}
-// pick the locale from the array
-// try ['en-au', 'en-gb'] as 'en-au', 'en-gb', 'en', as in move through the list trying each
-// substring from most specific to least, but move to the next array item if it's a more specific variant than the current root
-function Ya(a){for(var b,c,d,e,f=0;f<a.length;){for(e=Xa(a[f]).split("-"),b=e.length,c=Xa(a[f+1]),c=c?c.split("-"):null;b>0;){if(d=Za(e.slice(0,b).join("-")))return d;if(c&&c.length>=b&&v(e,c,!0)>=b-1)
-//the next array item is better than a shallower substring of this one
-break;b--}f++}return null}function Za(a){var b=null;
-// TODO: Find a better way to register and load all the locales in Node
-if(!Be[a]&&"undefined"!=typeof module&&module&&module.exports)try{b=xe._abbr,require("./locale/"+a),
-// because defineLocale currently also sets the global locale, we
-// want to undo that for lazy loaded locales
-$a(b)}catch(a){}return Be[a]}
-// This function will load locale and then set the global locale.  If
-// no arguments are passed in, it will simply return the current global
-// locale key.
-function $a(a,b){var c;
-// moment.duration._locale = moment._locale = data;
-return a&&(c=p(b)?bb(a):_a(a,b),c&&(xe=c)),xe._abbr}function _a(a,b){if(null!==b){var c=Ae;if(b.abbr=a,null!=Be[a])y("defineLocaleOverride","use moment.updateLocale(localeName, config) to change an existing locale. moment.defineLocale(localeName, config) should only be used for creating a new locale See http://momentjs.com/guides/#/warnings/define-locale/ for more info."),c=Be[a]._config;else if(null!=b.parentLocale){if(null==Be[b.parentLocale])return Ce[b.parentLocale]||(Ce[b.parentLocale]=[]),Ce[b.parentLocale].push({name:a,config:b}),null;c=Be[b.parentLocale]._config}
-// backwards compat for now: also set the locale
-// make sure we set the locale AFTER all child locales have been
-// created, so we won't end up with the child locale set.
-return Be[a]=new C(B(c,b)),Ce[a]&&Ce[a].forEach(function(a){_a(a.name,a.config)}),$a(a),Be[a]}
-// useful for testing
-return delete Be[a],null}function ab(a,b){if(null!=b){var c,d=Ae;
-// MERGE
-null!=Be[a]&&(d=Be[a]._config),b=B(d,b),c=new C(b),c.parentLocale=Be[a],Be[a]=c,
-// backwards compat for now: also set the locale
-$a(a)}else
-// pass null for config to unupdate, useful for tests
-null!=Be[a]&&(null!=Be[a].parentLocale?Be[a]=Be[a].parentLocale:null!=Be[a]&&delete Be[a]);return Be[a]}
-// returns locale data
-function bb(a){var b;if(a&&a._locale&&a._locale._abbr&&(a=a._locale._abbr),!a)return xe;if(!c(a)){if(
-//short-circuit everything else
-b=Za(a))return b;a=[a]}return Ya(a)}function cb(){return wd(Be)}function db(a){var b,c=a._a;return c&&m(a).overflow===-2&&(b=c[be]<0||c[be]>11?be:c[ce]<1||c[ce]>ea(c[ae],c[be])?ce:c[de]<0||c[de]>24||24===c[de]&&(0!==c[ee]||0!==c[fe]||0!==c[ge])?de:c[ee]<0||c[ee]>59?ee:c[fe]<0||c[fe]>59?fe:c[ge]<0||c[ge]>999?ge:-1,m(a)._overflowDayOfYear&&(b<ae||b>ce)&&(b=ce),m(a)._overflowWeeks&&b===-1&&(b=he),m(a)._overflowWeekday&&b===-1&&(b=ie),m(a).overflow=b),a}
-// date from iso format
-function eb(a){var b,c,d,e,f,g,h=a._i,i=De.exec(h)||Ee.exec(h);if(i){for(m(a).iso=!0,b=0,c=Ge.length;b<c;b++)if(Ge[b][1].exec(i[1])){e=Ge[b][0],d=Ge[b][2]!==!1;break}if(null==e)return void(a._isValid=!1);if(i[3]){for(b=0,c=He.length;b<c;b++)if(He[b][1].exec(i[3])){
-// match[2] should be 'T' or space
-f=(i[2]||" ")+He[b][0];break}if(null==f)return void(a._isValid=!1)}if(!d&&null!=f)return void(a._isValid=!1);if(i[4]){if(!Fe.exec(i[4]))return void(a._isValid=!1);g="Z"}a._f=e+(f||"")+(g||""),kb(a)}else a._isValid=!1}
-// date from iso format or fallback
-function fb(b){var c=Ie.exec(b._i);return null!==c?void(b._d=new Date(+c[1])):(eb(b),void(b._isValid===!1&&(delete b._isValid,a.createFromInputFallback(b))))}
-// Pick the first defined of two or three arguments.
-function gb(a,b,c){return null!=a?a:null!=b?b:c}function hb(b){
-// hooks is actually the exported moment object
-var c=new Date(a.now());return b._useUTC?[c.getUTCFullYear(),c.getUTCMonth(),c.getUTCDate()]:[c.getFullYear(),c.getMonth(),c.getDate()]}
-// convert an array to a date.
-// the array should mirror the parameters below
-// note: all values past the year are optional and will default to the lowest possible value.
-// [year, month, day , hour, minute, second, millisecond]
-function ib(a){var b,c,d,e,f=[];if(!a._d){
-// Default to current date.
-// * if no year, month, day of month are given, default to today
-// * if day of month is given, default month and year
-// * if month is given, default only year
-// * if year is given, don't default anything
-for(d=hb(a),
-//compute day of the year from weeks and weekdays
-a._w&&null==a._a[ce]&&null==a._a[be]&&jb(a),
-//if the day of the year is set, figure out what it is
-a._dayOfYear&&(e=gb(a._a[ae],d[ae]),a._dayOfYear>pa(e)&&(m(a)._overflowDayOfYear=!0),c=ta(e,0,a._dayOfYear),a._a[be]=c.getUTCMonth(),a._a[ce]=c.getUTCDate()),b=0;b<3&&null==a._a[b];++b)a._a[b]=f[b]=d[b];
-// Zero out whatever was not defaulted, including time
-for(;b<7;b++)a._a[b]=f[b]=null==a._a[b]?2===b?1:0:a._a[b];
-// Check for 24:00:00.000
-24===a._a[de]&&0===a._a[ee]&&0===a._a[fe]&&0===a._a[ge]&&(a._nextDay=!0,a._a[de]=0),a._d=(a._useUTC?ta:sa).apply(null,f),
-// Apply timezone offset from input. The actual utcOffset can be changed
-// with parseZone.
-null!=a._tzm&&a._d.setUTCMinutes(a._d.getUTCMinutes()-a._tzm),a._nextDay&&(a._a[de]=24)}}function jb(a){var b,c,d,e,f,g,h,i;if(b=a._w,null!=b.GG||null!=b.W||null!=b.E)f=1,g=4,
-// TODO: We need to take the current isoWeekYear, but that depends on
-// how we interpret now (local, utc, fixed offset). So create
-// a now version of current config (take local/utc/offset flags, and
-// create now).
-c=gb(b.GG,a._a[ae],wa(sb(),1,4).year),d=gb(b.W,1),e=gb(b.E,1),(e<1||e>7)&&(i=!0);else{f=a._locale._week.dow,g=a._locale._week.doy;var j=wa(sb(),f,g);c=gb(b.gg,a._a[ae],j.year),
-// Default to current week.
-d=gb(b.w,j.week),null!=b.d?(
-// weekday -- low day numbers are considered next week
-e=b.d,(e<0||e>6)&&(i=!0)):null!=b.e?(
-// local weekday -- counting starts from begining of week
-e=b.e+f,(b.e<0||b.e>6)&&(i=!0)):
-// default to begining of week
-e=f}d<1||d>xa(c,f,g)?m(a)._overflowWeeks=!0:null!=i?m(a)._overflowWeekday=!0:(h=va(c,d,e,f,g),a._a[ae]=h.year,a._dayOfYear=h.dayOfYear)}
-// date from string and format string
-function kb(b){
-// TODO: Move this to another part of the creation flow to prevent circular deps
-if(b._f===a.ISO_8601)return void eb(b);b._a=[],m(b).empty=!0;
-// This array is used to make a Date, either with `new Date` or `Date.UTC`
-var c,d,e,f,g,h=""+b._i,i=h.length,j=0;for(e=Y(b._f,b._locale).match(Fd)||[],c=0;c<e.length;c++)f=e[c],d=(h.match($(f,b))||[])[0],
-// console.log('token', token, 'parsedInput', parsedInput,
-//         'regex', getParseRegexForToken(token, config));
-d&&(g=h.substr(0,h.indexOf(d)),g.length>0&&m(b).unusedInput.push(g),h=h.slice(h.indexOf(d)+d.length),j+=d.length),
-// don't parse if it's not a known token
-Id[f]?(d?m(b).empty=!1:m(b).unusedTokens.push(f),da(f,d,b)):b._strict&&!d&&m(b).unusedTokens.push(f);
-// add remaining unparsed input length to the string
-m(b).charsLeftOver=i-j,h.length>0&&m(b).unusedInput.push(h),
-// clear _12h flag if hour is <= 12
-b._a[de]<=12&&m(b).bigHour===!0&&b._a[de]>0&&(m(b).bigHour=void 0),m(b).parsedDateParts=b._a.slice(0),m(b).meridiem=b._meridiem,
-// handle meridiem
-b._a[de]=lb(b._locale,b._a[de],b._meridiem),ib(b),db(b)}function lb(a,b,c){var d;
-// Fallback
-return null==c?b:null!=a.meridiemHour?a.meridiemHour(b,c):null!=a.isPM?(d=a.isPM(c),d&&b<12&&(b+=12),d||12!==b||(b=0),b):b}
-// date from string and array of format strings
-function mb(a){var b,c,d,e,f;if(0===a._f.length)return m(a).invalidFormat=!0,void(a._d=new Date(NaN));for(e=0;e<a._f.length;e++)f=0,b=q({},a),null!=a._useUTC&&(b._useUTC=a._useUTC),b._f=a._f[e],kb(b),n(b)&&(
-// if there is any input that was not parsed add a penalty for that format
-f+=m(b).charsLeftOver,
-//or tokens
-f+=10*m(b).unusedTokens.length,m(b).score=f,(null==d||f<d)&&(d=f,c=b));j(a,c||b)}function nb(a){if(!a._d){var b=L(a._i);a._a=h([b.year,b.month,b.day||b.date,b.hour,b.minute,b.second,b.millisecond],function(a){return a&&parseInt(a,10)}),ib(a)}}function ob(a){var b=new r(db(pb(a)));
-// Adding is smart enough around DST
-return b._nextDay&&(b.add(1,"d"),b._nextDay=void 0),b}function pb(a){var b=a._i,d=a._f;return a._locale=a._locale||bb(a._l),null===b||void 0===d&&""===b?o({nullInput:!0}):("string"==typeof b&&(a._i=b=a._locale.preparse(b)),s(b)?new r(db(b)):(g(b)?a._d=b:c(d)?mb(a):d?kb(a):qb(a),n(a)||(a._d=null),a))}function qb(b){var d=b._i;void 0===d?b._d=new Date(a.now()):g(d)?b._d=new Date(d.valueOf()):"string"==typeof d?fb(b):c(d)?(b._a=h(d.slice(0),function(a){return parseInt(a,10)}),ib(b)):"object"==typeof d?nb(b):f(d)?
-// from milliseconds
-b._d=new Date(d):a.createFromInputFallback(b)}function rb(a,b,f,g,h){var i={};
-// object construction must be done this way.
-// https://github.com/moment/moment/issues/1423
-return f!==!0&&f!==!1||(g=f,f=void 0),(d(a)&&e(a)||c(a)&&0===a.length)&&(a=void 0),i._isAMomentObject=!0,i._useUTC=i._isUTC=h,i._l=f,i._i=a,i._f=b,i._strict=g,ob(i)}function sb(a,b,c,d){return rb(a,b,c,d,!1)}
-// Pick a moment m from moments so that m[fn](other) is true for all
-// other. This relies on the function fn to be transitive.
-//
-// moments should either be an array of moment objects or an array, whose
-// first element is an array of moment objects.
-function tb(a,b){var d,e;if(1===b.length&&c(b[0])&&(b=b[0]),!b.length)return sb();for(d=b[0],e=1;e<b.length;++e)b[e].isValid()&&!b[e][a](d)||(d=b[e]);return d}
-// TODO: Use [].sort instead?
-function ub(){var a=[].slice.call(arguments,0);return tb("isBefore",a)}function vb(){var a=[].slice.call(arguments,0);return tb("isAfter",a)}function wb(a){var b=L(a),c=b.year||0,d=b.quarter||0,e=b.month||0,f=b.week||0,g=b.day||0,h=b.hour||0,i=b.minute||0,j=b.second||0,k=b.millisecond||0;
-// representation for dateAddRemove
-this._milliseconds=+k+1e3*j+// 1000
-6e4*i+// 1000 * 60
-1e3*h*60*60,//using 1000 * 60 * 60 instead of 36e5 to avoid floating point rounding errors https://github.com/moment/moment/issues/2978
-// Because of dateAddRemove treats 24 hours as different from a
-// day when working around DST, we need to store them separately
-this._days=+g+7*f,
-// It is impossible translate months into days without knowing
-// which months you are are talking about, so we have to store
-// it separately.
-this._months=+e+3*d+12*c,this._data={},this._locale=bb(),this._bubble()}function xb(a){return a instanceof wb}function yb(a){return a<0?Math.round(-1*a)*-1:Math.round(a)}
-// FORMATTING
-function zb(a,b){U(a,0,0,function(){var a=this.utcOffset(),c="+";return a<0&&(a=-a,c="-"),c+T(~~(a/60),2)+b+T(~~a%60,2)})}function Ab(a,b){var c=(b||"").match(a);if(null===c)return null;var d=c[c.length-1]||[],e=(d+"").match(Me)||["-",0,0],f=+(60*e[1])+u(e[2]);return 0===f?0:"+"===e[0]?f:-f}
-// Return a moment from input, that is local/utc/zone equivalent to model.
-function Bb(b,c){var d,e;
-// Use low-level api, because this fn is low-level api.
-return c._isUTC?(d=c.clone(),e=(s(b)||g(b)?b.valueOf():sb(b).valueOf())-d.valueOf(),d._d.setTime(d._d.valueOf()+e),a.updateOffset(d,!1),d):sb(b).local()}function Cb(a){
-// On Firefox.24 Date#getTimezoneOffset returns a floating point.
-// https://github.com/moment/moment/pull/1871
-return 15*-Math.round(a._d.getTimezoneOffset()/15)}
-// MOMENTS
-// keepLocalTime = true means only change the timezone, without
-// affecting the local hour. So 5:31:26 +0300 --[utcOffset(2, true)]-->
-// 5:31:26 +0200 It is possible that 5:31:26 doesn't exist with offset
-// +0200, so we adjust the time as needed, to be valid.
-//
-// Keeping the time actually adds/subtracts (one hour)
-// from the actual represented time. That is why we call updateOffset
-// a second time. In case it wants us to change the offset again
-// _changeInProgress == true case, then we have to adjust, because
-// there is no such time in the given timezone.
-function Db(b,c){var d,e=this._offset||0;if(!this.isValid())return null!=b?this:NaN;if(null!=b){if("string"==typeof b){if(b=Ab(Xd,b),null===b)return this}else Math.abs(b)<16&&(b=60*b);return!this._isUTC&&c&&(d=Cb(this)),this._offset=b,this._isUTC=!0,null!=d&&this.add(d,"m"),e!==b&&(!c||this._changeInProgress?Tb(this,Ob(b-e,"m"),1,!1):this._changeInProgress||(this._changeInProgress=!0,a.updateOffset(this,!0),this._changeInProgress=null)),this}return this._isUTC?e:Cb(this)}function Eb(a,b){return null!=a?("string"!=typeof a&&(a=-a),this.utcOffset(a,b),this):-this.utcOffset()}function Fb(a){return this.utcOffset(0,a)}function Gb(a){return this._isUTC&&(this.utcOffset(0,a),this._isUTC=!1,a&&this.subtract(Cb(this),"m")),this}function Hb(){if(null!=this._tzm)this.utcOffset(this._tzm);else if("string"==typeof this._i){var a=Ab(Wd,this._i);null!=a?this.utcOffset(a):this.utcOffset(0,!0)}return this}function Ib(a){return!!this.isValid()&&(a=a?sb(a).utcOffset():0,(this.utcOffset()-a)%60===0)}function Jb(){return this.utcOffset()>this.clone().month(0).utcOffset()||this.utcOffset()>this.clone().month(5).utcOffset()}function Kb(){if(!p(this._isDSTShifted))return this._isDSTShifted;var a={};if(q(a,this),a=pb(a),a._a){var b=a._isUTC?k(a._a):sb(a._a);this._isDSTShifted=this.isValid()&&v(a._a,b.toArray())>0}else this._isDSTShifted=!1;return this._isDSTShifted}function Lb(){return!!this.isValid()&&!this._isUTC}function Mb(){return!!this.isValid()&&this._isUTC}function Nb(){return!!this.isValid()&&(this._isUTC&&0===this._offset)}function Ob(a,b){var c,d,e,g=a,
-// matching against regexp is expensive, do it on demand
-h=null;// checks for null or undefined
-return xb(a)?g={ms:a._milliseconds,d:a._days,M:a._months}:f(a)?(g={},b?g[b]=a:g.milliseconds=a):(h=Ne.exec(a))?(c="-"===h[1]?-1:1,g={y:0,d:u(h[ce])*c,h:u(h[de])*c,m:u(h[ee])*c,s:u(h[fe])*c,ms:u(yb(1e3*h[ge]))*c}):(h=Oe.exec(a))?(c="-"===h[1]?-1:1,g={y:Pb(h[2],c),M:Pb(h[3],c),w:Pb(h[4],c),d:Pb(h[5],c),h:Pb(h[6],c),m:Pb(h[7],c),s:Pb(h[8],c)}):null==g?g={}:"object"==typeof g&&("from"in g||"to"in g)&&(e=Rb(sb(g.from),sb(g.to)),g={},g.ms=e.milliseconds,g.M=e.months),d=new wb(g),xb(a)&&i(a,"_locale")&&(d._locale=a._locale),d}function Pb(a,b){
-// We'd normally use ~~inp for this, but unfortunately it also
-// converts floats to ints.
-// inp may be undefined, so careful calling replace on it.
-var c=a&&parseFloat(a.replace(",","."));
-// apply sign while we're at it
-return(isNaN(c)?0:c)*b}function Qb(a,b){var c={milliseconds:0,months:0};return c.months=b.month()-a.month()+12*(b.year()-a.year()),a.clone().add(c.months,"M").isAfter(b)&&--c.months,c.milliseconds=+b-+a.clone().add(c.months,"M"),c}function Rb(a,b){var c;return a.isValid()&&b.isValid()?(b=Bb(b,a),a.isBefore(b)?c=Qb(a,b):(c=Qb(b,a),c.milliseconds=-c.milliseconds,c.months=-c.months),c):{milliseconds:0,months:0}}
-// TODO: remove 'name' arg after deprecation is removed
-function Sb(a,b){return function(c,d){var e,f;
-//invert the arguments, but complain about it
-return null===d||isNaN(+d)||(y(b,"moment()."+b+"(period, number) is deprecated. Please use moment()."+b+"(number, period). See http://momentjs.com/guides/#/warnings/add-inverted-param/ for more info."),f=c,c=d,d=f),c="string"==typeof c?+c:c,e=Ob(c,d),Tb(this,e,a),this}}function Tb(b,c,d,e){var f=c._milliseconds,g=yb(c._days),h=yb(c._months);b.isValid()&&(e=null==e||e,f&&b._d.setTime(b._d.valueOf()+f*d),g&&Q(b,"Date",P(b,"Date")+g*d),h&&ja(b,P(b,"Month")+h*d),e&&a.updateOffset(b,g||h))}function Ub(a,b){var c=a.diff(b,"days",!0);return c<-6?"sameElse":c<-1?"lastWeek":c<0?"lastDay":c<1?"sameDay":c<2?"nextDay":c<7?"nextWeek":"sameElse"}function Vb(b,c){
-// We want to compare the start of today, vs this.
-// Getting start-of-today depends on whether we're local/utc/offset or not.
-var d=b||sb(),e=Bb(d,this).startOf("day"),f=a.calendarFormat(this,e)||"sameElse",g=c&&(z(c[f])?c[f].call(this,d):c[f]);return this.format(g||this.localeData().calendar(f,this,sb(d)))}function Wb(){return new r(this)}function Xb(a,b){var c=s(a)?a:sb(a);return!(!this.isValid()||!c.isValid())&&(b=K(p(b)?"millisecond":b),"millisecond"===b?this.valueOf()>c.valueOf():c.valueOf()<this.clone().startOf(b).valueOf())}function Yb(a,b){var c=s(a)?a:sb(a);return!(!this.isValid()||!c.isValid())&&(b=K(p(b)?"millisecond":b),"millisecond"===b?this.valueOf()<c.valueOf():this.clone().endOf(b).valueOf()<c.valueOf())}function Zb(a,b,c,d){return d=d||"()",("("===d[0]?this.isAfter(a,c):!this.isBefore(a,c))&&(")"===d[1]?this.isBefore(b,c):!this.isAfter(b,c))}function $b(a,b){var c,d=s(a)?a:sb(a);return!(!this.isValid()||!d.isValid())&&(b=K(b||"millisecond"),"millisecond"===b?this.valueOf()===d.valueOf():(c=d.valueOf(),this.clone().startOf(b).valueOf()<=c&&c<=this.clone().endOf(b).valueOf()))}function _b(a,b){return this.isSame(a,b)||this.isAfter(a,b)}function ac(a,b){return this.isSame(a,b)||this.isBefore(a,b)}function bc(a,b,c){var d,e,f,g;// 1000
-// 1000 * 60
-// 1000 * 60 * 60
-// 1000 * 60 * 60 * 24, negate dst
-// 1000 * 60 * 60 * 24 * 7, negate dst
-return this.isValid()?(d=Bb(a,this),d.isValid()?(e=6e4*(d.utcOffset()-this.utcOffset()),b=K(b),"year"===b||"month"===b||"quarter"===b?(g=cc(this,d),"quarter"===b?g/=3:"year"===b&&(g/=12)):(f=this-d,g="second"===b?f/1e3:"minute"===b?f/6e4:"hour"===b?f/36e5:"day"===b?(f-e)/864e5:"week"===b?(f-e)/6048e5:f),c?g:t(g)):NaN):NaN}function cc(a,b){
-// difference in months
-var c,d,e=12*(b.year()-a.year())+(b.month()-a.month()),
-// b is in (anchor - 1 month, anchor + 1 month)
-f=a.clone().add(e,"months");
-//check for negative zero, return zero if negative zero
-// linear across the month
-// linear across the month
-return b-f<0?(c=a.clone().add(e-1,"months"),d=(b-f)/(f-c)):(c=a.clone().add(e+1,"months"),d=(b-f)/(c-f)),-(e+d)||0}function dc(){return this.clone().locale("en").format("ddd MMM DD YYYY HH:mm:ss [GMT]ZZ")}function ec(){var a=this.clone().utc();return 0<a.year()&&a.year()<=9999?z(Date.prototype.toISOString)?this.toDate().toISOString():X(a,"YYYY-MM-DD[T]HH:mm:ss.SSS[Z]"):X(a,"YYYYYY-MM-DD[T]HH:mm:ss.SSS[Z]")}/**
- * Return a human readable representation of a moment that can
- * also be evaluated to get a new moment which is the same
- *
- * @link https://nodejs.org/dist/latest/docs/api/util.html#util_custom_inspect_function_on_objects
- */
-function fc(){if(!this.isValid())return"moment.invalid(/* "+this._i+" */)";var a="moment",b="";this.isLocal()||(a=0===this.utcOffset()?"moment.utc":"moment.parseZone",b="Z");var c="["+a+'("]',d=0<this.year()&&this.year()<=9999?"YYYY":"YYYYYY",e="-MM-DD[T]HH:mm:ss.SSS",f=b+'[")]';return this.format(c+d+e+f)}function gc(b){b||(b=this.isUtc()?a.defaultFormatUtc:a.defaultFormat);var c=X(this,b);return this.localeData().postformat(c)}function hc(a,b){return this.isValid()&&(s(a)&&a.isValid()||sb(a).isValid())?Ob({to:this,from:a}).locale(this.locale()).humanize(!b):this.localeData().invalidDate()}function ic(a){return this.from(sb(),a)}function jc(a,b){return this.isValid()&&(s(a)&&a.isValid()||sb(a).isValid())?Ob({from:this,to:a}).locale(this.locale()).humanize(!b):this.localeData().invalidDate()}function kc(a){return this.to(sb(),a)}
-// If passed a locale key, it will set the locale for this
-// instance.  Otherwise, it will return the locale configuration
-// variables for this instance.
-function lc(a){var b;return void 0===a?this._locale._abbr:(b=bb(a),null!=b&&(this._locale=b),this)}function mc(){return this._locale}function nc(a){
-// the following switch intentionally omits break keywords
-// to utilize falling through the cases.
-switch(a=K(a)){case"year":this.month(0);/* falls through */
-case"quarter":case"month":this.date(1);/* falls through */
-case"week":case"isoWeek":case"day":case"date":this.hours(0);/* falls through */
-case"hour":this.minutes(0);/* falls through */
-case"minute":this.seconds(0);/* falls through */
-case"second":this.milliseconds(0)}
-// weeks are a special case
-// quarters are also special
-return"week"===a&&this.weekday(0),"isoWeek"===a&&this.isoWeekday(1),"quarter"===a&&this.month(3*Math.floor(this.month()/3)),this}function oc(a){
-// 'date' is an alias for 'day', so it should be considered as such.
-return a=K(a),void 0===a||"millisecond"===a?this:("date"===a&&(a="day"),this.startOf(a).add(1,"isoWeek"===a?"week":a).subtract(1,"ms"))}function pc(){return this._d.valueOf()-6e4*(this._offset||0)}function qc(){return Math.floor(this.valueOf()/1e3)}function rc(){return new Date(this.valueOf())}function sc(){var a=this;return[a.year(),a.month(),a.date(),a.hour(),a.minute(),a.second(),a.millisecond()]}function tc(){var a=this;return{years:a.year(),months:a.month(),date:a.date(),hours:a.hours(),minutes:a.minutes(),seconds:a.seconds(),milliseconds:a.milliseconds()}}function uc(){
-// new Date(NaN).toJSON() === null
-return this.isValid()?this.toISOString():null}function vc(){return n(this)}function wc(){return j({},m(this))}function xc(){return m(this).overflow}function yc(){return{input:this._i,format:this._f,locale:this._locale,isUTC:this._isUTC,strict:this._strict}}function zc(a,b){U(0,[a,a.length],0,b)}
-// MOMENTS
-function Ac(a){return Ec.call(this,a,this.week(),this.weekday(),this.localeData()._week.dow,this.localeData()._week.doy)}function Bc(a){return Ec.call(this,a,this.isoWeek(),this.isoWeekday(),1,4)}function Cc(){return xa(this.year(),1,4)}function Dc(){var a=this.localeData()._week;return xa(this.year(),a.dow,a.doy)}function Ec(a,b,c,d,e){var f;return null==a?wa(this,d,e).year:(f=xa(a,d,e),b>f&&(b=f),Fc.call(this,a,b,c,d,e))}function Fc(a,b,c,d,e){var f=va(a,b,c,d,e),g=ta(f.year,0,f.dayOfYear);return this.year(g.getUTCFullYear()),this.month(g.getUTCMonth()),this.date(g.getUTCDate()),this}
-// MOMENTS
-function Gc(a){return null==a?Math.ceil((this.month()+1)/3):this.month(3*(a-1)+this.month()%3)}
-// HELPERS
-// MOMENTS
-function Hc(a){var b=Math.round((this.clone().startOf("day")-this.clone().startOf("year"))/864e5)+1;return null==a?b:this.add(a-b,"d")}function Ic(a,b){b[ge]=u(1e3*("0."+a))}
-// MOMENTS
-function Jc(){return this._isUTC?"UTC":""}function Kc(){return this._isUTC?"Coordinated Universal Time":""}function Lc(a){return sb(1e3*a)}function Mc(){return sb.apply(null,arguments).parseZone()}function Nc(a){return a}function Oc(a,b,c,d){var e=bb(),f=k().set(d,b);return e[c](f,a)}function Pc(a,b,c){if(f(a)&&(b=a,a=void 0),a=a||"",null!=b)return Oc(a,b,c,"month");var d,e=[];for(d=0;d<12;d++)e[d]=Oc(a,d,c,"month");return e}
-// ()
-// (5)
-// (fmt, 5)
-// (fmt)
-// (true)
-// (true, 5)
-// (true, fmt, 5)
-// (true, fmt)
-function Qc(a,b,c,d){"boolean"==typeof a?(f(b)&&(c=b,b=void 0),b=b||""):(b=a,c=b,a=!1,f(b)&&(c=b,b=void 0),b=b||"");var e=bb(),g=a?e._week.dow:0;if(null!=c)return Oc(b,(c+g)%7,d,"day");var h,i=[];for(h=0;h<7;h++)i[h]=Oc(b,(h+g)%7,d,"day");return i}function Rc(a,b){return Pc(a,b,"months")}function Sc(a,b){return Pc(a,b,"monthsShort")}function Tc(a,b,c){return Qc(a,b,c,"weekdays")}function Uc(a,b,c){return Qc(a,b,c,"weekdaysShort")}function Vc(a,b,c){return Qc(a,b,c,"weekdaysMin")}function Wc(){var a=this._data;return this._milliseconds=Ze(this._milliseconds),this._days=Ze(this._days),this._months=Ze(this._months),a.milliseconds=Ze(a.milliseconds),a.seconds=Ze(a.seconds),a.minutes=Ze(a.minutes),a.hours=Ze(a.hours),a.months=Ze(a.months),a.years=Ze(a.years),this}function Xc(a,b,c,d){var e=Ob(b,c);return a._milliseconds+=d*e._milliseconds,a._days+=d*e._days,a._months+=d*e._months,a._bubble()}
-// supports only 2.0-style add(1, 's') or add(duration)
-function Yc(a,b){return Xc(this,a,b,1)}
-// supports only 2.0-style subtract(1, 's') or subtract(duration)
-function Zc(a,b){return Xc(this,a,b,-1)}function $c(a){return a<0?Math.floor(a):Math.ceil(a)}function _c(){var a,b,c,d,e,f=this._milliseconds,g=this._days,h=this._months,i=this._data;
-// if we have a mix of positive and negative values, bubble down first
-// check: https://github.com/moment/moment/issues/2166
-// The following code bubbles up values, see the tests for
-// examples of what that means.
-// convert days to months
-// 12 months -> 1 year
-return f>=0&&g>=0&&h>=0||f<=0&&g<=0&&h<=0||(f+=864e5*$c(bd(h)+g),g=0,h=0),i.milliseconds=f%1e3,a=t(f/1e3),i.seconds=a%60,b=t(a/60),i.minutes=b%60,c=t(b/60),i.hours=c%24,g+=t(c/24),e=t(ad(g)),h+=e,g-=$c(bd(e)),d=t(h/12),h%=12,i.days=g,i.months=h,i.years=d,this}function ad(a){
-// 400 years have 146097 days (taking into account leap year rules)
-// 400 years have 12 months === 4800
-return 4800*a/146097}function bd(a){
-// the reverse of daysToMonths
-return 146097*a/4800}function cd(a){var b,c,d=this._milliseconds;if(a=K(a),"month"===a||"year"===a)return b=this._days+d/864e5,c=this._months+ad(b),"month"===a?c:c/12;switch(
-// handle milliseconds separately because of floating point math errors (issue #1867)
-b=this._days+Math.round(bd(this._months)),a){case"week":return b/7+d/6048e5;case"day":return b+d/864e5;case"hour":return 24*b+d/36e5;case"minute":return 1440*b+d/6e4;case"second":return 86400*b+d/1e3;
-// Math.floor prevents floating point math errors here
-case"millisecond":return Math.floor(864e5*b)+d;default:throw new Error("Unknown unit "+a)}}
-// TODO: Use this.as('ms')?
-function dd(){return this._milliseconds+864e5*this._days+this._months%12*2592e6+31536e6*u(this._months/12)}function ed(a){return function(){return this.as(a)}}function fd(a){return a=K(a),this[a+"s"]()}function gd(a){return function(){return this._data[a]}}function hd(){return t(this.days()/7)}
-// helper function for moment.fn.from, moment.fn.fromNow, and moment.duration.fn.humanize
-function id(a,b,c,d,e){return e.relativeTime(b||1,!!c,a,d)}function jd(a,b,c){var d=Ob(a).abs(),e=of(d.as("s")),f=of(d.as("m")),g=of(d.as("h")),h=of(d.as("d")),i=of(d.as("M")),j=of(d.as("y")),k=e<pf.s&&["s",e]||f<=1&&["m"]||f<pf.m&&["mm",f]||g<=1&&["h"]||g<pf.h&&["hh",g]||h<=1&&["d"]||h<pf.d&&["dd",h]||i<=1&&["M"]||i<pf.M&&["MM",i]||j<=1&&["y"]||["yy",j];return k[2]=b,k[3]=+a>0,k[4]=c,id.apply(null,k)}
-// This function allows you to set the rounding function for relative time strings
-function kd(a){return void 0===a?of:"function"==typeof a&&(of=a,!0)}
-// This function allows you to set a threshold for relative time strings
-function ld(a,b){return void 0!==pf[a]&&(void 0===b?pf[a]:(pf[a]=b,!0))}function md(a){var b=this.localeData(),c=jd(this,!a,b);return a&&(c=b.pastFuture(+this,c)),b.postformat(c)}function nd(){
-// for ISO strings we do not use the normal bubbling rules:
-//  * milliseconds bubble up until they become hours
-//  * days do not bubble at all
-//  * months bubble up until they become years
-// This is because there is no context-free conversion between hours and days
-// (think of clock changes)
-// and also not between days and months (28-31 days per month)
-var a,b,c,d=qf(this._milliseconds)/1e3,e=qf(this._days),f=qf(this._months);
-// 3600 seconds -> 60 minutes -> 1 hour
-a=t(d/60),b=t(a/60),d%=60,a%=60,
-// 12 months -> 1 year
-c=t(f/12),f%=12;
-// inspired by https://github.com/dordille/moment-isoduration/blob/master/moment.isoduration.js
-var g=c,h=f,i=e,j=b,k=a,l=d,m=this.asSeconds();return m?(m<0?"-":"")+"P"+(g?g+"Y":"")+(h?h+"M":"")+(i?i+"D":"")+(j||k||l?"T":"")+(j?j+"H":"")+(k?k+"M":"")+(l?l+"S":""):"P0D"}var od,pd;pd=Array.prototype.some?Array.prototype.some:function(a){for(var b=Object(this),c=b.length>>>0,d=0;d<c;d++)if(d in b&&a.call(this,b[d],d,b))return!0;return!1};var qd=pd,rd=a.momentProperties=[],sd=!1,td={};a.suppressDeprecationWarnings=!1,a.deprecationHandler=null;var ud;ud=Object.keys?Object.keys:function(a){var b,c=[];for(b in a)i(a,b)&&c.push(b);return c};var vd,wd=ud,xd={sameDay:"[Today at] LT",nextDay:"[Tomorrow at] LT",nextWeek:"dddd [at] LT",lastDay:"[Yesterday at] LT",lastWeek:"[Last] dddd [at] LT",sameElse:"L"},yd={LTS:"h:mm:ss A",LT:"h:mm A",L:"MM/DD/YYYY",LL:"MMMM D, YYYY",LLL:"MMMM D, YYYY h:mm A",LLLL:"dddd, MMMM D, YYYY h:mm A"},zd="Invalid date",Ad="%d",Bd=/\d{1,2}/,Cd={future:"in %s",past:"%s ago",s:"a few seconds",m:"a minute",mm:"%d minutes",h:"an hour",hh:"%d hours",d:"a day",dd:"%d days",M:"a month",MM:"%d months",y:"a year",yy:"%d years"},Dd={},Ed={},Fd=/(\[[^\[]*\])|(\\)?([Hh]mm(ss)?|Mo|MM?M?M?|Do|DDDo|DD?D?D?|ddd?d?|do?|w[o|w]?|W[o|W]?|Qo?|YYYYYY|YYYYY|YYYY|YY|gg(ggg?)?|GG(GGG?)?|e|E|a|A|hh?|HH?|kk?|mm?|ss?|S{1,9}|x|X|zz?|ZZ?|.)/g,Gd=/(\[[^\[]*\])|(\\)?(LTS|LT|LL?L?L?|l{1,4})/g,Hd={},Id={},Jd=/\d/,Kd=/\d\d/,Ld=/\d{3}/,Md=/\d{4}/,Nd=/[+-]?\d{6}/,Od=/\d\d?/,Pd=/\d\d\d\d?/,Qd=/\d\d\d\d\d\d?/,Rd=/\d{1,3}/,Sd=/\d{1,4}/,Td=/[+-]?\d{1,6}/,Ud=/\d+/,Vd=/[+-]?\d+/,Wd=/Z|[+-]\d\d:?\d\d/gi,Xd=/Z|[+-]\d\d(?::?\d\d)?/gi,Yd=/[+-]?\d+(\.\d{1,3})?/,Zd=/[0-9]*['a-z\u00A0-\u05FF\u0700-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]+|[\u0600-\u06FF\/]+(\s*?[\u0600-\u06FF]+){1,2}/i,$d={},_d={},ae=0,be=1,ce=2,de=3,ee=4,fe=5,ge=6,he=7,ie=8;vd=Array.prototype.indexOf?Array.prototype.indexOf:function(a){
-// I know
-var b;for(b=0;b<this.length;++b)if(this[b]===a)return b;return-1};var je=vd;
-// FORMATTING
-U("M",["MM",2],"Mo",function(){return this.month()+1}),U("MMM",0,0,function(a){return this.localeData().monthsShort(this,a)}),U("MMMM",0,0,function(a){return this.localeData().months(this,a)}),
-// ALIASES
-J("month","M"),
-// PRIORITY
-M("month",8),
-// PARSING
-Z("M",Od),Z("MM",Od,Kd),Z("MMM",function(a,b){return b.monthsShortRegex(a)}),Z("MMMM",function(a,b){return b.monthsRegex(a)}),ba(["M","MM"],function(a,b){b[be]=u(a)-1}),ba(["MMM","MMMM"],function(a,b,c,d){var e=c._locale.monthsParse(a,d,c._strict);
-// if we didn't find a month name, mark the date as invalid.
-null!=e?b[be]=e:m(c).invalidMonth=a});
-// LOCALES
-var ke=/D[oD]?(\[[^\[\]]*\]|\s)+MMMM?/,le="January_February_March_April_May_June_July_August_September_October_November_December".split("_"),me="Jan_Feb_Mar_Apr_May_Jun_Jul_Aug_Sep_Oct_Nov_Dec".split("_"),ne=Zd,oe=Zd;
-// FORMATTING
-U("Y",0,0,function(){var a=this.year();return a<=9999?""+a:"+"+a}),U(0,["YY",2],0,function(){return this.year()%100}),U(0,["YYYY",4],0,"year"),U(0,["YYYYY",5],0,"year"),U(0,["YYYYYY",6,!0],0,"year"),
-// ALIASES
-J("year","y"),
-// PRIORITIES
-M("year",1),
-// PARSING
-Z("Y",Vd),Z("YY",Od,Kd),Z("YYYY",Sd,Md),Z("YYYYY",Td,Nd),Z("YYYYYY",Td,Nd),ba(["YYYYY","YYYYYY"],ae),ba("YYYY",function(b,c){c[ae]=2===b.length?a.parseTwoDigitYear(b):u(b)}),ba("YY",function(b,c){c[ae]=a.parseTwoDigitYear(b)}),ba("Y",function(a,b){b[ae]=parseInt(a,10)}),
-// HOOKS
-a.parseTwoDigitYear=function(a){return u(a)+(u(a)>68?1900:2e3)};
-// MOMENTS
-var pe=O("FullYear",!0);
-// FORMATTING
-U("w",["ww",2],"wo","week"),U("W",["WW",2],"Wo","isoWeek"),
-// ALIASES
-J("week","w"),J("isoWeek","W"),
-// PRIORITIES
-M("week",5),M("isoWeek",5),
-// PARSING
-Z("w",Od),Z("ww",Od,Kd),Z("W",Od),Z("WW",Od,Kd),ca(["w","ww","W","WW"],function(a,b,c,d){b[d.substr(0,1)]=u(a)});var qe={dow:0,// Sunday is the first day of the week.
-doy:6};
-// FORMATTING
-U("d",0,"do","day"),U("dd",0,0,function(a){return this.localeData().weekdaysMin(this,a)}),U("ddd",0,0,function(a){return this.localeData().weekdaysShort(this,a)}),U("dddd",0,0,function(a){return this.localeData().weekdays(this,a)}),U("e",0,0,"weekday"),U("E",0,0,"isoWeekday"),
-// ALIASES
-J("day","d"),J("weekday","e"),J("isoWeekday","E"),
-// PRIORITY
-M("day",11),M("weekday",11),M("isoWeekday",11),
-// PARSING
-Z("d",Od),Z("e",Od),Z("E",Od),Z("dd",function(a,b){return b.weekdaysMinRegex(a)}),Z("ddd",function(a,b){return b.weekdaysShortRegex(a)}),Z("dddd",function(a,b){return b.weekdaysRegex(a)}),ca(["dd","ddd","dddd"],function(a,b,c,d){var e=c._locale.weekdaysParse(a,d,c._strict);
-// if we didn't get a weekday name, mark the date as invalid
-null!=e?b.d=e:m(c).invalidWeekday=a}),ca(["d","e","E"],function(a,b,c,d){b[d]=u(a)});
-// LOCALES
-var re="Sunday_Monday_Tuesday_Wednesday_Thursday_Friday_Saturday".split("_"),se="Sun_Mon_Tue_Wed_Thu_Fri_Sat".split("_"),te="Su_Mo_Tu_We_Th_Fr_Sa".split("_"),ue=Zd,ve=Zd,we=Zd;U("H",["HH",2],0,"hour"),U("h",["hh",2],0,Ra),U("k",["kk",2],0,Sa),U("hmm",0,0,function(){return""+Ra.apply(this)+T(this.minutes(),2)}),U("hmmss",0,0,function(){return""+Ra.apply(this)+T(this.minutes(),2)+T(this.seconds(),2)}),U("Hmm",0,0,function(){return""+this.hours()+T(this.minutes(),2)}),U("Hmmss",0,0,function(){return""+this.hours()+T(this.minutes(),2)+T(this.seconds(),2)}),Ta("a",!0),Ta("A",!1),
-// ALIASES
-J("hour","h"),
-// PRIORITY
-M("hour",13),Z("a",Ua),Z("A",Ua),Z("H",Od),Z("h",Od),Z("HH",Od,Kd),Z("hh",Od,Kd),Z("hmm",Pd),Z("hmmss",Qd),Z("Hmm",Pd),Z("Hmmss",Qd),ba(["H","HH"],de),ba(["a","A"],function(a,b,c){c._isPm=c._locale.isPM(a),c._meridiem=a}),ba(["h","hh"],function(a,b,c){b[de]=u(a),m(c).bigHour=!0}),ba("hmm",function(a,b,c){var d=a.length-2;b[de]=u(a.substr(0,d)),b[ee]=u(a.substr(d)),m(c).bigHour=!0}),ba("hmmss",function(a,b,c){var d=a.length-4,e=a.length-2;b[de]=u(a.substr(0,d)),b[ee]=u(a.substr(d,2)),b[fe]=u(a.substr(e)),m(c).bigHour=!0}),ba("Hmm",function(a,b,c){var d=a.length-2;b[de]=u(a.substr(0,d)),b[ee]=u(a.substr(d))}),ba("Hmmss",function(a,b,c){var d=a.length-4,e=a.length-2;b[de]=u(a.substr(0,d)),b[ee]=u(a.substr(d,2)),b[fe]=u(a.substr(e))});var xe,ye=/[ap]\.?m?\.?/i,ze=O("Hours",!0),Ae={calendar:xd,longDateFormat:yd,invalidDate:zd,ordinal:Ad,ordinalParse:Bd,relativeTime:Cd,months:le,monthsShort:me,week:qe,weekdays:re,weekdaysMin:te,weekdaysShort:se,meridiemParse:ye},Be={},Ce={},De=/^\s*((?:[+-]\d{6}|\d{4})-(?:\d\d-\d\d|W\d\d-\d|W\d\d|\d\d\d|\d\d))(?:(T| )(\d\d(?::\d\d(?::\d\d(?:[.,]\d+)?)?)?)([\+\-]\d\d(?::?\d\d)?|\s*Z)?)?$/,Ee=/^\s*((?:[+-]\d{6}|\d{4})(?:\d\d\d\d|W\d\d\d|W\d\d|\d\d\d|\d\d))(?:(T| )(\d\d(?:\d\d(?:\d\d(?:[.,]\d+)?)?)?)([\+\-]\d\d(?::?\d\d)?|\s*Z)?)?$/,Fe=/Z|[+-]\d\d(?::?\d\d)?/,Ge=[["YYYYYY-MM-DD",/[+-]\d{6}-\d\d-\d\d/],["YYYY-MM-DD",/\d{4}-\d\d-\d\d/],["GGGG-[W]WW-E",/\d{4}-W\d\d-\d/],["GGGG-[W]WW",/\d{4}-W\d\d/,!1],["YYYY-DDD",/\d{4}-\d{3}/],["YYYY-MM",/\d{4}-\d\d/,!1],["YYYYYYMMDD",/[+-]\d{10}/],["YYYYMMDD",/\d{8}/],
-// YYYYMM is NOT allowed by the standard
-["GGGG[W]WWE",/\d{4}W\d{3}/],["GGGG[W]WW",/\d{4}W\d{2}/,!1],["YYYYDDD",/\d{7}/]],He=[["HH:mm:ss.SSSS",/\d\d:\d\d:\d\d\.\d+/],["HH:mm:ss,SSSS",/\d\d:\d\d:\d\d,\d+/],["HH:mm:ss",/\d\d:\d\d:\d\d/],["HH:mm",/\d\d:\d\d/],["HHmmss.SSSS",/\d\d\d\d\d\d\.\d+/],["HHmmss,SSSS",/\d\d\d\d\d\d,\d+/],["HHmmss",/\d\d\d\d\d\d/],["HHmm",/\d\d\d\d/],["HH",/\d\d/]],Ie=/^\/?Date\((\-?\d+)/i;a.createFromInputFallback=x("value provided is not in a recognized ISO format. moment construction falls back to js Date(), which is not reliable across all browsers and versions. Non ISO date formats are discouraged and will be removed in an upcoming major release. Please refer to http://momentjs.com/guides/#/warnings/js-date/ for more info.",function(a){a._d=new Date(a._i+(a._useUTC?" UTC":""))}),
-// constant that refers to the ISO standard
-a.ISO_8601=function(){};var Je=x("moment().min is deprecated, use moment.max instead. http://momentjs.com/guides/#/warnings/min-max/",function(){var a=sb.apply(null,arguments);return this.isValid()&&a.isValid()?a<this?this:a:o()}),Ke=x("moment().max is deprecated, use moment.min instead. http://momentjs.com/guides/#/warnings/min-max/",function(){var a=sb.apply(null,arguments);return this.isValid()&&a.isValid()?a>this?this:a:o()}),Le=function(){return Date.now?Date.now():+new Date};zb("Z",":"),zb("ZZ",""),
-// PARSING
-Z("Z",Xd),Z("ZZ",Xd),ba(["Z","ZZ"],function(a,b,c){c._useUTC=!0,c._tzm=Ab(Xd,a)});
-// HELPERS
-// timezone chunker
-// '+10:00' > ['10',  '00']
-// '-1530'  > ['-15', '30']
-var Me=/([\+\-]|\d\d)/gi;
-// HOOKS
-// This function will be called whenever a moment is mutated.
-// It is intended to keep the offset in sync with the timezone.
-a.updateOffset=function(){};
-// ASP.NET json date format regex
-var Ne=/^(\-)?(?:(\d*)[. ])?(\d+)\:(\d+)(?:\:(\d+)(\.\d*)?)?$/,Oe=/^(-)?P(?:(-?[0-9,.]*)Y)?(?:(-?[0-9,.]*)M)?(?:(-?[0-9,.]*)W)?(?:(-?[0-9,.]*)D)?(?:T(?:(-?[0-9,.]*)H)?(?:(-?[0-9,.]*)M)?(?:(-?[0-9,.]*)S)?)?$/;Ob.fn=wb.prototype;var Pe=Sb(1,"add"),Qe=Sb(-1,"subtract");a.defaultFormat="YYYY-MM-DDTHH:mm:ssZ",a.defaultFormatUtc="YYYY-MM-DDTHH:mm:ss[Z]";var Re=x("moment().lang() is deprecated. Instead, use moment().localeData() to get the language configuration. Use moment().locale() to change languages.",function(a){return void 0===a?this.localeData():this.locale(a)});
-// FORMATTING
-U(0,["gg",2],0,function(){return this.weekYear()%100}),U(0,["GG",2],0,function(){return this.isoWeekYear()%100}),zc("gggg","weekYear"),zc("ggggg","weekYear"),zc("GGGG","isoWeekYear"),zc("GGGGG","isoWeekYear"),
-// ALIASES
-J("weekYear","gg"),J("isoWeekYear","GG"),
-// PRIORITY
-M("weekYear",1),M("isoWeekYear",1),
-// PARSING
-Z("G",Vd),Z("g",Vd),Z("GG",Od,Kd),Z("gg",Od,Kd),Z("GGGG",Sd,Md),Z("gggg",Sd,Md),Z("GGGGG",Td,Nd),Z("ggggg",Td,Nd),ca(["gggg","ggggg","GGGG","GGGGG"],function(a,b,c,d){b[d.substr(0,2)]=u(a)}),ca(["gg","GG"],function(b,c,d,e){c[e]=a.parseTwoDigitYear(b)}),
-// FORMATTING
-U("Q",0,"Qo","quarter"),
-// ALIASES
-J("quarter","Q"),
-// PRIORITY
-M("quarter",7),
-// PARSING
-Z("Q",Jd),ba("Q",function(a,b){b[be]=3*(u(a)-1)}),
-// FORMATTING
-U("D",["DD",2],"Do","date"),
-// ALIASES
-J("date","D"),
-// PRIOROITY
-M("date",9),
-// PARSING
-Z("D",Od),Z("DD",Od,Kd),Z("Do",function(a,b){return a?b._ordinalParse:b._ordinalParseLenient}),ba(["D","DD"],ce),ba("Do",function(a,b){b[ce]=u(a.match(Od)[0],10)});
-// MOMENTS
-var Se=O("Date",!0);
-// FORMATTING
-U("DDD",["DDDD",3],"DDDo","dayOfYear"),
-// ALIASES
-J("dayOfYear","DDD"),
-// PRIORITY
-M("dayOfYear",4),
-// PARSING
-Z("DDD",Rd),Z("DDDD",Ld),ba(["DDD","DDDD"],function(a,b,c){c._dayOfYear=u(a)}),
-// FORMATTING
-U("m",["mm",2],0,"minute"),
-// ALIASES
-J("minute","m"),
-// PRIORITY
-M("minute",14),
-// PARSING
-Z("m",Od),Z("mm",Od,Kd),ba(["m","mm"],ee);
-// MOMENTS
-var Te=O("Minutes",!1);
-// FORMATTING
-U("s",["ss",2],0,"second"),
-// ALIASES
-J("second","s"),
-// PRIORITY
-M("second",15),
-// PARSING
-Z("s",Od),Z("ss",Od,Kd),ba(["s","ss"],fe);
-// MOMENTS
-var Ue=O("Seconds",!1);
-// FORMATTING
-U("S",0,0,function(){return~~(this.millisecond()/100)}),U(0,["SS",2],0,function(){return~~(this.millisecond()/10)}),U(0,["SSS",3],0,"millisecond"),U(0,["SSSS",4],0,function(){return 10*this.millisecond()}),U(0,["SSSSS",5],0,function(){return 100*this.millisecond()}),U(0,["SSSSSS",6],0,function(){return 1e3*this.millisecond()}),U(0,["SSSSSSS",7],0,function(){return 1e4*this.millisecond()}),U(0,["SSSSSSSS",8],0,function(){return 1e5*this.millisecond()}),U(0,["SSSSSSSSS",9],0,function(){return 1e6*this.millisecond()}),
-// ALIASES
-J("millisecond","ms"),
-// PRIORITY
-M("millisecond",16),
-// PARSING
-Z("S",Rd,Jd),Z("SS",Rd,Kd),Z("SSS",Rd,Ld);var Ve;for(Ve="SSSS";Ve.length<=9;Ve+="S")Z(Ve,Ud);for(Ve="S";Ve.length<=9;Ve+="S")ba(Ve,Ic);
-// MOMENTS
-var We=O("Milliseconds",!1);
-// FORMATTING
-U("z",0,0,"zoneAbbr"),U("zz",0,0,"zoneName");var Xe=r.prototype;Xe.add=Pe,Xe.calendar=Vb,Xe.clone=Wb,Xe.diff=bc,Xe.endOf=oc,Xe.format=gc,Xe.from=hc,Xe.fromNow=ic,Xe.to=jc,Xe.toNow=kc,Xe.get=R,Xe.invalidAt=xc,Xe.isAfter=Xb,Xe.isBefore=Yb,Xe.isBetween=Zb,Xe.isSame=$b,Xe.isSameOrAfter=_b,Xe.isSameOrBefore=ac,Xe.isValid=vc,Xe.lang=Re,Xe.locale=lc,Xe.localeData=mc,Xe.max=Ke,Xe.min=Je,Xe.parsingFlags=wc,Xe.set=S,Xe.startOf=nc,Xe.subtract=Qe,Xe.toArray=sc,Xe.toObject=tc,Xe.toDate=rc,Xe.toISOString=ec,Xe.inspect=fc,Xe.toJSON=uc,Xe.toString=dc,Xe.unix=qc,Xe.valueOf=pc,Xe.creationData=yc,
-// Year
-Xe.year=pe,Xe.isLeapYear=ra,
-// Week Year
-Xe.weekYear=Ac,Xe.isoWeekYear=Bc,
-// Quarter
-Xe.quarter=Xe.quarters=Gc,
-// Month
-Xe.month=ka,Xe.daysInMonth=la,
-// Week
-Xe.week=Xe.weeks=Ba,Xe.isoWeek=Xe.isoWeeks=Ca,Xe.weeksInYear=Dc,Xe.isoWeeksInYear=Cc,
-// Day
-Xe.date=Se,Xe.day=Xe.days=Ka,Xe.weekday=La,Xe.isoWeekday=Ma,Xe.dayOfYear=Hc,
-// Hour
-Xe.hour=Xe.hours=ze,
-// Minute
-Xe.minute=Xe.minutes=Te,
-// Second
-Xe.second=Xe.seconds=Ue,
-// Millisecond
-Xe.millisecond=Xe.milliseconds=We,
-// Offset
-Xe.utcOffset=Db,Xe.utc=Fb,Xe.local=Gb,Xe.parseZone=Hb,Xe.hasAlignedHourOffset=Ib,Xe.isDST=Jb,Xe.isLocal=Lb,Xe.isUtcOffset=Mb,Xe.isUtc=Nb,Xe.isUTC=Nb,
-// Timezone
-Xe.zoneAbbr=Jc,Xe.zoneName=Kc,
-// Deprecations
-Xe.dates=x("dates accessor is deprecated. Use date instead.",Se),Xe.months=x("months accessor is deprecated. Use month instead",ka),Xe.years=x("years accessor is deprecated. Use year instead",pe),Xe.zone=x("moment().zone is deprecated, use moment().utcOffset instead. http://momentjs.com/guides/#/warnings/zone/",Eb),Xe.isDSTShifted=x("isDSTShifted is deprecated. See http://momentjs.com/guides/#/warnings/dst-shifted/ for more information",Kb);var Ye=C.prototype;Ye.calendar=D,Ye.longDateFormat=E,Ye.invalidDate=F,Ye.ordinal=G,Ye.preparse=Nc,Ye.postformat=Nc,Ye.relativeTime=H,Ye.pastFuture=I,Ye.set=A,
-// Month
-Ye.months=fa,Ye.monthsShort=ga,Ye.monthsParse=ia,Ye.monthsRegex=na,Ye.monthsShortRegex=ma,
-// Week
-Ye.week=ya,Ye.firstDayOfYear=Aa,Ye.firstDayOfWeek=za,
-// Day of Week
-Ye.weekdays=Fa,Ye.weekdaysMin=Ha,Ye.weekdaysShort=Ga,Ye.weekdaysParse=Ja,Ye.weekdaysRegex=Na,Ye.weekdaysShortRegex=Oa,Ye.weekdaysMinRegex=Pa,
-// Hours
-Ye.isPM=Va,Ye.meridiem=Wa,$a("en",{ordinalParse:/\d{1,2}(th|st|nd|rd)/,ordinal:function(a){var b=a%10,c=1===u(a%100/10)?"th":1===b?"st":2===b?"nd":3===b?"rd":"th";return a+c}}),
-// Side effect imports
-a.lang=x("moment.lang is deprecated. Use moment.locale instead.",$a),a.langData=x("moment.langData is deprecated. Use moment.localeData instead.",bb);var Ze=Math.abs,$e=ed("ms"),_e=ed("s"),af=ed("m"),bf=ed("h"),cf=ed("d"),df=ed("w"),ef=ed("M"),ff=ed("y"),gf=gd("milliseconds"),hf=gd("seconds"),jf=gd("minutes"),kf=gd("hours"),lf=gd("days"),mf=gd("months"),nf=gd("years"),of=Math.round,pf={s:45,// seconds to minute
-m:45,// minutes to hour
-h:22,// hours to day
-d:26,// days to month
-M:11},qf=Math.abs,rf=wb.prototype;
-// Deprecations
-// Side effect imports
-// FORMATTING
-// PARSING
-// Side effect imports
-return rf.abs=Wc,rf.add=Yc,rf.subtract=Zc,rf.as=cd,rf.asMilliseconds=$e,rf.asSeconds=_e,rf.asMinutes=af,rf.asHours=bf,rf.asDays=cf,rf.asWeeks=df,rf.asMonths=ef,rf.asYears=ff,rf.valueOf=dd,rf._bubble=_c,rf.get=fd,rf.milliseconds=gf,rf.seconds=hf,rf.minutes=jf,rf.hours=kf,rf.days=lf,rf.weeks=hd,rf.months=mf,rf.years=nf,rf.humanize=md,rf.toISOString=nd,rf.toString=nd,rf.toJSON=nd,rf.locale=lc,rf.localeData=mc,rf.toIsoString=x("toIsoString() is deprecated. Please use toISOString() instead (notice the capitals)",nd),rf.lang=Re,U("X",0,0,"unix"),U("x",0,0,"valueOf"),Z("x",Vd),Z("X",Yd),ba("X",function(a,b,c){c._d=new Date(1e3*parseFloat(a,10))}),ba("x",function(a,b,c){c._d=new Date(u(a))}),a.version="2.17.1",b(sb),a.fn=Xe,a.min=ub,a.max=vb,a.now=Le,a.utc=k,a.unix=Lc,a.months=Rc,a.isDate=g,a.locale=$a,a.invalid=o,a.duration=Ob,a.isMoment=s,a.weekdays=Tc,a.parseZone=Mc,a.localeData=bb,a.isDuration=xb,a.monthsShort=Sc,a.weekdaysMin=Vc,a.defineLocale=_a,a.updateLocale=ab,a.locales=cb,a.weekdaysShort=Uc,a.normalizeUnits=K,a.relativeTimeRounding=kd,a.relativeTimeThreshold=ld,a.calendarFormat=Ub,a.prototype=Xe,a});

dashboard/src/3rdparty/js/password-reveal.js

@@ -0,0 +1,32 @@
+// Custom library to add password show/hide icons to input element with `password-reveal` attribute
+// util.js has the angular version, this is for plain js
+
+window.addEventListener('load', function () {
+    var svgEye = '<svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="eye" class="svg-inline--fa fa-eye fa-w-18" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path fill="currentColor" d="M572.52 241.4C518.29 135.59 410.93 64 288 64S57.68 135.64 3.48 241.41a32.35 32.35 0 0 0 0 29.19C57.71 376.41 165.07 448 288 448s230.32-71.64 284.52-177.41a32.35 32.35 0 0 0 0-29.19zM288 400a144 144 0 1 1 144-144 143.93 143.93 0 0 1-144 144zm0-240a95.31 95.31 0 0 0-25.31 3.79 47.85 47.85 0 0 1-66.9 66.9A95.78 95.78 0 1 0 288 160z"></path></svg>';
+    var svgEyeSlash = '<svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="eye-slash" class="svg-inline--fa fa-eye-slash fa-w-20" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512"><path fill="currentColor" d="M320 400c-75.85 0-137.25-58.71-142.9-133.11L72.2 185.82c-13.79 17.3-26.48 35.59-36.72 55.59a32.35 32.35 0 0 0 0 29.19C89.71 376.41 197.07 448 320 448c26.91 0 52.87-4 77.89-10.46L346 397.39a144.13 144.13 0 0 1-26 2.61zm313.82 58.1l-110.55-85.44a331.25 331.25 0 0 0 81.25-102.07 32.35 32.35 0 0 0 0-29.19C550.29 135.59 442.93 64 320 64a308.15 308.15 0 0 0-147.32 37.7L45.46 3.37A16 16 0 0 0 23 6.18L3.37 31.45A16 16 0 0 0 6.18 53.9l588.36 454.73a16 16 0 0 0 22.46-2.81l19.64-25.27a16 16 0 0 0-2.82-22.45zm-183.72-142l-39.3-30.38A94.75 94.75 0 0 0 416 256a94.76 94.76 0 0 0-121.31-92.21A47.65 47.65 0 0 1 304 192a46.64 46.64 0 0 1-1.54 10l-73.61-56.89A142.31 142.31 0 0 1 320 112a143.92 143.92 0 0 1 144 144c0 21.63-5.29 41.79-13.9 60.11z"></path></svg>';
+
+    document.querySelectorAll('[password-reveal]').forEach(function (element) {
+        var eye = document.createElement('i');
+        eye.innerHTML = svgEyeSlash;
+        eye.style.width = '18px';
+        eye.style.height = '18px';
+        eye.style.position = 'relative';
+        eye.style.float = 'right';
+        eye.style.marginTop = '-24px';
+        eye.style.marginRight = '10px';
+        eye.style.cursor = 'pointer';
+
+        eye.addEventListener('click', function () {
+            if (element.type === 'password') {
+                element.type = 'text';
+                eye.innerHTML = svgEye;
+            } else {
+                element.type = 'password';
+                eye.innerHTML = svgEyeSlash;
+            }
+        });
+
+        element.parentNode.style.position = 'relative';
+        element.parentNode.insertBefore(eye, element.nextSibling);
+    });
+});

dashboard/src/authcallback.html

@@ -0,0 +1,11 @@
+<script>
+
+var tmp = window.location.hash.slice(1).split('&');
+
+tmp.forEach(function (pair) {
+    if (pair.indexOf('access_token=') === 0) localStorage.token = pair.split('=')[1];
+});
+
+window.location.href = '/';
+
+</script>

dashboard/src/components/filetree.html

@@ -1,80 +0,0 @@
-
-<!-- Modal image/video viewer -->
-<div class="modal fade" id="{{ 'mediaViewerModal-' + $id }}" tabindex="-1" role="dialog">
-  <div class="modal-dialog" style="max-width: 1280px; max-height: calc(100% - 60px);">
-    <div class="modal-content" style="height: 100%; height: 100%; display: flex; background-color: #000; background-clip: border-box;">
-      <img ng-show="mediaViewer.type === 'image'" ng-src="{{ mediaViewer.src }}" style="display: block; margin: auto; max-width: 100%; max-height: 100%;" />
-      <video ng-show="mediaViewer.type === 'video'" controls preload="auto" autoplay ng-src="{{ mediaViewer.src | trustUrl}}" style="display: block; margin: auto; max-width: 100%; max-height: 100%;"></video>
-    </div>
-  </div>
-</div>
-
-<!-- main content -->
-
-<div class="toolbar">
-  <div class="btn-group" role="group" style="display: block;">
-    <!-- TODO figure out why a line break in code between the two buttons results in a gap visually without any margin/padding set -->
-    <button class="btn btn-primary" ng-click="goDirectoryUp()" ng-disabled="cwd === ''"><i class="fas fa-arrow-left"></i></button><button class="btn btn-primary" ng-disabled="busyRefresh" ng-click="refresh()"><i class="fas fa-redo" ng-class="{ 'fa-spin': busyRefresh }"></i></button>
-  </div>
-  <div class="btn-group path-parts" role="group">
-    <button class="btn btn-default" ng-disabled="cwd === ''" ng-click="changeDirectory('/')" ng-drop="drop($event, '/')" ng-dragleave="dragExit($event, '/')" ng-dragover="dragEnter($event, '/')"><i class="fas fa-home"></i> {{ rootDirLabel }} </button><button class="btn btn-default" ng-disabled="part.path === cwd" ng-click="changeDirectory(part.path)" ng-drop="drop($event, part.path)" ng-dragleave="dragExit($event, part.path)" ng-dragover="dragEnter($event, part.path)" ng-repeat="part in cwdParts">{{ part.name }}</button>
-  </div>
-  <div style="display: block;">
-    <div class="btn-group">
-      <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><i class="fas fa-plus"></i> {{ 'filemanager.toolbar.new' | tr }}</button>
-      <ul class="dropdown-menu">
-        <li><a class="hand" ng-click="onNewFile()">{{ 'filemanager.toolbar.newFile' | tr }}</a></li>
-        <li><a class="hand" ng-click="onNewFolder()">{{ 'filemanager.toolbar.newFolder' | tr }}</a></li>
-      </ul>
-    </div>
-    <div class="btn-group">
-      <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><i class="fas fa-upload"></i> {{ 'filemanager.toolbar.upload' | tr }}</button>
-      <ul class="dropdown-menu dropdown-menu-right">
-        <li><a class="hand" ng-click="onUploadFile()">{{ 'filemanager.toolbar.uploadFile' | tr }}</a></li>
-        <li><a class="hand" ng-click="onUploadFolder()">{{ 'filemanager.toolbar.uploadFolder' | tr }}</a></li>
-      </ul>
-    </div>
-
-  </div>
-</div>
-
-<div class="file-list-header">
-  <table class="table" style="margin: 0;">
-    <thead>
-      <tr>
-        <th style="width: 42px">&nbsp;</th>
-        <th style="">{{ 'filemanager.list.name' | tr }}</th>
-        <th style="width:100px">{{ 'filemanager.list.owner' | tr }}</th>
-        <th style="width: 80px">{{ 'filemanager.list.size' | tr }}</th>
-        <th style="width:100px">{{ 'filemanager.list.mtime' | tr }}</th>
-        <th style="width: 45px;">&nbsp;</th>
-      </tr>
-    </thead>
-  </table>
-</div>
-
-<div class="file-list" ng-class="{ 'entry-hovered': dropToBody, 'busy': busy }" context-menu="menuOptionsBlank" ng-mousedown="onClearSelection($event)" ng-drop="drop($event, null)" ng-dragleave="dragExit($event, null)" ng-dragover="dragEnter($event, null)">
-  <table class="table table-hover" style="margin: 0;">
-    <tbody>
-      <tr ng-show="busy && !busyRefresh">
-        <td colspan="6"><center><h2><i class="fa fa-circle-notch fa-spin"></i></h2></center></td>
-      </tr>
-      <tr ng-show="!(busy && !busyRefresh) && entries.length === 0">
-        <td colspan="" class="text-center">{{ 'filemanager.list.empty' | tr }}</td>
-      </tr>
-      <tr style="cursor: default" ng-hide="busy && !busyRefresh" entry-hashkey="{{ entry['$$hashKey'] }}" ng-repeat="entry in entries" ng-mouseup="onMouseup($event, entry)" draggable="true" ng-dragstart="dragStart($event, entry)" ng-drop="drop($event, entry)" context-menu="menuOptions" ng-mousedown="onMousedown($event, entry)" model="entry" ng-dragleave="dragExit($event, entry)" ng-dragover="dragEnter($event, entry)" ng-class="{ 'entry-hovered': entry.hovered, 'entry-selected': isSelected(entry) }">
-        <td style="width: 42px; height: 42px" ng-dblclick="open(entry)" class="text-center">
-          <i ng-show="!entry.previewUrl" class="fas fa-lg {{ entry.icon }}" ng-class="{ 'text-primary': entry.isDirectory && !isSelected(entry) }"></i>
-          <img ng-show="entry.previewUrl" ng-src="{{ entry.previewUrl }}" height="42" width="42" style="object-fit: cover;"/>
-        </td>
-        <td class="elide-table-cell" ng-dblclick="open(entry)" style="padding-left: 5px;">{{ entry.fileName }}<span ng-show="entry.isSymbolicLink" class="text-muted" style="margin-left: 20px;">{{ 'filemanager.list.symlink' | tr:{ target: entry.target } }}</span></td>
-        <td style="width:100px" class="elide-table-cell" ng-dblclick="open(entry)">{{ entry.uid | prettyOwner }}</td>
-        <td style="width: 80px" class="elide-table-cell" ng-dblclick="open(entry)">{{ entry.size | prettyDecimalSize }}</td>
-        <td style="width:100px" class="elide-table-cell" ng-dblclick="open(entry)" uib-tooltip="{{ entry.mtime | prettyLongDate }}" tooltip-append-to-body="true">{{ entry.mtime | prettyDate }}</td>
-        <td style="width: 45px">
-          <button type="button" class="btn btn-xs btn-default context-menu-action" context-menu="menuOptions" model="entry" context-menu-on="click" ng-click="onEntryContextMenu($event, entry)"><i class="fas fa-ellipsis-h"></i></button>
-        </td>
-      </tr>
-    </tbody>
-  </table>
-</div>

dashboard/src/components/filetree.js

@@ -1,513 +0,0 @@
-'use strict';
-
-/* global angular */
-/* global sanitize, isModalVisible */
-
-angular.module('Application').component('filetree', {
-    bindings: {
-        backendId: '<',
-        backendType: '<',
-        view: '<',
-        clipboard: '<',
-        onUploadFile: '&',
-        onUploadFolder: '&',
-        onNewFile: '&',
-        onNewFolder: '&',
-        onRenameEntry: '&',
-        onExtractEntry: '&',
-        onChownEntries: '&',
-        onDeleteEntries: '&',
-        onCopyEntries: '&',
-        onCutEntries: '&',
-        onPasteEntries: '&'
-    },
-    templateUrl: 'components/filetree.html?<%= revision %>',
-    controller: [ '$scope', '$translate', '$timeout', 'Client', FileTreeController ]
-});
-
-function FileTreeController($scope, $translate, $timeout, Client) {
-    var ctrl = this;
-
-    $scope.backendId = this.backendId;
-    $scope.backendType = this.backendType;
-    $scope.view = this.view;
-
-    $scope.busy = true;
-    $scope.busyRefresh = false;
-    $scope.client = Client;
-    $scope.cwd = null;
-    $scope.cwdParts = [];
-    $scope.rootDirLabel = '';
-    $scope.entries = [];
-    $scope.selected = [];   // holds selected entries
-    $scope.dropToBody = false;
-    $scope.applicationLink = '';
-
-    // register so parent can call child
-    $scope.$parent.registerChild($scope);
-
-    function isArchive(f) {
-        return f.match(/\.tgz$/)        ||
-               f.match(/\.tar$/)        ||
-               f.match(/\.7z$/)         ||
-               f.match(/\.zip$/)        ||
-               f.match(/\.tar\.gz$/)    ||
-               f.match(/\.tar\.xz$/)    ||
-               f.match(/\.tar\.bz2$/);
-    }
-
-    $scope.menuOptions = [];        // shown for entries
-    $scope.menuOptionsBlank = [];   // shown for empty space in folder
-
-    function sort() {
-        return $scope.entries.sort(function (a, b) {
-            if (a.fileName.toLowerCase() < b.fileName.toLowerCase()) return -1;
-            return 1;
-        }).sort(function (a, b) {
-            if ((a.isDirectory && b.isDirectory) || (!a.isDirectory && !b.isDirectory)) return 0;
-            if (a.isDirectory && !b.isDirectory) return -1;
-            return 1;
-        });
-    }
-
-    $scope.isSelected = function (entry) {
-        return $scope.selected.indexOf(entry) !== -1;
-    };
-
-    function download(entry) {
-        var filePath = sanitize($scope.cwd + '/' + entry.fileName);
-
-        Client.filesGet($scope.backendId, $scope.backendType, filePath, 'download', function (error) {
-            if (error) return Client.error(error);
-        });
-    }
-
-    $scope.dragStart = function ($event, entry) {
-        var filePaths = $scope.selected.map(function (entry) { return sanitize($scope.cwd + '/' + entry.fileName); });
-        $event.originalEvent.dataTransfer.setData('application/cloudron-filemanager', JSON.stringify(filePaths));
-    };
-
-    $scope.dragEnter = function ($event, entry) {
-        $event.originalEvent.stopPropagation();
-        $event.originalEvent.preventDefault();
-
-        // if entry is string, we come from breadcrumb
-        if (entry && typeof entry === 'string') $event.currentTarget.classList.add('entry-hovered');
-        else if (entry && entry.isDirectory) entry.hovered = true;
-        else $scope.dropToBody = true;
-
-        $event.originalEvent.dataTransfer.dropEffect = 'move';
-    };
-
-    $scope.dragExit = function ($event, entry) {
-        $event.originalEvent.stopPropagation();
-        $event.originalEvent.preventDefault();
-
-        // if entry is string, we come from breadcrumb
-        if (entry && typeof entry === 'string') $event.currentTarget.classList.remove('entry-hovered');
-        else if (entry && entry.isDirectory) entry.hovered = false;
-        $scope.dropToBody = false;
-
-        $event.originalEvent.dataTransfer.dropEffect = 'move';
-    };
-
-    $scope.drop = function (event, entry) {
-        event.originalEvent.stopPropagation();
-        event.originalEvent.preventDefault();
-
-        $scope.dropToBody = false;
-
-        if (!event.originalEvent.dataTransfer.items[0]) return;
-
-        var targetFolder;
-        if (entry === null) targetFolder = $scope.cwd + '/';
-        else if (typeof entry === 'string') targetFolder = sanitize(entry);
-        else targetFolder = sanitize($scope.cwd + '/' + (entry && entry.isDirectory ? entry.fileName : ''));
-
-        var dataTransfer = event.originalEvent.dataTransfer;
-        var dragContent = dataTransfer.getData('application/cloudron-filemanager');
-
-        // check if we have internal drag'n'drop
-        if (dragContent) {
-            var moved = 0;
-
-            // we expect a JSON.stringified Array here
-            try {
-                dragContent = JSON.parse(dragContent);
-            } catch (e) {
-                console.error('Wrong drag content.', e);
-                return;
-            }
-
-            // move files
-            async.eachLimit(dragContent, 5, function (oldFilePath, callback) {
-                var fileName = oldFilePath.split('/').slice(-1);
-                var newFilePath = sanitize(targetFolder + '/' + fileName);
-
-                // if we drop the item on itself
-                if (oldFilePath === targetFolder) return callback();
-
-                // if nothing changes
-                if (newFilePath === oldFilePath) return callback();
-
-                moved++;
-
-                // TODO this will overwrite files in destination!
-                Client.filesRename($scope.backendId, $scope.backendType, oldFilePath, newFilePath, callback);
-            }, function (error) {
-                if (error) return Client.error(error);
-
-                // only refresh if anything has changed
-                if (moved) $scope.refresh();
-            });
-
-            return;
-        }
-
-        // figure if a folder was dropped on a modern browser, in this case the first would have to be a directory
-        var folderItem;
-        try {
-            folderItem = dataTransfer.items[0].webkitGetAsEntry();
-            if (folderItem.isFile) return $scope.$parent.uploadFiles(event.originalEvent.dataTransfer.files, targetFolder, false);
-        } catch (e) {
-            return $scope.$parent.uploadFiles(event.originalEvent.dataTransfer.files, targetFolder, false);
-        }
-
-        // if we got here we have a folder drop and a modern browser
-        // now traverse the folder tree and create a file list
-        var fileList = [];
-        function traverseFileTree(item, path, callback) {
-            if (item.isFile) {
-                // Get file
-                item.file(function (file) {
-                    fileList.push(file);
-                    callback();
-                });
-            } else if (item.isDirectory) {
-                // Get folder contents
-                var dirReader = item.createReader();
-                dirReader.readEntries(function (entries) {
-                    async.each(entries, function (entry, callback) {
-                        traverseFileTree(entry, path + item.name + '/', callback);
-                    }, callback);
-                });
-            }
-        }
-
-        traverseFileTree(folderItem, '', function (error) {
-            if (error) return console.error(error);
-
-            $scope.$parent.uploadFiles(fileList, targetFolder, false);
-        });
-    };
-
-    $scope.refresh = function () {
-        $scope.$parent.refresh();
-    };
-
-    function amendIcons() {
-        $scope.entries.forEach(function (e) {
-            e.icon = 'fa-file';
-            e.previewUrl = null;
-
-            if (e.isDirectory) e.icon = 'fa-folder';
-            if (e.isSymbolicLink) e.icon = 'fa-link';
-            if (e.isFile) {
-                var mimeType = Mimer().get(e.fileName.toLowerCase());
-                var mimeGroup = mimeType.split('/')[0];
-                if (mimeGroup === 'text') e.icon = 'fa-file-alt';
-                // if (mimeGroup === 'image') e.icon = 'fa-file-image';
-                if (mimeGroup === 'image') {
-                    e.icon = 'fa-file-image';
-                    e.previewUrl = Client.filesGetLink($scope.backendId, $scope.backendType, sanitize($scope.cwd + '/' + e.fileName));
-                }
-                if (mimeGroup === 'video') e.icon = 'fa-file-video';
-                if (mimeGroup === 'audio') e.icon = 'fa-file-audio';
-                if (mimeType === 'text/csv') e.icon = 'fa-file-csv';
-                if (mimeType === 'application/pdf') e.icon = 'fa-file-pdf';
-            }
-        });
-    }
-
-    // called from the parent
-    $scope.onRefresh = function () {
-        $scope.selected = [];
-        $scope.busy = true;
-        $scope.busyRefresh = true;
-
-        Client.filesGet($scope.backendId, $scope.backendType, $scope.cwd, 'data', function (error, result) {
-            if (error && error.statusCode !== 404) return Client.error(error);
-
-            $scope.entries = result ? result.entries : [];
-            amendIcons();
-            sort();
-
-            $scope.busyRefresh = false;
-            $scope.busy = false;
-        });
-    };
-
-    function openDirectory(path) {
-        $scope.cwd = path;
-        $scope.selected = [];
-
-        $scope.cwdParts = path.split('/').filter(function (p) { return !!p; }).map(function (p, i) { return { name: decodeURIComponent(p), path: path.split('/').slice(0, i+1).join('/') }; });
-
-        // refresh will set busy to false once done
-        $scope.refresh();
-    }
-
-    function openFile(entry) {
-        var mimeType = Mimer().get(entry.fileName);
-        var mimeGroup = mimeType.split('/')[0];
-        var path = sanitize($scope.cwd + '/' + entry.fileName);
-
-        if (mimeGroup === 'video' || mimeGroup === 'image') {
-            $scope.mediaViewer.show(entry);
-        } else if (mimeType === 'application/pdf') {
-            Client.filesGet($scope.backendId, $scope.backendType, path, 'open', function (error) { if (error) return Client.error(error); });
-        } else if (mimeGroup === 'text' || mimeGroup === 'application') {
-            $scope.$parent.textEditor.show($scope.cwd, entry);
-        } else {
-            Client.filesGet($scope.backendId, $scope.backendType, path, 'open', function (error) { if (error) return Client.error(error); });
-        }
-
-        $scope.busy = false;
-    }
-
-    $scope.open = function (entry) {
-        if (entry.isDirectory) openDirectory(sanitize($scope.cwd + '/' + entry.fileName));
-        else if (entry.isFile) openFile(entry);
-    };
-
-    $scope.goDirectoryUp = function () {
-        openDirectory(sanitize($scope.cwd + '/..'));
-    };
-
-    $scope.changeDirectory = function (path) {
-        openDirectory(sanitize(path));
-    };
-
-    $scope.onClearSelection = function ($event) {
-        // we don't stop propagation if targets don't match we got the whole list click event
-        if ($event.currentTarget !== $event.target) return;
-
-        $scope.selected = [];
-    };
-
-    $scope.onMousedown = function ($event, entry) {
-        if ($event.button === 2) {
-            $scope.onMouseup($event, entry);
-        }
-    };
-
-    $scope.onMouseup = function ($event, entry) {
-        var i = $scope.selected.indexOf(entry);
-        var multi = ($event.ctrlKey || $event.metaKey);
-        var shift = $event.shiftKey;
-
-        if (shift) {
-            if ($scope.selected.length === 0) {
-                $scope.selected = [ entry ];
-            } else {
-                var pos = $scope.entries.indexOf(entry);
-                var selectedPositions = $scope.selected.map(function (s) { return $scope.entries.indexOf(s); }).sort();
-
-                if (pos < selectedPositions[0]) {
-                    $scope.selected = $scope.entries.slice(pos, selectedPositions[0]+1);
-                } else if (selectedPositions[1] && pos > selectedPositions[1]) {
-                    $scope.selected = $scope.entries.slice(selectedPositions[1], pos+1);
-                } else {
-                    $scope.selected = $scope.entries.slice(selectedPositions[0], pos+1);
-                }
-            }
-        } else if (multi) {
-            if (i === -1) {
-                $scope.selected.push(entry);
-            } else if ($event.button === 0) { // only do this on left click
-                $scope.selected.splice(i, 1);
-            }
-        } else {
-            $scope.selected = [ entry ];
-        }
-    };
-
-    $scope.onEntryContextMenu = function ($event, entry) {
-        if ($scope.selected.indexOf(entry) !== -1) return;
-        $scope.selected.push(entry);
-    };
-
-    $scope.actionSelectAll = function () {
-        $scope.selected = $scope.entries.slice();
-    };
-
-    // just events to the parent controller
-    $scope.onUploadFile = function () { ctrl.onUploadFile({ cwd: $scope.cwd }); };
-    $scope.onUploadFolder = function () { ctrl.onUploadFolder({ cwd: $scope.cwd }); };
-    $scope.onNewFile = function () { ctrl.onNewFile({ cwd: $scope.cwd }); };
-    $scope.onNewFolder = function () { ctrl.onNewFolder({ cwd: $scope.cwd }); };
-
-    $scope.mediaViewer = {
-        type: '',
-        src: '',
-        entry: null,
-
-        show: function (entry) {
-            var filePath = sanitize($scope.cwd + '/' + entry.fileName);
-
-            $scope.mediaViewer.entry = entry;
-            $scope.mediaViewer.type = Mimer().get(entry.fileName).split('/')[0];
-            $scope.mediaViewer.src = Client.filesGetLink($scope.backendId, $scope.backendType, filePath);
-
-            $('#mediaViewerModal-' + $scope.$id).modal('show');
-        },
-
-        close: function () {
-            // set an empty pixel image to bust the cached img to avoid flickering on slow load
-            $scope.mediaViewer.src = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mP8z/C/HgAGgwJ/lK3Q6wAAAABJRU5ErkJggg==';
-
-            $('#mediaViewerModal-' + $scope.$id).modal('hide');
-        }
-    };
-
-    $translate(['filemanager.list.menu.edit', 'filemanager.list.menu.cut', 'filemanager.list.menu.copy', 'filemanager.list.menu.paste', 'filemanager.list.menu.rename', 'filemanager.list.menu.chown', 'filemanager.list.menu.extract', 'filemanager.list.menu.download', 'filemanager.list.menu.delete' ]).then(function (tr) {
-        $scope.menuOptions = [
-            {
-                text: tr['filemanager.list.menu.edit'],
-                displayed: function ($itemScope, $event, entry) { return !entry.isDirectory && !entry.isSymbolicLink; },
-                enabled: function () { return $scope.selected.length === 1; },
-                hasBottomDivider: true,
-                click: function ($itemScope, $event, entry) { $scope.open(entry); }
-            }, {
-                text: tr['filemanager.list.menu.cut'],
-                click: function ($itemScope, $event, entry) { ctrl.onCutEntries({ cwd: $scope.cwd, entries: $scope.selected.slice() }); }
-            }, {
-                text: tr['filemanager.list.menu.copy'],
-                click: function ($itemScope, $event, entry) { ctrl.onCopyEntries({ cwd: $scope.cwd, entries: $scope.selected.slice() }); }
-            }, {
-                text: tr['filemanager.list.menu.paste'],
-                hasBottomDivider: true,
-                enabled: function () { return ctrl.clipboard.length; },
-                click: function ($itemScope, $event, entry) { ctrl.onPasteEntries({ cwd: $scope.cwd, entry: entry }); }
-            }, {
-                text: tr['filemanager.list.menu.rename'],
-                enabled: function () { return $scope.selected.length === 1; },
-                click: function ($itemScope, $event, entry) { ctrl.onRenameEntry({ cwd: $scope.cwd, entry: entry }); }
-            }, {
-                text: tr['filemanager.list.menu.chown'],
-                click: function ($itemScope, $event, entry) { ctrl.onChownEntries({ cwd: $scope.cwd, entries: $scope.selected }); }
-            }, {
-                text: tr['filemanager.list.menu.extract'],
-                displayed: function ($itemScope, $event, entry) { return !entry.isDirectory && isArchive(entry.fileName); },
-                click: function ($itemScope, $event, entry) { ctrl.onExtractEntry({ cwd: $scope.cwd, entry: entry }); }
-            }, {
-                text: tr['filemanager.list.menu.download'],
-                enabled: function () { return $scope.selected.length === 1; },
-                click: function ($itemScope, $event, entry) { download(entry); }
-            }, {
-                text: tr['filemanager.list.menu.delete'],
-                hasTopDivider: true,
-                click: function ($itemScope, $event, entry) { ctrl.onDeleteEntries({ cwd: $scope.cwd, entries: $scope.selected }); }
-            }
-        ];
-    });
-
-    $translate(['filemanager.toolbar.newFile', 'filemanager.toolbar.newFolder', 'filemanager.list.menu.paste', 'filemanager.list.menu.selectAll' ]).then(function (tr) {
-        $scope.menuOptionsBlank = [
-            {
-                text: tr['filemanager.toolbar.newFile'],
-                click: function ($itemScope, $event) { ctrl.onNewFile({ cwd: $scope.cwd }); }
-            }, {
-                text: tr['filemanager.toolbar.newFolder'],
-                click: function ($itemScope, $event) { ctrl.onNewFolder({ cwd: $scope.cwd }); }
-            }, {
-                text: tr['filemanager.list.menu.paste'],
-                hasTopDivider: true,
-                hasBottomDivider: true,
-                enabled: function () { return ctrl.clipboard.length; },
-                click: function ($itemScope, $event) { ctrl.onPasteEntries({ cwd: $scope.cwd, entry: null }); }
-            }, {
-                text: tr['filemanager.list.menu.selectAll'],
-                click: function ($itemScope, $event) { $scope.actionSelectAll(); }
-            }
-        ];
-    });
-
-    function scrollInView(element) {
-        if (!element) return;
-
-        // This assumes the DOM tree being that rigid
-        function isVisible(ele) {
-            var container = ele.parentElement.parentElement.parentElement;
-            var eleTop = ele.offsetTop;
-            var eleBottom = eleTop + ele.clientHeight;
-
-            var containerTop = container.scrollTop;
-            var containerBottom = containerTop + container.clientHeight;
-
-            // The element is fully visible in the container
-            return (
-                (eleTop >= containerTop && eleBottom <= containerBottom) ||
-                // Some part of the element is visible in the container
-                (eleTop < containerTop && containerTop < eleBottom) ||
-                (eleTop < containerBottom && containerBottom < eleBottom)
-            );
-        }
-
-        if (!isVisible(element)) element.scrollIntoView();
-    }
-
-    function openSelected() {
-        if (!$scope.selected.length) return;
-
-        $scope.open($scope.selected[0]);
-    }
-
-    function selectNext() {
-        var entries = sort();
-
-        if (!$scope.selected.length) return $scope.selected = [ entries[0] ];
-
-        var curIndex = $scope.entries.indexOf($scope.selected[0]);
-        if (curIndex !== -1 && curIndex < $scope.entries.length-1) {
-            var entry = entries[++curIndex];
-            $scope.selected = [ entry ];
-            scrollInView(document.querySelector('[entry-hashkey="' + entry['$$hashKey'] + '"]'));
-        }
-    }
-
-    function selectPrev() {
-        var entries = sort();
-
-        if (!$scope.selected.length) return $scope.selected = [ entries.slice(-1) ];
-
-        var curIndex = $scope.entries.indexOf($scope.selected[0]);
-        if (curIndex !== -1 && curIndex !== 0) {
-            var entry = entries[--curIndex];
-            $scope.selected = [ entry ];
-            scrollInView(document.querySelector('[entry-hashkey="' + entry['$$hashKey'] + '"]'));
-        }
-    }
-
-    openDirectory('.');
-
-    $('.file-list').on('scroll', function (event) {
-        if (event.target.scrollTop > 10) event.target.classList.add('top-scroll-indicator');
-        else event.target.classList.remove('top-scroll-indicator');
-    });
-
-    // handle shortcuts
-    window.addEventListener('keydown', function (event) {
-        if ($scope.$parent.activeView !== $scope.view || $scope.$parent.viewerOpen || isModalVisible()) return;
-
-        if (event.key === 'ArrowDown') {
-            $scope.$apply(selectNext);
-        } else if (event.key === 'ArrowUp') {
-             $scope.$apply(selectPrev);
-        } else if (event.key === 'Enter') {
-             $scope.$apply(openSelected);
-        } else if (event.key === 'Backspace') {
-           if ($scope.view === 'fileTree') $scope.goDirectoryUp();
-        }
-    });
-}

dashboard/src/filemanager.html

@@ -1,354 +0,0 @@
-<!DOCTYPE html>
-<html ng-app="Application">
-<head>
-  <meta charset="utf-8" />
-  <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height" />
-
-  <title>Cloudron Filemanager</title>
-  <meta name="description" content="Cloudron Filemanager">
-
-  <link id="favicon" href="/api/v1/cloudron/avatar" rel="icon" type="image/png">
-  <link rel="apple-touch-icon" href="/api/v1/cloudron/avatar">
-  <link rel="icon" href="/api/v1/cloudron/avatar">
-
-  <!-- CSS -->
-  <link type="text/css" rel="stylesheet" href="/3rdparty/angular-ui-notification.css?<%= revision %>"/>
-  <link type="text/css" rel="stylesheet" href="/theme.css?<%= revision %>">
-
-  <!-- Fontawesome -->
-  <link type="text/css" rel="stylesheet" href="/3rdparty/fontawesome/css/all.css?<%= revision %>"/>
-
-  <!-- jQuery-->
-  <script type="text/javascript" src="/3rdparty/js/jquery.min.js?<%= revision %>"></script>
-
-  <!-- async -->
-  <script type="text/javascript" src="/3rdparty/js/async-3.2.0.min.js?<%= revision %>"></script>
-
-  <!-- Showdown (markdown converter) -->
-  <script type="text/javascript" src="/3rdparty/js/showdown-1.9.1.min.js?<%= revision %>"></script>
-
-  <!-- Bootstrap Core JavaScript -->
-  <script type="text/javascript" src="/3rdparty/js/bootstrap.min.js?<%= revision %>"></script>
-
-  <!-- Angularjs scripts -->
-  <script type="text/javascript" src="/3rdparty/js/angular.min.js?<%= revision %>"></script>
-  <script type="text/javascript" src="/3rdparty/js/angular-loader.min.js?<%= revision %>"></script>
-  <script type="text/javascript" src="/3rdparty/js/angular-cookies.min.js?<%= revision %>"></script>
-  <script type="text/javascript" src="/3rdparty/js/angular-animate.min.js?<%= revision %>"></script>
-  <script type="text/javascript" src="/3rdparty/js/angular-base64.min.js?<%= revision %>"></script>
-  <script type="text/javascript" src="/3rdparty/js/angular-md5.min.js?<%= revision %>"></script>
-  <script type="text/javascript" src="/3rdparty/js/angular-sanitize.min.js?<%= revision %>"></script>
-  <script type="text/javascript" src="/3rdparty/js/angular-ui-notification.js?<%= revision %>"></script>
-
-  <!-- Angular directives for bootstrap https://angular-ui.github.io/bootstrap/ -->
-  <script type="text/javascript" src="/3rdparty/js/ui-bootstrap-tpls-1.3.3.min.js?<%= revision %>"></script>
-
-  <!-- Angular translate https://angular-translate.github.io/ -->
-  <script type="text/javascript" src="/3rdparty/js/angular-translate.min.js?<%= revision %>"></script>
-  <script type="text/javascript" src="/3rdparty/js/angular-translate-loader-static-files.min.js?<%= revision %>"></script>
-  <script type="text/javascript" src="/3rdparty/js/angular-translate-storage-cookie.min.js?<%= revision %>"></script>
-  <script type="text/javascript" src="/3rdparty/js/angular-translate-storage-local.min.js?<%= revision %>"></script>
-
-  <!-- colors -->
-  <script type="text/javascript" src="/3rdparty/js/colors.js?<%= revision %>"></script>
-
-  <!-- moment -->
-  <script type="text/javascript" src="/3rdparty/js/moment.min.js?<%= revision %>"></script>
-
-  <!-- https://github.com/data-uri/mimer -->
-  <script type="text/javascript" src="/3rdparty/js/mimer.min.js?<%= revision %>"></script>
-
-  <!-- https://github.com/Templarian/ui.bootstrap.contextMenu -->
-  <script type="text/javascript" src="/3rdparty/js/contextMenu.js?<%= revision %>"></script>
-
-  <!-- WARNING this adds an AMD loader! Make sure script tag includes like mimer are above -->
-  <!-- monaco-editor -->
-  <script type="text/javascript" src="/3rdparty/vs/loader.js?<%= revision %>"></script>
-
-  <!-- Main Application -->
-  <script type="text/javascript" src="/js/filemanager.js?<%= revision %>"></script>
-
-</head>
-
-<body class="filemanager" ng-drop="drop($event)" ng-dragover="dragEnter($event)" ng-dragleave="dragExit($event)" ng-controller="FileManagerController">
-
-  <a class="offline-banner animateMe" ng-show="client.offline" ng-cloak href="https://docs.cloudron.io/troubleshooting/" target="_blank"><i class="fa fa-circle-notch fa-spin"></i> {{ 'main.offline' | tr }}</a>
-
-  <div class="restart-banner animateMe" ng-show="restartBusy" ng-cloak><i class="fa fa-circle-notch fa-spin"></i> {{ 'filemanager.status.restartingApp' | tr}}</div>
-
-  <!-- Modal delete entries -->
-  <div class="modal fade" id="entriesDeleteModal" tabindex="-1" role="dialog">
-    <div class="modal-dialog">
-      <div class="modal-content">
-        <div class="modal-body">
-          <p class="text-bold text-danger" ng-show="deleteEntries.error">{{ deleteEntries.error }}</p>
-          <h4 ng-hide="deleteEntries.error">{{ 'filemanager.removeDialog.reallyDelete' | tr }}</h4>
-          <ul>
-            <li ng-repeat="entry in deleteEntries.entries">{{ entry.fileName }}</li>
-          </ul>
-        </div>
-        <div class="modal-footer">
-          <button type="button" class="btn btn-default" data-dismiss="modal">{{ 'main.dialog.no' | tr }}</button>
-          <button type="button" class="btn btn-danger" ng-click="deleteEntries.submit()" ng-hide="deleteEntries.error" ng-disabled="deleteEntries.busy"><i class="fa fa-circle-notch fa-spin" ng-show="deleteEntries.busy"></i> {{ 'main.dialog.yes' | tr }}</button>
-        </div>
-      </div>
-    </div>
-  </div>
-
-  <!-- Modal rename entry -->
-  <div class="modal fade" id="renameEntryModal" tabindex="-1" role="dialog">
-    <div class="modal-dialog">
-      <div class="modal-content">
-        <div class="modal-header">
-          <h4 class="modal-title">{{ 'filemanager.renameDialog.title' | tr:{ fileName: renameEntry.entry.fileName } }}</h4>
-        </div>
-        <div class="modal-body">
-          <form role="form" name="renameEntryForm" ng-submit="renameEntry.submit()" autocomplete="off">
-            <div class="form-group" ng-class="{ 'has-error': (renameEntryForm.newName.$dirty && renameEntryForm.newName.$invalid) }">
-              <label class="control-label">{{ 'filemanager.renameDialog.newName' | tr }}</label>
-              <div class="control-label" ng-show="renameEntry.error">{{ renameEntry.error }}</div>
-              <input type="text" class="form-control" id="inputNewName" name="newName" ng-model="renameEntry.newName" required autofocus>
-            </div>
-            <input class="ng-hide" type="submit" ng-disabled="renameEntryForm.$invalid || renameEntry.busy"/>
-          </form>
-        </div>
-        <div class="modal-footer">
-          <button type="button" class="btn btn-default" data-dismiss="modal">{{ 'main.dialog.close' | tr }}</button>
-          <button type="button" class="btn btn-primary" ng-click="renameEntry.submit()" ng-hide="renameEntry.error" ng-disabled="renameEntry.busy"><i class="fa fa-circle-notch fa-spin" ng-show="renameEntry.busy"></i> {{ 'filemanager.renameDialog.rename' | tr }}</button>
-        </div>
-      </div>
-    </div>
-  </div>
-
-  <!-- Modal extract -->
-  <div class="modal fade" id="extractModal" tabindex="-1" role="dialog">
-    <div class="modal-dialog">
-      <div class="modal-content">
-        <div class="modal-header">
-          <h4 class="modal-title">{{ 'filemanager.extractDialog.title' | tr:{ fileName: extractStatus.fileName } }}</h4>
-        </div>
-        <div class="modal-body">
-          <div ng-show="extractStatus.error">
-            <p class="text-danger">{{ extractStatus.error }}</p>
-          </div>
-          <div class="progress progress-striped active" ng-hide="extractStatus.error">
-            <div class="progress-bar" role="progressbar" style="width: 100%">
-            </div>
-          </div>
-          <p class="no-wrap" ng-hide="extractStatus.error">{{ extractStatus.fileName }}</p>
-        </div>
-        <div class="modal-footer" style="text-align: left;">
-          <small ng-hide="extractStatus.error">{{ 'filemanager.extractDialog.closeWarning' | tr }}</small>
-          <button class="btn btn-primary pull-right" ng-show="extractStatus.error" data-dismiss="modal">{{ 'main.dialog.close' | tr }}</button>
-        </div>
-      </div>
-    </div>
-  </div>
-
-  <!-- Modal chown entry -->
-  <div class="modal fade" id="chownEntriesModal" tabindex="-1" role="dialog">
-    <div class="modal-dialog">
-      <div class="modal-content">
-        <div class="modal-header">
-          <h4 class="modal-title">{{ 'filemanager.chownDialog.title' | tr }}</h4>
-        </div>
-        <div class="modal-body">
-          <form role="form" name="chownEntryForm" ng-submit="chownEntries.submit()" autocomplete="off">
-            <div class="form-group" ng-class="{ 'has-error': (chownEntryForm.newOwner.$dirty && chownEntries.error) }">
-              <label class="control-label">{{ 'filemanager.chownDialog.newOwner' | tr }}</label>
-              <div class="control-label" for="inputNewOwner" ng-show="chownEntries.error">{{ chownEntries.error }}</div>
-              <select class="form-control" id="inputNewOwner" name="newOwner" ng-model="chownEntries.newOwner" ng-options="a.value as a.name for a in OWNERS" ng-disabled="chownEntries.busy"></select>
-            </div>
-            <div class="form-group" ng-show="chownEntries.showRecursiveOption">
-              <input type="checkbox" id="inputNewOwnerRecursive" ng-model="chownEntries.recursive">
-              <label class="control-label" for="inputNewOwnerRecursive">{{ 'filemanager.chownDialog.recursiveCheckbox' | tr }}</label>
-            </div>
-            <input class="ng-hide" type="submit" ng-disabled="chownEntryForm.$invalid || chownEntries.busy"/>
-          </form>
-        </div>
-        <div class="modal-footer">
-          <button type="button" class="btn btn-default" data-dismiss="modal">{{ 'main.dialog.close' | tr }}</button>
-          <button type="button" class="btn btn-primary" ng-click="chownEntries.submit()" ng-hide="chownEntries.error" ng-disabled="chownEntries.busy"><i class="fa fa-circle-notch fa-spin" ng-show="chownEntries.busy"></i> {{ 'filemanager.chownDialog.change' | tr }}</button>
-        </div>
-      </div>
-    </div>
-  </div>
-
-  <!-- Modal new file -->
-  <div class="modal fade" id="newFileModal" tabindex="-1" role="dialog">
-    <div class="modal-dialog">
-      <div class="modal-content">
-        <div class="modal-header">
-          <h4 class="modal-title">{{ 'filemanager.newFileDialog.title' | tr }}</h4>
-        </div>
-        <div class="modal-body">
-          <form role="form" name="newFileForm" ng-submit="newFile.submit()" autocomplete="off">
-            <div class="form-group" ng-class="{ 'has-error': newFile.error || (newFileForm.fileName.$dirty && newFileForm.fileName.$invalid) }">
-              <input type="text" class="form-control" id="inputFileName" name="fileName" ng-model="newFile.name" required autofocus>
-              <div class="control-label" ng-show="newFile.error === 'exists'">{{ 'filemanager.newFile.errorAlreadyExists' | tr }}</div>
-            </div>
-            <input class="ng-hide" type="submit" ng-disabled="newFileForm.$invalid || newFile.busy"/>
-          </form>
-        </div>
-        <div class="modal-footer">
-          <button type="button" class="btn btn-default" data-dismiss="modal">{{ 'main.dialog.close' | tr }}</button>
-          <button type="button" class="btn btn-primary" ng-click="newFile.submit()" ng-disabled="newFile.busy"><i class="fa fa-circle-notch fa-spin" ng-show="newFile.busy"></i> {{ 'filemanager.newFileDialog.create' | tr }}</button>
-        </div>
-      </div>
-    </div>
-  </div>
-
-  <!-- Modal new directory -->
-  <div class="modal fade" id="newFolderModal" tabindex="-1" role="dialog">
-    <div class="modal-dialog">
-      <div class="modal-content">
-        <div class="modal-header">
-          <h4 class="modal-title">{{ 'filemanager.newDirectoryDialog.title' | tr }}</h4>
-        </div>
-        <div class="modal-body">
-          <form role="form" name="newFolderForm" ng-submit="newFolder.submit()" autocomplete="off">
-            <div class="form-group" ng-class="{ 'has-error': newFolder.error || (newFolderForm.directoryName.$dirty && newFolderForm.directoryName.$invalid) }">
-              <input type="text" class="form-control" id="inputDirectoryName" name="directoryName" ng-model="newFolder.name" required autofocus>
-              <div class="control-label" ng-show="newFolder.error === 'exists'">{{ 'filemanager.newDirectory.errorAlreadyExists' | tr }}</div>
-            </div>
-            <input class="ng-hide" type="submit" ng-disabled="newDirectoryForm.$invalid || newFolder.busy"/>
-          </form>
-        </div>
-        <div class="modal-footer">
-          <button type="button" class="btn btn-default" data-dismiss="modal">{{ 'main.dialog.close' | tr }}</button>
-          <button type="button" class="btn btn-primary" ng-click="newFolder.submit()" ng-disabled="newFolder.busy"><i class="fa fa-circle-notch fa-spin" ng-show="newFolder.busy"></i> {{ 'filemanager.newDirectoryDialog.create' | tr }}</button>
-        </div>
-      </div>
-    </div>
-  </div>
-
-  <!-- Modal editor close -->
-  <div class="modal fade" id="textEditorCloseModal" tabindex="-1" role="dialog">
-    <div class="modal-dialog">
-      <div class="modal-content">
-        <div class="modal-header">
-          <h4 class="modal-title">{{ 'filemanager.textEditorCloseDialog.title' | tr }}</h4>
-        </div>
-        <div class="modal-body">
-          <p class="text-bold text-danger">{{ 'filemanager.textEditorCloseDialog.details' | tr }}</p>
-        </div>
-        <div class="modal-footer">
-          <button type="button" class="btn btn-default" ng-click="textEditor.onClose()">{{ 'filemanager.textEditorCloseDialog.dontSave' | tr }}</button>
-          <button type="button" class="btn btn-default" data-dismiss="modal">{{ 'main.dialog.cancel' | tr }}</button>
-          <button type="button" class="btn btn-success" ng-click="textEditor.saveAndClose()"><i class="fa fa-circle-notch fa-spin" ng-show="textEditor.busy"></i> {{ 'main.dialog.save' | tr }}</button>
-        </div>
-      </div>
-    </div>
-  </div>
-
-  <!-- Modal upload -->
-  <div class="modal fade" id="uploadModal" tabindex="-1" role="dialog">
-    <div class="modal-dialog">
-      <div class="modal-content">
-        <div class="modal-header">
-          <h4 class="modal-title">{{ 'filemanager.uploadingDialog.title' | tr:{ countDone: uploadStatus.countDone, count: uploadStatus.count } }}</h4>
-        </div>
-        <div class="modal-body">
-          <div ng-show="uploadStatus.error">
-            <p class="text-danger" ng-show="uploadStatus.error === 'exists'">{{ 'filemanager.uploadingDialog.errorAlreadyExists' | tr }}</p>
-            <p class="text-danger" ng-show="uploadStatus.error === 'generic'">{{ 'filemanager.uploadingDialog.errorFailed' | tr }}</p>
-          </div>
-          <span><b>{{ uploadStatus.sizeDone | prettyDecimalSize }}</b> (total {{ uploadStatus.size | prettyDecimalSize }})</span>
-          <div class="progress progress-striped active" ng-hide="uploadStatus.error">
-            <div class="progress-bar progress-bar-success" role="progressbar" style="width: {{ uploadStatus.percentDone || 0 }}%"></div>
-          </div>
-          <p class="no-wrap" ng-hide="uploadStatus.error">{{ uploadStatus.fileName }}</p>
-        </div>
-        <div class="modal-footer" style="text-align: left;">
-          <small ng-hide="uploadStatus.error">{{ 'filemanager.uploadingDialog.closeWarning' | tr }}</small>
-          <button class="btn btn-default pull-right" ng-show="uploadStatus.error" data-dismiss="modal">{{ 'main.dialog.close' | tr }}</button>
-          <button class="btn btn-primary pull-right" ng-show="uploadStatus.error === 'generic'" ng-click="retryUpload(false)">{{ 'filemanager.uploadingDialog.retry' | tr }}</button>
-          <button class="btn btn-danger pull-right" ng-show="uploadStatus.error === 'exists'" ng-click="retryUpload(true)">{{ 'filemanager.uploadingDialog.overwrite' | tr }}</button>
-        </div>
-      </div>
-    </div>
-  </div>
-
-  <div class="animateMe ng-hide layout-root" ng-show="initialized">
-    <div class="row" ng-hide="title">
-      <div class="col-md-12 text-center">
-        <h3>{{ 'filemanager.notFound' | tr }}</h3>
-      </div>
-    </div>
-
-    <input type="file" id="uploadFileInput" style="display: none" multiple/>
-    <input type="file" id="uploadFolderInput" style="display: none" multiple webkitdirectory directory/>
-
-    <div class="container card" ng-show="title" style="max-width: unset;">
-      <h4 class="text-left">
-        {{ title }}
-
-        <div class="pull-right">
-          <div class="btn-group" ng-show="volumes.length">
-            <button type="button" class="btn btn-sm btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><i class="fas fa-folder"></i> <span class="caret"></span></button>
-            <ul class="dropdown-menu dropdown-menu-right">
-              <li ng-repeat="volume in volumes"><a class="hand" ng-href="{{ '/filemanager.html?type=volume&id=' + volume.id }}" target="_blank"><i class="fas fa-folder fa-fw"></i> {{ volume.name }}</a></li>
-            </ul>
-          </div>
-          <button type="button" class="btn btn-sm btn-default" ng-class="{ 'active': splitView }" ng-click="toggleSplitView()"><i class="fas fa-columns"></i></button>
-          <div class="btn-group">
-            <button type="button" class="btn btn-sm btn-default" ng-show="backendType === 'app'" ng-click="onRestartApp()" uib-tooltip="{{ 'filemanager.toolbar.restartApp' | tr }}" tooltip-placement="bottom" tooltip-append-to-body="true"><i class="fas fa-sync-alt"></i></button>
-            <button type="button" class="btn btn-sm btn-default" ng-show="backendType === 'mail'" ng-click="onRestartMail()" uib-tooltip="{{ 'filemanager.toolbar.restartApp' | tr }}" tooltip-placement="bottom" tooltip-append-to-body="true"><i class="fas fa-sync-alt"></i></button>
-            <a type="button" class="btn btn-sm btn-default" ng-show="backendType === 'app'" ng-href="/logs.html?{{ backendType === 'app' ? 'appId=' + backendId : 'id=mail' }}" target="_blank" uib-tooltip="{{ 'filemanager.toolbar.openLogs' | tr }}" tooltip-placement="bottom" tooltip-append-to-body="true"><i class="fas fa-align-left"></i></a>
-            <a type="button" class="btn btn-sm btn-default" ng-show="backendType === 'app'" ng-href="{{ '/terminal.html?id=' + backendId }}" target="_blank" uib-tooltip="{{ 'filemanager.toolbar.openTerminal' | tr }}" tooltip-placement="bottom" tooltip-append-to-body="true"><i class="fa fa-terminal"></i></a>
-          </div>
-        </div>
-      </h4>
-
-      <div class="file-trees">
-        <filetree ng-class="{ 'two-pane': splitView }"
-          on-upload-folder="onUploadFolder(cwd)"
-          on-upload-file="onUploadFile(cwd)"
-          on-new-file="newFile.show(cwd)"
-          on-new-folder="newFolder.show(cwd)"
-          on-copy-entries="actionCopy(cwd, entries)"
-          on-cut-entries="actionCut(cwd, entries)"
-          on-paste-entries="actionPaste(cwd, entries)"
-          on-delete-entries="deleteEntries.show(cwd, entries)"
-          on-rename-entry="renameEntry.show(cwd, entry)"
-          on-extract-entry="extractEntry(cwd, entry)"
-          on-chown-entries="chownEntries.show(cwd, entries)"
-          backend-type="backendType" backend-id="backendId" view="VIEW.LEFT" clipboard="clipboard"
-          ng-click="setActiveView(VIEW.LEFT)"></filetree>
-        <filetree ng-show="splitView" class="two-pane"
-          on-upload-folder="onUploadFolder(cwd)"
-          on-upload-file="onUploadFile(cwd)"
-          on-new-file="newFile.show(cwd)"
-          on-new-folder="newFolder.show(cwd)"
-          on-copy-entries="actionCopy(cwd, entries)"
-          on-cut-entries="actionCut(cwd, entries)"
-          on-paste-entries="actionPaste(cwd, entries)"
-          on-delete-entries="deleteEntries.show(cwd, entries)"
-          on-rename-entry="renameEntry.show(cwd, entry)"
-          on-extract-entry="extractEntry(cwd, entry)"
-          on-chown-entries="chownEntries.show(cwd, entries)"
-          backend-type="backendType" backend-id="backendId" view="VIEW.RIGHT" clipboard="clipboard"
-          ng-click="setActiveView(VIEW.RIGHT)"></filetree>
-      </div>
-
-    </div>
-  </div>
-
-  <div ng-show="textEditor.visible" class="text-editor">
-    <div>
-      <div class="toolbar">
-        <div><span>{{ textEditor.entry.fileName }}</span></div>
-        <button type="button" class="btn btn-primary" ng-click="textEditor.maybeClose()">{{ 'main.dialog.close' | tr }}</button>
-        <button type="button" class="btn btn-success" ng-click="textEditor.save()" ng-disabled="textEditor.busy"><i class="fa fa-circle-notch fa-spin" ng-show="textEditor.busy"></i> {{ 'main.dialog.save' | tr }}</button>
-      </div>
-    </div>
-    <div id="textEditorContainer" style="flex-grow: 2; border: 0px solid black"></div>
-  </div>
-
-  <footer class="text-center ng-cloak">
-    <span class="text-muted" ng-bind-html="status.footer | markdown2html"></span>
-  </footer>
-</div>
-
-</body>
-</html>

dashboard/src/index.html

@@ -80,11 +80,8 @@
     <!-- Anugular Multiselect https://github.com/sebastianha/angular-bootstrap-multiselect -->
     <script type="text/javascript" src="/3rdparty/js/angular-bootstrap-multiselect.js?<%= revision %>"></script>
 
-    <!-- colors -->
-    <script type="text/javascript" src="/3rdparty/js/colors.js?<%= revision %>"></script>
-
     <!-- moment -->
-    <script type="text/javascript" src="/3rdparty/js/moment.min.js?<%= revision %>"></script>
+    <script type="text/javascript" src="/3rdparty/js/moment-with-locales.min.js?<%= revision %>"></script>
 
     <!-- timezone list -->
     <script type="text/javascript" src="/js/timezones.js?<%= revision %>"></script>
@@ -159,7 +156,7 @@
                       </a>
                     </li>
                     <li>
-                      <a ng-class="{ active: isActive('/apps')}" href="#/apps"><i class="fa fa-th fa-fw"></i> {{ 'apps.title' | tr }}</a>
+                      <a ng-class="{ active: isActive('/apps')}" href="#/apps"><i class="fa fa-grip fa-fw"></i> {{ 'apps.title' | tr }}</a>
                     </li>
                     <li ng-show="user.isAtLeastAdmin">
                       <a ng-class="{ active: isActive('/appstore')}" href="#/appstore"><i class="fa fa-cloud-download-alt fa-fw"></i> {{ 'appstore.title' | tr }}</a>
@@ -187,6 +184,7 @@
                         <li ng-show="user.isAtLeastAdmin"><a href="#/network"><i class="fas fa-network-wired fa-fw"></i> {{ 'network.title' | tr }}</a></li>
                         <li ng-show="user.isAtLeastAdmin"><a href="#/services"><i class="fa fa-cogs fa-fw"></i> {{ 'services.title' | tr }}</a></li>
                         <li ng-show="user.isAtLeastAdmin"><a href="#/settings"><i class="fa fa-wrench fa-fw"></i> {{ 'settings.title' | tr }}</a></li>
+                        <li ng-show="user.isAtLeastAdmin"><a href="#/usersettings"><i class="fa fa-users-gear fa-fw"></i> {{ 'users.title' | tr }}</a></li>
                         <li ng-show="user.isAtLeastAdmin"><a href="#/volumes"><i class="fa fa-hdd fa-fw"></i> {{ 'volumes.title' | tr }}</a></li>
                         <li ng-show="user.isAtLeastAdmin" class="divider"></li>
                         <li ng-show="user.isAtLeastOwner"><a href="#/support"><i class="fa fa-comment fa-fw"></i> {{ 'support.title' | tr }}</a></li>

dashboard/src/js/filemanager.js

@@ -1,890 +0,0 @@
-'use strict';
-
-require.config({ paths: { 'vs': '3rdparty/vs' }});
-
-// create main application module
-var app = angular.module('Application', ['pascalprecht.translate', 'ngCookies', 'angular-md5', 'ui-notification', 'ngDrag', 'ui.bootstrap', 'ui.bootstrap.contextMenu']);
-
-angular.module('Application').filter('prettyOwner', function () {
-    return function (uid) {
-        if (uid === 0) return 'root';
-        if (uid === 33) return 'www-data';
-        if (uid === 1000) return 'cloudron';
-        if (uid === 1001) return 'git';
-
-        return uid;
-    };
-});
-
-// disable sce for footer https://code.angularjs.org/1.5.8/docs/api/ng/service/$sce
-app.config(function ($sceProvider) {
-    $sceProvider.enabled(false);
-});
-
-app.filter('trustUrl', ['$sce', function ($sce) {
-    return function (recordingUrl) {
-        return $sce.trustAsResourceUrl(recordingUrl);
-    };
-}]);
-
-// https://stackoverflow.com/questions/25621321/angularjs-ng-drag
-var ngDragEventDirectives = {};
-angular.forEach(
-    'drag dragend dragenter dragexit dragleave dragover dragstart drop'.split(' '),
-    function(eventName) {
-        var directiveName = 'ng' + eventName.charAt(0).toUpperCase() + eventName.slice(1);
-
-        ngDragEventDirectives[directiveName] = ['$parse', '$rootScope', function($parse/*, $rootScope */) {
-            return {
-                restrict: 'A',
-                compile: function($element, attr) {
-                    var fn = $parse(attr[directiveName], null, true);
-
-                    return function ngDragEventHandler(scope, element) {
-                        element.on(eventName, function(event) {
-                            var callback = function() {
-                                fn(scope, {$event: event});
-                            };
-
-                            scope.$apply(callback);
-                        });
-                    };
-                }
-            };
-        }];
-    }
-);
-angular.module('ngDrag', []).directive(ngDragEventDirectives);
-
-function sanitize(filePath) {
-    filePath = filePath.split('/').filter(function (a) { return !!a; }).reduce(function (a, v) {
-        if (v === '.'); // do nothing
-        else if (v === '..') a.pop();
-        else a.push(v);
-        return a;
-    }, []).map(function (p) {
-        // small detour to safely handle special characters and whitespace
-        return encodeURIComponent(decodeURIComponent(p));
-    }).join('/');
-
-    return filePath;
-}
-
-function isModalVisible() {
-    return !!document.getElementsByClassName('modal in').length;
-}
-
-var VIEW = {
-    LEFT: 'left',
-    RIGHT: 'right'
-};
-
-var OWNERS = [
-    { name: 'cloudron', value: 1000 },
-    { name: 'www-data', value: 33 },
-    { name: 'git', value: 1001 },
-    { name: 'root', value: 0 }
-];
-
-app.controller('FileManagerController', ['$scope', '$translate', '$timeout', 'Client', function ($scope, $translate, $timeout, Client) {
-    var search = decodeURIComponent(window.location.search).slice(1).split('&').map(function (item) { return item.split('='); }).reduce(function (o, k) { o[k[0]] = k[1]; return o; }, {});
-
-    // expose enums
-    $scope.VIEW = VIEW;
-    $scope.OWNERS = OWNERS;
-
-    $scope.initialized = false;
-    $scope.status = null;
-    $scope.client = Client;
-    $scope.title = '';
-    $scope.backendId = search.id;
-    $scope.backendType = search.type;
-    $scope.volumes = [];
-    $scope.splitView = !!window.localStorage.splitView;
-    $scope.activeView = VIEW.LEFT;
-    $scope.viewerOpen = false;
-
-    $scope.clipboard = [];  // holds cut or copied entries
-    $scope.clipboardCut = false; // if action is cut or copy
-
-
-    // add a hook for children to refresh both tree views
-
-    $scope.children = [];
-    $scope.registerChild = function (child) { $scope.children.push(child); };
-    $scope.refresh = function () {
-        $scope.children.forEach(function (child) {
-            child.onRefresh();
-        });
-    };
-
-    function collectFiles(entry, callback) {
-        var pathFrom = entry.pathFrom;
-
-        if (entry.isDirectory) {
-            Client.filesGet($scope.backendId, $scope.backendType, entry.fullFilePath, 'data', function (error, result) {
-                if (error) return callback(error);
-                if (!result.entries) return callback(new Error('not a folder'));
-
-                // amend fullFilePath
-                result.entries.forEach(function (e) {
-                    e.fullFilePath = sanitize(entry.fullFilePath + '/' + e.fileName);
-                    e.pathFrom = pathFrom; // we stash the original path for pasting
-                });
-
-                var collectedFiles = [];
-                async.eachLimit(result.entries, 5, function (entry, callback) {
-                    collectFiles(entry, function (error, result) {
-                        if (error) return callback(error);
-
-                        collectedFiles = collectedFiles.concat(result);
-
-                        callback();
-                    });
-                }, function (error) {
-                    if (error) return callback(error);
-
-                    callback(null, collectedFiles);
-                });
-            });
-            return;
-        }
-
-        callback(null, [ entry ]);
-    }
-
-    // entries need to be an actual copy
-    $scope.actionCut = function (cwd, entries) {
-        $scope.clipboard = entries; //$scope.selected.slice();
-        $scope.clipboard.forEach(function (entry) {
-            entry.fullFilePath = sanitize(cwd + '/' + entry.fileName);
-        });
-        $scope.clipboardCut = true;
-    };
-
-    // entries need to be an actual copy
-    $scope.actionCopy = function (cwd, entries) {
-        $scope.clipboard = entries; //$scope.selected.slice();
-        $scope.clipboard.forEach(function (entry) {
-            entry.fullFilePath = sanitize(cwd + '/' + entry.fileName);
-            entry.pathFrom = cwd; // we stash the original path for pasting
-        });
-        $scope.clipboardCut = false;
-    };
-
-    $scope.actionPaste = function (cwd, destinationEntry) {
-        if ($scope.clipboardCut) {
-            // move files
-            async.eachLimit($scope.clipboard, 5, function (entry, callback) {
-                var newFilePath = sanitize(cwd + '/' + ((destinationEntry && destinationEntry.isDirectory) ? destinationEntry.fileName : '') + '/' + entry.fileName);
-
-                // TODO this will overwrite files in destination!
-                Client.filesRename($scope.backendId, $scope.backendType, entry.fullFilePath, newFilePath, callback);
-            }, function (error) {
-                if (error) return Client.error(error);
-
-                // clear clipboard
-                $scope.clipboard = [];
-
-                $scope.refresh();
-            });
-        } else {
-            // copy files
-
-            // first collect all files recursively
-            var collectedFiles = [];
-
-            async.eachLimit($scope.clipboard, 5, function (entry, callback) {
-                collectFiles(entry, function (error, result) {
-                    if (error) return callback(error);
-
-                    collectedFiles = collectedFiles.concat(result);
-
-                    callback();
-                });
-            }, function (error) {
-                if (error) return Client.error(error);
-
-                async.eachLimit(collectedFiles, 5, function (entry, callback) {
-                    var newFilePath = sanitize(cwd + '/' + ((destinationEntry && destinationEntry.isDirectory) ? destinationEntry.fileName : '') + '/' + entry.fullFilePath.slice(entry.pathFrom.length));
-
-                    // This will NOT overwrite but finds a unique new name to copy to
-                    // we prefix with a / to ensure we don't do relative target paths
-                    Client.filesCopy($scope.backendId, $scope.backendType, entry.fullFilePath, '/' + newFilePath, callback);
-                }, function (error) {
-                    if (error) return Client.error(error);
-
-                    // clear clipboard
-                    $scope.clipboard = [];
-
-                    $scope.refresh();
-                });
-            });
-        }
-    };
-
-    // handle uploads
-
-    $scope.uploadStatus = {
-        error: null,
-        busy: false,
-        fileName: '',
-        count: 0,
-        countDone: 0,
-        size: 0,
-        done: 0,
-        percentDone: 0,
-        files: [],
-        targetFolder: ''
-    };
-
-    $scope.uploadFiles = function (files, targetFolder, overwrite) {
-        if (!files || !files.length) return;
-
-        overwrite = !!overwrite;
-
-        // prevent it from getting closed
-        $('#uploadModal').modal({
-            backdrop: 'static',
-            keyboard: false
-        });
-
-        $scope.uploadStatus.files = files;
-        $scope.uploadStatus.targetFolder = targetFolder;
-        $scope.uploadStatus.error = null;
-        $scope.uploadStatus.busy = true;
-        $scope.uploadStatus.count = files.length;
-        $scope.uploadStatus.countDone = 0;
-        $scope.uploadStatus.size = 0;
-        $scope.uploadStatus.sizeDone = 0;
-        $scope.uploadStatus.done = 0;
-        $scope.uploadStatus.percentDone = 0;
-
-        for (var i = 0; i < files.length; ++i) {
-            $scope.uploadStatus.size += files[i].size;
-        }
-
-        async.eachSeries(files, function (file, callback) {
-            var filePath = sanitize(targetFolder + '/' + (file.webkitRelativePath || file.name));
-
-            $scope.uploadStatus.fileName = file.name;
-
-            Client.filesUpload($scope.backendId, $scope.backendType, filePath, file, overwrite, function (loaded) {
-                $scope.uploadStatus.percentDone = ($scope.uploadStatus.done+loaded) * 100 / $scope.uploadStatus.size;
-                $scope.uploadStatus.sizeDone = loaded;
-            }, function (error) {
-                if (error) return callback(error);
-
-                $scope.uploadStatus.done += file.size;
-                $scope.uploadStatus.percentDone = $scope.uploadStatus.done * 100 / $scope.uploadStatus.size;
-                $scope.uploadStatus.countDone++;
-
-                callback();
-            });
-        }, function (error) {
-            $scope.uploadStatus.busy = false;
-
-            if (error && error.statusCode === 409) {
-                $scope.uploadStatus.error = 'exists';
-                return;
-            } else if (error) {
-                console.error(error);
-                $scope.uploadStatus.error = 'generic';
-                return;
-            }
-
-            $('#uploadModal').modal('hide');
-
-            $scope.uploadStatus.fileName = '';
-            $scope.uploadStatus.count = 0;
-            $scope.uploadStatus.size = 0;
-            $scope.uploadStatus.sizeDone = 0;
-            $scope.uploadStatus.done = 0;
-            $scope.uploadStatus.percentDone = 100;
-            $scope.uploadStatus.files = [];
-            $scope.uploadStatus.targetFolder = '';
-
-            $scope.refresh();
-        });
-    };
-
-    $scope.retryUpload = function (overwrite) {
-        $scope.uploadFiles($scope.uploadStatus.files, $scope.uploadStatus.targetFolder, !!overwrite);
-    };
-
-
-    // file and folder upload hooks, stashing $scope.uploadCwd for now
-
-    $scope.uploadCwd = '';
-    $('#uploadFileInput').on('change', function (e ) {
-        $scope.uploadFiles(e.target.files || [], $scope.uploadCwd, false);
-    });
-    $scope.onUploadFile = function (cwd) {
-        $scope.uploadCwd = cwd;
-        $('#uploadFileInput').click();
-    };
-
-    $('#uploadFolderInput').on('change', function (e ) {
-        $scope.uploadFiles(e.target.files || [], $scope.uploadCwd, false);
-    });
-    $scope.onUploadFolder = function (cwd) {
-        $scope.uploadCwd = cwd;
-        $('#uploadFolderInput').click();
-    };
-
-
-    // handle delete
-
-    $scope.deleteEntries = {
-        busy: false,
-        error: null,
-        cwd: '',
-        entries: [],
-
-        show: function (cwd, entries) {
-            $scope.deleteEntries.error = null;
-            $scope.deleteEntries.cwd = cwd;
-            $scope.deleteEntries.entries = entries;
-
-            $('#entriesDeleteModal').modal('show');
-        },
-
-        submit: function () {
-            $scope.deleteEntries.busy = true;
-
-            async.eachLimit($scope.deleteEntries.entries, 5, function (entry, callback) {
-                var filePath = sanitize($scope.deleteEntries.cwd + '/' + entry.fileName);
-
-                Client.filesRemove($scope.backendId, $scope.backendType, filePath, callback);
-            }, function (error) {
-                $scope.deleteEntries.busy = false;
-                if (error) return Client.error(error);
-
-                $scope.refresh();
-
-                $('#entriesDeleteModal').modal('hide');
-            });
-
-        }
-    };
-
-    // rename entry
-
-    $scope.renameEntry = {
-        busy: false,
-        error: null,
-        entry: null,
-        cwd: '',
-        newName: '',
-
-        show: function (cwd, entry) {
-            $scope.renameEntry.error = null;
-            $scope.renameEntry.cwd = cwd;
-            $scope.renameEntry.entry = entry;
-            $scope.renameEntry.newName = entry.fileName;
-            $scope.renameEntry.busy = false;
-
-            $('#renameEntryModal').modal('show');
-        },
-
-        submit: function () {
-            $scope.renameEntry.busy = true;
-
-            var oldFilePath = sanitize($scope.renameEntry.cwd + '/' + $scope.renameEntry.entry.fileName);
-            var newFilePath = sanitize(($scope.renameEntry.newName[0] === '/' ? '' : ($scope.renameEntry.cwd + '/')) + $scope.renameEntry.newName);
-
-            Client.filesRename($scope.backendId, $scope.backendType, oldFilePath, newFilePath, function (error) {
-                $scope.renameEntry.busy = false;
-                if (error) return Client.error(error);
-
-                $scope.refresh();
-
-                $('#renameEntryModal').modal('hide');
-            });
-        }
-    };
-
-
-    // chown entries
-
-    $scope.chownEntries = {
-        busy: false,
-        error: null,
-        entries: [],
-        newOwner: 0,
-        recursive: false,
-        showRecursiveOption: false,
-
-        show: function (cwd, entries) {
-            $scope.chownEntries.error = null;
-            $scope.chownEntries.cwd = cwd;
-            $scope.chownEntries.entries = entries;
-            // set default uid from first file
-            $scope.chownEntries.newOwner = entries[0].uid;
-            $scope.chownEntries.busy = false;
-
-            // default for directories is recursive
-            $scope.chownEntries.recursive = !!entries.find(function (entry) { return entry.isDirectory; });
-            $scope.chownEntries.showRecursiveOption = false;
-
-            $('#chownEntriesModal').modal('show');
-        },
-
-        submit: function () {
-            $scope.chownEntries.busy = true;
-
-            async.eachLimit($scope.chownEntries.entries, 5, function (entry, callback) {
-                var filePath = sanitize($scope.chownEntries.cwd + '/' + entry.fileName);
-
-                Client.filesChown($scope.backendId, $scope.backendType, filePath, $scope.chownEntries.newOwner, $scope.chownEntries.recursive, callback);
-            }, function (error) {
-                $scope.chownEntries.busy = false;
-                if (error) return Client.error(error);
-
-                $scope.refresh();
-
-                $('#chownEntriesModal').modal('hide');
-            });
-        }
-    };
-
-
-    // new file
-
-    $scope.newFile = {
-        busy: false,
-        error: null,
-        cwd: '',
-        name: '',
-
-        show: function (cwd) {
-            $scope.newFile.error = null;
-            $scope.newFile.name = '';
-            $scope.newFile.busy = false;
-            $scope.newFile.cwd = cwd;
-
-            $scope.newFileForm.$setUntouched();
-            $scope.newFileForm.$setPristine();
-
-            $('#newFileModal').modal('show');
-        },
-
-        submit: function () {
-            $scope.newFile.busy = true;
-            $scope.newFile.error = null;
-
-            var filePath = sanitize($scope.newFile.cwd + '/' + $scope.newFile.name);
-
-            Client.filesUpload($scope.backendId, $scope.backendType, filePath, new File([], $scope.newFile.name), false, function () {}, function (error) {
-                $scope.newFile.busy = false;
-                if (error && error.statusCode === 409) return $scope.newFile.error = 'exists';
-                if (error) return Client.error(error);
-
-                $scope.refresh();
-
-                $('#newFileModal').modal('hide');
-            });
-        }
-    };
-
-
-    // new folder
-
-    $scope.newFolder = {
-        busy: false,
-        error: null,
-        cwd: '',
-        name: '',
-
-        show: function (cwd) {
-            $scope.newFolder.error = null;
-            $scope.newFolder.name = '';
-            $scope.newFolder.busy = false;
-            $scope.newFolder.cwd = cwd;
-
-            $scope.newFolderForm.$setUntouched();
-            $scope.newFolderForm.$setPristine();
-
-            $('#newFolderModal').modal('show');
-        },
-
-        submit: function () {
-            $scope.newFolder.busy = true;
-            $scope.newFolder.error = null;
-
-            var filePath = sanitize($scope.newFolder.cwd + '/' + $scope.newFolder.name);
-
-            Client.filesCreateDirectory($scope.backendId, $scope.backendType, filePath, function (error) {
-                $scope.newFolder.busy = false;
-                if (error && error.statusCode === 409) return $scope.newFolder.error = 'exists';
-                if (error) return Client.error(error);
-
-                $scope.refresh();
-
-                $('#newFolderModal').modal('hide');
-            });
-        }
-    };
-
-
-    // extract archives
-
-    $scope.extractStatus = {
-        error: null,
-        busy: false,
-        fileName: ''
-    };
-
-    $scope.extractEntry = function (cwd, entry) {
-        var filePath = sanitize(cwd + '/' + entry.fileName);
-
-        if (entry.isDirectory) return;
-
-        // prevent it from getting closed
-        $('#extractModal').modal({
-            backdrop: 'static',
-            keyboard: false
-        });
-
-        $scope.extractStatus.fileName = entry.fileName;
-        $scope.extractStatus.error = null;
-        $scope.extractStatus.busy = true;
-
-        Client.filesExtract($scope.backendId, $scope.backendType, filePath, function (error) {
-            $scope.extractStatus.busy = false;
-
-            if (error) {
-                console.error(error);
-                $scope.extractStatus.error = $translate.instant('filemanager.extract.error', error.message);
-                return;
-            }
-
-            $('#extractModal').modal('hide');
-
-            $scope.refresh();
-        });
-    };
-
-
-    // split view handling
-
-    $scope.toggleSplitView = function () {
-        $scope.splitView = !$scope.splitView;
-        if (!$scope.splitView) {
-            $scope.activeView = VIEW.LEFT;
-            delete window.localStorage.splitView;
-        } else {
-            window.localStorage.splitView = true;
-        }
-    };
-
-    $scope.setActiveView = function (view) {
-        $scope.activeView = view;
-    };
-
-
-    // monaco text editor
-
-    var LANGUAGES = [];
-    require(['vs/editor/editor.main'], function() { LANGUAGES = monaco.languages.getLanguages(); });
-
-    function getLanguage(filename) {
-        var ext = '.' + filename.split('.').pop();
-        var language = LANGUAGES.find(function (l) {
-            if (!l.extensions) return false;
-            return !!l.extensions.find(function (e) { return e === ext; });
-        }) || '';
-        return language ? language.id : '';
-    }
-
-    $scope.textEditor = {
-        busy: false,
-        cwd: null,
-        entry: null,
-        editor: null,
-        unsaved: false,
-        visible: false,
-
-        show: function (cwd, entry) {
-            $scope.textEditor.cwd = cwd;
-            $scope.textEditor.entry = entry;
-            $scope.textEditor.busy = false;
-            $scope.textEditor.unsaved = false;
-            $scope.textEditor.visible = true;
-
-            // clear model if any
-            if ($scope.textEditor.editor && $scope.textEditor.editor.getModel()) $scope.textEditor.editor.setModel(null);
-
-            $scope.viewerOpen = true;
-            // document.getElementById('textEditorModal').style['display'] = 'flex';
-
-            var filePath = sanitize($scope.textEditor.cwd + '/' + entry.fileName);
-            var language = getLanguage(entry.fileName);
-
-            Client.filesGet($scope.backendId, $scope.backendType, filePath, 'data', function (error, result) {
-                if (error) return Client.error(error);
-
-                if (!$scope.textEditor.editor) {
-                    $timeout(function () {
-                        $scope.textEditor.editor = monaco.editor.create(document.getElementById('textEditorContainer'), {
-                            value: result,
-                            language: language,
-                            theme: 'vs-dark'
-                        });
-                        $scope.textEditor.editor.getModel().onDidChangeContent(function () { $scope.textEditor.unsaved = true; });
-                    }, 200);
-                } else {
-                    $scope.textEditor.editor.setModel(monaco.editor.createModel(result, language));
-                    $scope.textEditor.editor.getModel().onDidChangeContent(function () { $scope.textEditor.unsaved = true; }); // have to re-attach whenever model changes
-                }
-            });
-        },
-
-        save: function (callback) {
-            $scope.textEditor.busy = true;
-
-            var newContent = $scope.textEditor.editor.getValue();
-            var filePath = sanitize($scope.textEditor.cwd + '/' + $scope.textEditor.entry.fileName);
-            var file = new File([newContent], 'file');
-
-            Client.filesUpload($scope.backendId, $scope.backendType, filePath, file, true, function () {}, function (error) {
-                if (error) return Client.error(error);
-
-                $scope.refresh();
-
-                $timeout(function () {
-                    $scope.textEditor.unsaved = false;
-                    $scope.textEditor.busy = false;
-                    if (typeof callback === 'function') return callback();
-                }, 1000);
-            });
-        },
-
-        close: function () {
-            $scope.textEditor.visible = false;
-            $scope.viewerOpen = false;
-            $('#textEditorCloseModal').modal('hide');
-        },
-
-        onClose: function () {
-            $scope.textEditor.visible = false;
-            $scope.viewerOpen = false;
-            $('#textEditorCloseModal').modal('hide');
-        },
-
-        saveAndClose: function () {
-            $scope.textEditor.save(function () {
-                $scope.textEditor.onClose();
-            });
-        },
-
-        maybeClose: function () {
-            if (!$scope.textEditor.unsaved) return $scope.textEditor.onClose();
-            $('#textEditorCloseModal').modal('show');
-        },
-    };
-
-
-    // restart app or mail logic
-
-    $scope.restartBusy = false;
-
-    $scope.onRestartApp = function () {
-        $scope.restartBusy = true;
-
-        function waitUntilRestarted(callback) {
-            Client.getApp($scope.backendId, function (error, result) {
-                if (error) return callback(error);
-
-                if (result.installationState === ISTATES.INSTALLED) return callback();
-                setTimeout(waitUntilRestarted.bind(null, callback), 2000);
-            });
-        }
-
-        Client.restartApp($scope.backendId, function (error) {
-            if (error) console.error('Failed to restart app.', error);
-
-            waitUntilRestarted(function (error) {
-                if (error) console.error('Failed wait for restart.', error);
-
-                $scope.restartBusy = false;
-            });
-        });
-    };
-
-    $scope.onRestartMail = function () {
-        $scope.restartBusy = true;
-
-        function waitUntilRestarted(callback) {
-            Client.getService('mail', function (error, result) {
-                if (error) return callback(error);
-
-                if (result.status === 'active') return callback();
-                setTimeout(waitUntilRestarted.bind(null, callback), 2000);
-            });
-        }
-
-        Client.restartService('mail', function (error) {
-            if (error) console.error('Failed to restart mail.', error);
-
-            waitUntilRestarted(function (error) {
-                if (error) console.error('Failed wait for restart.', error);
-
-                $scope.restartBusy = false;
-            });
-        });
-    };
-
-    // init code
-
-    function fetchVolumesInfo(mounts) {
-        $scope.volumes = [];
-
-        async.each(mounts, function (mount, callback) {
-            Client.getVolume(mount.volumeId, function (error, result) {
-                if (error) return callback(error);
-
-                $scope.volumes.push(result);
-
-                callback();
-            });
-        }, function (error) {
-            if (error) console.error('Failed to fetch volumes info.', error);
-        });
-    }
-
-    function init() {
-
-        Client.getStatus(function (error, status) {
-            if (error) return Client.initError(error, init);
-
-            if (!status.activated) {
-                console.log('Not activated yet, redirecting', status);
-                window.location.href = '/';
-                return;
-            }
-
-            // check version and force reload if needed
-            if (!localStorage.version) {
-                localStorage.version = status.version;
-            } else if (localStorage.version !== status.version) {
-                localStorage.version = status.version;
-                window.location.reload(true);
-            }
-
-            $scope.status = status;
-
-            console.log('Running filemanager version ', localStorage.version);
-
-            // get user profile as the first thing. this populates the "scope" and affects subsequent API calls
-            Client.refreshUserInfo(function (error) {
-                if (error) return Client.initError(error, init);
-
-                var getter;
-                if ($scope.backendType === 'app') {
-                    getter = Client.getApp.bind(Client, $scope.backendId);
-                } else if ($scope.backendType === 'volume') {
-                    getter = Client.getVolume.bind(Client, $scope.backendId);
-                } else if ($scope.backendType === 'mail') {
-                    getter = function (next) { next(null, null); };
-                }
-
-                getter(function (error, result) {
-                    if (error) {
-                        $scope.initialized = true;
-                        return;
-                    }
-
-                    // fine to do async
-                    if ($scope.backendType === 'app') fetchVolumesInfo(result.mounts || []);
-
-                    switch ($scope.backendType) {
-                    case 'app':
-                        $scope.title = result.label || result.fqdn;
-                        $scope.rootDirLabel = '/app/data/';
-                        $scope.applicationLink = 'https://' + result.fqdn;
-                        break;
-                    case 'volume':
-                        $scope.title = result.name;
-                        $scope.rootDirLabel = result.hostPath;
-                        break;
-                    case 'mail':
-                        $scope.title = 'mail';
-                        $scope.rootDirLabel = 'mail';
-                        break;
-                    }
-
-                    window.document.title = $scope.title + ' - ' + $translate.instant('filemanager.title');
-
-                    // now mark the Client to be ready
-                    Client.setReady();
-
-                    // openPath('');
-
-                    $scope.initialized = true;
-                });
-            });
-        });
-    }
-
-    init();
-
-
-    // toplevel key input handling
-
-    window.addEventListener('keydown', function (event) {
-        if((navigator.platform.match('Mac') ? event.metaKey : event.ctrlKey) && event.key === 's') {
-            if (!$scope.textEditor.visible) return;
-
-            event.preventDefault();
-            $scope.$apply($scope.textEditor.save);
-        } else if((navigator.platform.match('Mac') ? event.metaKey : event.ctrlKey) && event.key === 'c') {
-            if ($scope.textEditor.visible) return;
-            if ($scope.selected.length === 0) return;
-            if (isModalVisible()) return;
-
-            event.preventDefault();
-            $scope.$apply($scope.actionCopy);
-        } else if((navigator.platform.match('Mac') ? event.metaKey : event.ctrlKey) && event.key === 'x') {
-            if ($scope.textEditor.visible) return;
-            if ($scope.selected.length === 0) return;
-            if (isModalVisible()) return;
-
-            event.preventDefault();
-            $scope.$apply($scope.actionCut);
-        } else if((navigator.platform.match('Mac') ? event.metaKey : event.ctrlKey) && event.key === 'v') {
-            if ($scope.textEditor.visible) return;
-            if ($scope.clipboard.length === 0) return;
-            if (isModalVisible()) return;
-
-            event.preventDefault();
-            $scope.$apply($scope.actionPaste);
-        } else if((navigator.platform.match('Mac') ? event.metaKey : event.ctrlKey) && event.key === 'a') {
-            if ($scope.textEditor.visible) return;
-            if (isModalVisible()) return;
-
-            event.preventDefault();
-            $scope.$apply($scope.actionSelectAll);
-        } else if(event.key === 'Escape') {
-            if ($scope.textEditor.visible) return $scope.$apply($scope.textEditor.maybeClose);
-            else $scope.$apply(function () { $scope.selected = []; });
-        }
-    });
-
-
-    // setup all the dialog focus handling
-    ['newFileModal', 'newFolderModal', 'renameEntryModal'].forEach(function (id) {
-        $('#' + id).on('shown.bs.modal', function () {
-            $(this).find('[autofocus]:first').focus();
-        });
-    });
-
-    // selects filename (without extension)
-    ['renameEntryModal'].forEach(function (id) {
-        $('#' + id).on('shown.bs.modal', function () {
-            var elem = $(this).find('[autofocus]:first');
-            var text = elem.val();
-            elem[0].setSelectionRange(0, text.indexOf('.'));
-        });
-    });
-}]);

dashboard/src/js/index.js

@@ -50,6 +50,9 @@ app.config(['$routeProvider', function ($routeProvider) {
     }).when('/users', {
         controller: 'UsersController',
         templateUrl: 'views/users.html?<%= revision %>'
+    }).when('/usersettings', {
+        controller: 'UserSettingsController',
+        templateUrl: 'views/user-settings.html?<%= revision %>'
     }).when('/app/:appId/:view?', {
         controller: 'AppController',
         templateUrl: 'views/app.html?<%= revision %>'
@@ -93,8 +96,7 @@ app.config(['$routeProvider', function ($routeProvider) {
         controller: 'NotificationsController',
         templateUrl: 'views/notifications.html?<%= revision %>'
     }).when('/oidc', {
-        controller: 'OidcController',
-        templateUrl: 'views/oidc.html?<%= revision %>'
+        redirectTo: '/usersettings'
     }).when('/settings', {
         controller: 'SettingsController',
         templateUrl: 'views/settings.html?<%= revision %>'
@@ -297,6 +299,7 @@ app.filter('installationStateLabel', function () {
         case ISTATES.PENDING_LOCATION_CHANGE:
         case ISTATES.PENDING_CONFIGURE:
         case ISTATES.PENDING_RECREATE_CONTAINER:
+        case ISTATES.PENDING_SERVICES_CHANGE:
         case ISTATES.PENDING_DEBUG:
             return 'Configuring' + waiting;
         case ISTATES.PENDING_RESIZE:
@@ -607,3 +610,219 @@ app.config(['fitTextConfigProvider', function (fitTextConfigProvider) {
         max: 24
     };
 }]);
+
+app.controller('MainController', ['$scope', '$route', '$timeout', '$location', '$interval', 'Notification', 'Client', function ($scope, $route, $timeout, $location, $interval, Notification, Client) {
+    $scope.initialized = false; // used to animate the UI
+    $scope.user = Client.getUserInfo();
+    $scope.installedApps = Client.getInstalledApps();
+    $scope.config = {};
+    $scope.client = Client;
+    $scope.subscription = {};
+    $scope.notificationCount = 0;
+    $scope.hideNavBarActions = $location.path() === '/logs';
+    $scope.backgroundImageUrl = '';
+
+    $scope.reboot = {
+        busy: false,
+
+        show: function () {
+            $scope.reboot.busy = false;
+            $('#rebootModal').modal('show');
+        },
+
+        submit: function () {
+            $scope.reboot.busy = true;
+
+            Client.reboot(function (error) {
+                if (error) return Client.error(error);
+
+                $('#rebootModal').modal('hide');
+
+                // trigger refetch to show offline banner
+                $timeout(function () { Client.getStatus(function () {}); }, 5000);
+            });
+        }
+    };
+
+    $scope.isActive = function (url) {
+        if (!$route.current) return false;
+        return $route.current.$$route.originalPath.indexOf(url) === 0;
+    };
+
+    $scope.logout = function (event) {
+        event.stopPropagation();
+        $scope.initialized = false;
+        Client.logout();
+    };
+
+    $scope.openSubscriptionSetup = function () {
+        Client.openSubscriptionSetup($scope.subscription);
+    };
+
+    // NOTE: this function is exported and called from the appstore.js
+    $scope.updateSubscriptionStatus = function () {
+        Client.getSubscription(function (error, subscription) {
+            if (error && error.statusCode === 412) return; // not yet registered
+            if (error && error.statusCode === 402) return; // invalid appstore token
+            if (error) return console.error(error);
+
+            $scope.subscription = subscription;
+        });
+    };
+
+    function refreshNotifications() {
+        if (!Client.getUserInfo().isAtLeastAdmin) return;
+
+        Client.getNotifications({ acknowledged: false }, 1, 100, function (error, results) { // counter maxes out at 100
+            if (error) console.error(error);
+            else $scope.notificationCount = results.length;
+        });
+    }
+
+    // update state of acknowledged notification
+    $scope.notificationAcknowledged = function () {
+        refreshNotifications();
+    };
+
+    function redirectOnMandatory2FA() {
+        if (Client.getConfig().mandatory2FA && !Client.getUserInfo().twoFactorAuthenticationEnabled) {
+            $location.path('/profile').search({ setup2fa: true });
+        }
+    }
+
+    // Make it redirect if the browser URL is changed directly - https://forum.cloudron.io/topic/7510/bug-in-2fa-force
+    $scope.$on('$routeChangeStart', function (/* event */) {
+        if ($scope.initialized) redirectOnMandatory2FA();
+    });
+
+    var gPlatformStatusNotification = null;
+    function trackPlatformStatus() {
+        Client.getPlatformStatus(function (error, result) {
+            if (error) return console.error('Failed to get platform status.', error);
+
+            // see box/src/platform.js
+            if (result.message === 'Ready') {
+                if (gPlatformStatusNotification) {
+                    gPlatformStatusNotification.kill();
+                    gPlatformStatusNotification = null;
+                }
+
+                return;
+            }
+
+            if (!gPlatformStatusNotification) {
+                var options = { title: 'Platform status', message: result.message, delay: 'notimeout', replaceMessage: true, closeOnClick: false };
+
+                Notification.primary(options).then(function (result) {
+                    gPlatformStatusNotification = result;
+                    $timeout(trackPlatformStatus, 5000);
+                });
+            } else {
+                gPlatformStatusNotification.message = result.message;
+                $timeout(trackPlatformStatus, 5000);
+            }
+        });
+    }
+
+    function redirectIfNeeded(status) {
+        if (!status.activated) {
+            console.log('Not activated yet, redirecting', status);
+            if (status.restore.active || status.restore.errorMessage) { // show the error message in restore page
+                window.location.href = '/restore.html' + window.location.search;
+            } else if (status.adminFqdn) {
+                window.location.href = 'https://' + status.adminFqdn + '/setup.html' + (window.location.search);
+            } else {
+                window.location.href = '/setupdns.html' + window.location.search;
+            }
+            return true;
+        }
+
+        // support local development with localhost check
+        if (window.location.hostname !== status.adminFqdn && window.location.hostname !== 'localhost' && !window.location.hostname.startsWith('192.')) {
+            // user is accessing by IP or by the old admin location (pre-migration)
+            window.location.href = '/setupdns.html' + window.location.search;
+            return true;
+        }
+
+        return false;
+    }
+
+    // this loads the very first thing when accessing via IP or domain
+    function init() {
+        Client.getProvisionStatus(function (error, status) {
+            if (error) return Client.initError(error, init);
+
+            if (redirectIfNeeded(status)) return;
+
+            // check version and force reload if needed
+            if (!localStorage.version) {
+                localStorage.version = status.version;
+            } else if (localStorage.version !== status.version) {
+                localStorage.version = status.version;
+                window.location.reload(true);
+            }
+
+            console.log('Running dashboard version ', localStorage.version);
+
+            // get user profile as the first thing. this populates the "scope" and affects subsequent API calls
+            Client.refreshUserInfo(function (error) {
+                if (error) return Client.initError(error, init);
+
+                Client.refreshConfig(function (error) {
+                    if (error) return Client.initError(error, init);
+
+                    Client.refreshAvailableLanguages(function (error) {
+                        if (error) return Client.initError(error, init);
+
+                        Client.refreshInstalledApps(function (error) {
+                            if (error) return Client.initError(error, init);
+
+                            // now mark the Client to be ready
+                            Client.setReady();
+
+                            $scope.config = Client.getConfig();
+
+                            if (Client.getUserInfo().hasBackgroundImage) {
+                                document.getElementById('mainContentContainer').style.backgroundImage = 'url("' + Client.getBackgroundImageUrl() + '")';
+                                document.getElementById('mainContentContainer').classList.add('has-background');
+                            }
+
+                            $scope.initialized = true;
+
+                            redirectOnMandatory2FA();
+
+                            $interval(refreshNotifications, 60 * 1000);
+                            refreshNotifications();
+
+                            Client.getSubscription(function (error, subscription) {
+                                if (error && error.statusCode === 412) return; // not yet registered
+                                if (error && error.statusCode === 402) return; // invalid appstore token
+                                if (error) return console.error(error);
+
+                                $scope.subscription = subscription;
+
+                                // only track platform status if we are registered
+                                trackPlatformStatus();
+                            });
+                        });
+                    });
+                });
+            });
+        });
+    }
+
+    Client.onConfig(function (config) {
+        if (config.cloudronName) {
+            document.title = config.cloudronName;
+        }
+    });
+
+    init();
+
+    // setup all the dialog focus handling
+    ['updateModal'].forEach(function (id) {
+        $('#' + id).on('shown.bs.modal', function () {
+            $(this).find('[autofocus]:first').focus();
+        });
+    });
+}]);

dashboard/src/js/logs.js

@@ -1,202 +0,0 @@
-'use strict';
-
-/* global angular */
-/* global moment */
-/* global $ */
-
-// create main application module
-var app = angular.module('Application', ['pascalprecht.translate', 'ngCookies', 'angular-md5', 'ui-notification']);
-
-app.controller('LogsController', ['$scope', '$translate', 'Client', function ($scope, $translate, Client) {
-    var search = decodeURIComponent(window.location.search).slice(1).split('&').map(function (item) { return item.split('='); }).reduce(function (o, k) { o[k[0]] = k[1]; return o; }, {});
-
-    $scope.initialized = false;
-    $scope.client = Client;
-    $scope.selected = '';
-    $scope.activeEventSource = null;
-    $scope.lines = 100;
-    $scope.selectedAppInfo = null;
-    $scope.selectedTaskInfo = null;
-
-    function ab2str(buf) {
-        return String.fromCharCode.apply(null, new Uint16Array(buf));
-    }
-
-    $scope.clear = function () {
-        var logViewer = $('.logs-container');
-        logViewer.empty();
-    };
-
-    // https://github.com/janl/mustache.js/blob/master/mustache.js#L60
-    var entityMap = {
-        '&': '&',
-        '<': '&lt;',
-        '>': '&gt;',
-        '"': '&quot;',
-        "'": '&#39;',
-        '/': '&#x2F;',
-        '`': '&#x60;',
-        '=': '&#x3D;'
-    };
-
-    function escapeHtml(string) {
-        return String(string).replace(/[&<>"'`=\/]/g, function fromEntityMap (s) {
-            return entityMap[s];
-        });
-    }
-
-    function showLogs() {
-        if (!$scope.selected) return;
-
-        var func;
-        if ($scope.selected.type === 'platform') func = Client.getPlatformLogs;
-        else if ($scope.selected.type === 'service') func = Client.getServiceLogs;
-        else if ($scope.selected.type === 'task') func = Client.getTaskLogs;
-        else if ($scope.selected.type === 'app') func = Client.getAppLogs;
-
-        func($scope.selected.value, true /* follow */, $scope.lines, function handleLogs(error, result) {
-            if (error) return console.error(error);
-
-            $scope.activeEventSource = result;
-            result.onmessage = function handleMessage(message) {
-                var data;
-
-                try {
-                    data = JSON.parse(message.data);
-                } catch (e) {
-                    return console.error(e);
-                }
-
-                // check if we want to auto scroll (this is before the appending, as that skews the check)
-                var tmp = $('.logs-container');
-                var autoScroll = tmp[0].scrollTop > (tmp[0].scrollHeight - tmp.innerHeight() - 24);
-
-                var logLine = $('<div class="log-line">');
-                // realtimeTimestamp is 0 if line is blank or some parse error
-                var timeString = data.realtimeTimestamp ? moment(data.realtimeTimestamp/1000).format('MMM DD HH:mm:ss') : '';
-                logLine.html('<span class="time">' + timeString + ' </span>' + window.ansiToHTML(escapeHtml(typeof data.message === 'string' ? data.message : ab2str(data.message))));
-                tmp.append(logLine);
-
-                if (autoScroll) tmp[0].lastChild.scrollIntoView({ behavior: 'instant', block: 'end' });
-            };
-        });
-    }
-
-    function select(ids, callback) {
-        if (ids.id && ids.id.indexOf('redis:') === 0) {
-            $scope.selected = {
-                name: 'Redis',
-                type: 'service',
-                value: ids.id,
-                url: Client.makeURL('/api/v1/services/' + ids.id + '/logs')
-            };
-            callback();
-        } else if (ids.id) {
-            var BUILT_IN_LOGS = [
-                { name: 'Box', type: 'platform', value: 'box', url: Client.makeURL('/api/v1/cloudron/logs/box') },
-                { name: 'Graphite', type: 'service', value: 'graphite', url: Client.makeURL('/api/v1/services/graphite/logs') },
-                { name: 'MongoDB', type: 'service', value: 'mongodb', url: Client.makeURL('/api/v1/services/mongodb/logs') },
-                { name: 'MySQL', type: 'service', value: 'mysql', url: Client.makeURL('/api/v1/services/mysql/logs') },
-                { name: 'PostgreSQL', type: 'service', value: 'postgresql', url: Client.makeURL('/api/v1/services/postgresql/logs') },
-                { name: 'Mail', type: 'service', value: 'mail', url: Client.makeURL('/api/v1/services/mail/logs') },
-                { name: 'Docker', type: 'service', value: 'docker', url: Client.makeURL('/api/v1/services/docker/logs') },
-                { name: 'Nginx', type: 'service', value: 'nginx', url: Client.makeURL('/api/v1/services/nginx/logs') },
-                { name: 'Unbound', type: 'service', value: 'unbound', url: Client.makeURL('/api/v1/services/unbound/logs') },
-                { name: 'SFTP', type: 'service', value: 'sftp', url: Client.makeURL('/api/v1/services/sftp/logs') },
-                { name: 'TURN/STUN', type: 'service', value: 'turn', url: Client.makeURL('/api/v1/services/turn/logs') },
-            ];
-
-            $scope.selected = BUILT_IN_LOGS.find(function (e) { return e.value === ids.id; });
-            callback();
-        } else if (ids.crashId) {
-            $scope.selected = {
-                type: 'platform',
-                value: 'crash-' + ids.crashId,
-                name: 'Crash',
-                url: Client.makeURL('/api/v1/cloudron/logs/crash-' + ids.crashId)
-            };
-
-            callback();
-        } else if (ids.appId) {
-            Client.getApp(ids.appId, function (error, app) {
-                if (error) return callback(error);
-
-                $scope.selectedAppInfo = app;
-
-                $scope.selected = {
-                    type: 'app',
-                    value: app.id,
-                    name: app.fqdn + ' (' + app.manifest.title + ')',
-                    url: Client.makeURL('/api/v1/apps/' + app.id + '/logs'),
-                    addons: app.manifest.addons
-                };
-
-                callback();
-            });
-        } else if (ids.taskId) {
-            Client.getTask(ids.taskId, function (error, task) {
-                if (error) return callback(error);
-
-                $scope.selectedTaskInfo = task;
-
-                $scope.selected = {
-                    type: 'task',
-                    value: task.id,
-                    name: task.type,
-                    url: Client.makeURL('/api/v1/tasks/' + task.id + '/logs')
-                };
-
-                callback();
-            });
-        }
-    }
-
-    function init() {
-
-        Client.getStatus(function (error, status) {
-            if (error) return Client.initError(error, init);
-
-            if (!status.activated) {
-                console.log('Not activated yet, redirecting', status);
-                window.location.href = '/';
-                return;
-            }
-
-            // check version and force reload if needed
-            if (!localStorage.version) {
-                localStorage.version = status.version;
-            } else if (localStorage.version !== status.version) {
-                localStorage.version = status.version;
-                window.location.reload(true);
-            }
-
-            console.log('Running log version ', localStorage.version);
-
-            // get user profile as the first thing. this populates the "scope" and affects subsequent API calls
-            Client.refreshUserInfo(function (error) {
-                if (error) return Client.initError(error, init);
-
-                Client.refreshConfig(function (error) {
-                    if (error) return Client.initError(error, init);
-
-                    select({ id: search.id, taskId: search.taskId, appId: search.appId, crashId: search.crashId }, function (error) {
-                        if (error) return Client.initError(error, init);
-
-                        // now mark the Client to be ready
-                        Client.setReady();
-
-                        $scope.initialized = true;
-
-                        showLogs();
-                    });
-                });
-            });
-        });
-    }
-
-    init();
-
-    $translate([ 'logs.title' ]).then(function (tr) {
-        if (tr['logs.title'] !== 'logs.title') window.document.title = tr['logs.title'];
-    });
-}]);

dashboard/src/js/main.js

@@ -1,217 +0,0 @@
-'use strict';
-
-/* global angular */
-/* global $ */
-
-angular.module('Application').controller('MainController', ['$scope', '$route', '$timeout', '$location', '$interval', 'Notification', 'Client', function ($scope, $route, $timeout, $location, $interval, Notification, Client) {
-    $scope.initialized = false; // used to animate the UI
-    $scope.user = Client.getUserInfo();
-    $scope.installedApps = Client.getInstalledApps();
-    $scope.config = {};
-    $scope.client = Client;
-    $scope.subscription = {};
-    $scope.notificationCount = 0;
-    $scope.hideNavBarActions = $location.path() === '/logs';
-    $scope.backgroundImageUrl = '';
-
-    $scope.reboot = {
-        busy: false,
-
-        show: function () {
-            $scope.reboot.busy = false;
-            $('#rebootModal').modal('show');
-        },
-
-        submit: function () {
-            $scope.reboot.busy = true;
-
-            Client.reboot(function (error) {
-                if (error) return Client.error(error);
-
-                $('#rebootModal').modal('hide');
-
-                // trigger refetch to show offline banner
-                $timeout(function () { Client.getStatus(function () {}); }, 5000);
-            });
-        }
-    };
-
-    $scope.isActive = function (url) {
-        if (!$route.current) return false;
-        return $route.current.$$route.originalPath.indexOf(url) === 0;
-    };
-
-    $scope.logout = function (event) {
-        event.stopPropagation();
-        $scope.initialized = false;
-        Client.logout();
-    };
-
-    $scope.openSubscriptionSetup = function () {
-        Client.openSubscriptionSetup($scope.subscription);
-    };
-
-    // NOTE: this function is exported and called from the appstore.js
-    $scope.updateSubscriptionStatus = function () {
-        Client.getSubscription(function (error, subscription) {
-            if (error && error.statusCode === 412) return; // not yet registered
-            if (error && error.statusCode === 402) return; // invalid appstore token
-            if (error) return console.error(error);
-
-            $scope.subscription = subscription;
-        });
-    };
-
-    function refreshNotifications() {
-        if (!Client.getUserInfo().isAtLeastAdmin) return;
-
-        Client.getNotifications({ acknowledged: false }, 1, 100, function (error, results) { // counter maxes out at 100
-            if (error) console.error(error);
-            else $scope.notificationCount = results.length;
-        });
-    }
-
-    // update state of acknowledged notification
-    $scope.notificationAcknowledged = function () {
-        refreshNotifications();
-    };
-
-    function redirectOnMandatory2FA() {
-        if (Client.getConfig().mandatory2FA && !Client.getUserInfo().twoFactorAuthenticationEnabled) {
-            $location.path('/profile').search({ setup2fa: true });
-        }
-    }
-
-    // Make it redirect if the browser URL is changed directly - https://forum.cloudron.io/topic/7510/bug-in-2fa-force
-    $scope.$on('$routeChangeStart', function (/* event */) {
-        if ($scope.initialized) redirectOnMandatory2FA();
-    });
-
-    var gPlatformStatusNotification = null;
-    function trackPlatformStatus() {
-        Client.getPlatformStatus(function (error, result) {
-            if (error) return console.error('Failed to get platform status.', error);
-
-            // see box/src/platform.js
-            if (result.message === 'Ready') {
-                if (gPlatformStatusNotification) {
-                    gPlatformStatusNotification.kill();
-                    gPlatformStatusNotification = null;
-                }
-
-                return;
-            }
-
-            if (!gPlatformStatusNotification) {
-                var options = { title: 'Platform status', message: result.message, delay: 'notimeout', replaceMessage: true, closeOnClick: false };
-
-                Notification.primary(options).then(function (result) {
-                    gPlatformStatusNotification = result;
-                    $timeout(trackPlatformStatus, 5000);
-                });
-            } else {
-                gPlatformStatusNotification.message = result.message;
-                $timeout(trackPlatformStatus, 5000);
-            }
-        });
-    }
-
-    function init() {
-        Client.getStatus(function (error, status) {
-            if (error) return Client.initError(error, init);
-
-            // WARNING if anything about the routing is changed here test these use-cases:
-            //
-            // 1. Caas
-            // 3. selfhosted restore
-            // 4. local development with gulp develop
-
-            if (!status.activated) {
-                console.log('Not activated yet, redirecting', status);
-                if (status.restore.active || status.restore.errorMessage) { // show the error message in restore page
-                    window.location.href = '/restore.html' + window.location.search;
-                } else {
-                    window.location.href = (status.adminFqdn ? '/setup.html' : '/setupdns.html') + window.location.search;
-                }
-                return;
-            }
-
-            // support local development with localhost check
-            if (window.location.hostname !== status.adminFqdn && window.location.hostname !== 'localhost' && !window.location.hostname.startsWith('192.')) {
-                // user is accessing by IP or by the old admin location (pre-migration)
-                window.location.href = '/setupdns.html' + window.location.search;
-                return;
-            }
-
-            // check version and force reload if needed
-            if (!localStorage.version) {
-                localStorage.version = status.version;
-            } else if (localStorage.version !== status.version) {
-                localStorage.version = status.version;
-                window.location.reload(true);
-            }
-
-            console.log('Running dashboard version ', localStorage.version);
-
-            // get user profile as the first thing. this populates the "scope" and affects subsequent API calls
-            Client.refreshUserInfo(function (error) {
-                if (error) return Client.initError(error, init);
-
-                Client.refreshConfig(function (error) {
-                    if (error) return Client.initError(error, init);
-
-                    Client.refreshAvailableLanguages(function (error) {
-                        if (error) return Client.initError(error, init);
-
-                        Client.refreshInstalledApps(function (error) {
-                            if (error) return Client.initError(error, init);
-
-                            // now mark the Client to be ready
-                            Client.setReady();
-
-                            $scope.config = Client.getConfig();
-
-                            if (Client.getUserInfo().hasBackgroundImage) {
-                                document.getElementById('mainContentContainer').style.backgroundImage = 'url("' + Client.getBackgroundImageUrl() + '")';
-                                document.getElementById('mainContentContainer').classList.add('has-background');
-                            }
-
-                            $scope.initialized = true;
-
-                            redirectOnMandatory2FA();
-
-                            $interval(refreshNotifications, 60 * 1000);
-                            refreshNotifications();
-
-                            Client.getSubscription(function (error, subscription) {
-                                if (error && error.statusCode === 412) return; // not yet registered
-                                if (error && error.statusCode === 402) return; // invalid appstore token
-                                if (error) return console.error(error);
-
-                                $scope.subscription = subscription;
-
-                                // only track platform status if we are registered
-                                trackPlatformStatus();
-                            });
-                        });
-                    });
-                });
-            });
-        });
-    }
-
-    Client.onConfig(function (config) {
-        if (config.cloudronName) {
-            document.title = config.cloudronName;
-        }
-    });
-
-    init();
-
-    // setup all the dialog focus handling
-    ['updateModal'].forEach(function (id) {
-        $('#' + id).on('shown.bs.modal', function () {
-            $(this).find('[autofocus]:first').focus();
-        });
-    });
-}]);

dashboard/src/js/passwordreset.js

@@ -57,7 +57,7 @@ translateFilterFactory.displayName = 'translateFilterFactory';
 app.filter('tr', translateFilterFactory);
 
 
-app.controller('LoginController', ['$scope', '$translate', '$http', function ($scope, $translate, $http) {
+app.controller('PasswordResetController', ['$scope', '$translate', '$http', function ($scope, $translate, $http) {
     // Stupid angular location provider either wants html5 location mode or not, do the query parsing on my own
     var search = decodeURIComponent(window.location.search).slice(1).split('&').map(function (item) { return item.indexOf('=') === -1 ? [item, true] : [item.slice(0, item.indexOf('=')), item.slice(item.indexOf('=')+1)]; }).reduce(function (o, k) { o[k[0]] = k[1]; return o; }, {});
 
@@ -65,7 +65,7 @@ app.controller('LoginController', ['$scope', '$translate', '$http', function ($s
     $scope.mode = '';
     $scope.busy = false;
     $scope.error = false;
-    $scope.status = null;
+    $scope.branding = null;
     $scope.username = '';
     $scope.password = '';
     $scope.totpToken = '';
@@ -74,38 +74,6 @@ app.controller('LoginController', ['$scope', '$translate', '$http', function ($s
     $scope.newPasswordRepeat = '';
     var API_ORIGIN = '<%= apiOrigin %>' || window.location.origin;
 
-    $scope.onLogin = function () {
-        $scope.busy = true;
-        $scope.error = false;
-
-        var data = {
-            username: $scope.username,
-            password: $scope.password,
-            totpToken: $scope.totpToken
-        };
-
-        function error() {
-            $scope.busy = false;
-            $scope.error = true;
-
-            $scope.password = '';
-            $scope.loginForm.$setPristine();
-            setTimeout(function () { $('#inputPassword').focus(); }, 200);
-        }
-
-        $http.post(API_ORIGIN + '/api/v1/cloudron/login', data).success(function (data, status) {
-            if (status !== 200) return error();
-
-            localStorage.token = data.accessToken;
-
-            // prevent redirecting to random domains
-            var returnTo = search.returnTo || '/';
-            if (returnTo.indexOf('/') !== 0) returnTo = '/';
-
-            window.location.href = returnTo;
-        }).error(error);
-    };
-
     $scope.onPasswordReset = function () {
         $scope.busy = true;
 
@@ -118,7 +86,7 @@ app.controller('LoginController', ['$scope', '$translate', '$http', function ($s
             $scope.mode = 'passwordResetDone';
         }
 
-        $http.post(API_ORIGIN + '/api/v1/cloudron/password_reset_request', data).success(done).error(done);
+        $http.post(API_ORIGIN + '/api/v1/auth/password_reset_request', data).success(done).error(done);
     };
 
     $scope.onNewPassword = function () {
@@ -139,7 +107,7 @@ app.controller('LoginController', ['$scope', '$translate', '$http', function ($s
             else $scope.error = 'Unknown error';
         }
 
-        $http.post(API_ORIGIN + '/api/v1/cloudron/password_reset', data).success(function (data, status) {
+        $http.post(API_ORIGIN + '/api/v1/auth/password_reset', data).success(function (data, status) {
             if (status !== 202) return error(data, status);
 
             // set token to autologin
@@ -158,28 +126,20 @@ app.controller('LoginController', ['$scope', '$translate', '$http', function ($s
         setTimeout(function () { $('#inputPasswordResetIdentifier').focus(); }, 200);
     };
 
-    $scope.showLogin = function () {
-        if ($scope.status) window.document.title = $scope.status.cloudronName + ' Login';
-        $scope.mode = 'login';
-        $scope.error = false;
-        setTimeout(function () { $('#inputUsername').focus(); }, 200);
-    };
-
     $scope.showNewPassword = function () {
         window.document.title = 'Set New Password';
         $scope.mode = 'newPassword';
         setTimeout(function () { $('#inputNewPassword').focus(); }, 200);
     };
 
-    $http.get(API_ORIGIN + '/api/v1/cloudron/status').success(function (data, status) {
+    $http.get(API_ORIGIN + '/api/v1/auth/branding').success(function (data, status) {
         $scope.initialized = true;
 
         if (status !== 200) return;
 
         if (data.language) $translate.use(data.language);
 
-        if ($scope.mode === 'login') window.document.title = data.cloudronName + ' Login';
-        $scope.status = data;
+        $scope.branding = data;
     }).error(function () {
         $scope.initialized = false;
     });
@@ -193,6 +153,6 @@ app.controller('LoginController', ['$scope', '$translate', '$http', function ($s
         localStorage.token = search.accessToken || search.access_token;
         window.location.href = '/';
     } else {
-        $scope.showLogin();
+        $scope.showPasswordReset();
     }
 }]);

dashboard/src/js/restore.js

@@ -1,7 +1,7 @@
 'use strict';
 
 /* global $, angular, tld, SECRET_PLACEHOLDER, STORAGE_PROVIDERS, BACKUP_FORMATS */
-/* global REGIONS_S3, REGIONS_WASABI, REGIONS_DIGITALOCEAN, REGIONS_EXOSCALE, REGIONS_SCALEWAY, REGIONS_LINODE, REGIONS_OVH, REGIONS_IONOS, REGIONS_UPCLOUD, REGIONS_VULTR  */
+/* global REGIONS_S3, REGIONS_WASABI, REGIONS_DIGITALOCEAN, REGIONS_EXOSCALE, REGIONS_SCALEWAY, REGIONS_LINODE, REGIONS_OVH, REGIONS_IONOS, REGIONS_UPCLOUD, REGIONS_VULTR, REGIONS_CONTABO  */
 
 // create main application module
 var app = angular.module('Application', ['pascalprecht.translate', 'ngCookies', 'angular-md5', 'ui-notification', 'ui.bootstrap']);
@@ -41,6 +41,8 @@ app.controller('RestoreController', ['$scope', 'Client', function ($scope, Clien
     $scope.encrypted = false; // only used if a backup config contains that flag
     $scope.setupToken = '';
     $scope.skipDnsSetup = false;
+    $scope.disk = null;
+    $scope.blockDevices = [];
 
     $scope.mountOptions = {
         host: '',
@@ -54,6 +56,11 @@ app.controller('RestoreController', ['$scope', 'Client', function ($scope, Clien
         privateKey: ''
     };
 
+    $scope.$watch('disk', function (newValue) {
+        if (!newValue) return;
+        $scope.mountOptions.diskPath = '/dev/disk/by-uuid/' + newValue.uuid;
+    });
+
     $scope.sysinfo = {
         provider: 'generic',
         ipv4: '',
@@ -85,6 +92,7 @@ app.controller('RestoreController', ['$scope', 'Client', function ($scope, Clien
     $scope.ionosRegions = REGIONS_IONOS;
     $scope.upcloudRegions = REGIONS_UPCLOUD;
     $scope.vultrRegions = REGIONS_VULTR;
+    $scope.contaboRegions = REGIONS_CONTABO;
 
     $scope.storageProviders = STORAGE_PROVIDERS;
 
@@ -94,11 +102,12 @@ app.controller('RestoreController', ['$scope', 'Client', function ($scope, Clien
         return provider === 's3' || provider === 'minio' || provider === 's3-v4-compat' || provider === 'exoscale-sos'
             || provider === 'digitalocean-spaces' || provider === 'wasabi' || provider === 'scaleway-objectstorage'
             || provider === 'linode-objectstorage' || provider === 'ovh-objectstorage' || provider === 'backblaze-b2' || provider === 'cloudflare-r2'
-            || provider === 'ionos-objectstorage' || provider === 'vultr-objectstorage' || provider === 'upcloud-objectstorage' || provider === 'idrive-e2';
+            || provider === 'ionos-objectstorage' || provider === 'vultr-objectstorage' || provider === 'upcloud-objectstorage' || provider === 'idrive-e2'
+            || provider === 'contabo-objectstorage';
     };
 
     $scope.mountlike = function (provider) {
-        return provider === 'sshfs' || provider === 'cifs' || provider === 'nfs' || provider === 'mountpoint' || provider === 'ext4' || provider === 'xfs';
+        return provider === 'disk' || provider === 'sshfs' || provider === 'cifs' || provider === 'nfs' || provider === 'mountpoint' || provider === 'ext4' || provider === 'xfs';
     };
 
     $scope.restore = function () {
@@ -151,6 +160,10 @@ app.controller('RestoreController', ['$scope', 'Client', function ($scope, Clien
             } else if (backupConfig.provider === 'vultr-objectstorage') {
                 backupConfig.region = $scope.vultrRegions.find(function (x) { return x.value === $scope.endpoint; }).region;
                 backupConfig.signatureVersion = 'v4';
+            }   else if (backupConfig.provider === 'contabo-objectstorage') {
+                backupConfig.region = $scope.contaboRegions.find(function (x) { return x.value === $scope.endpoint; }).region;
+                backupConfig.signatureVersion = 'v4';
+                backupConfig.s3ForcePathStyle = true; // https://docs.contabo.com/docs/products/Object-Storage/technical-description (no virtual buckets)
             } else if (backupConfig.provider === 'upcloud-objectstorage') {
                 var m = /^.*\.(.*)\.upcloudobjects.com$/.exec(backupConfig.endpoint);
                 backupConfig.region = m ? m[1] : 'us-east-1'; // let it fail in validation phase if m is not valid
@@ -195,7 +208,7 @@ app.controller('RestoreController', ['$scope', 'Client', function ($scope, Clien
                     backupConfig.mountOptions.port = $scope.mountOptions.port;
                     backupConfig.mountOptions.privateKey = $scope.mountOptions.privateKey;
                 }
-            } else if (backupConfig.provider === 'ext4' || backupConfig.provider === 'xfs') {
+            } else if (backupConfig.provider === 'disk' || backupConfig.provider === 'ext4' || backupConfig.provider === 'xfs') {
                 backupConfig.mountOptions.diskPath = $scope.mountOptions.diskPath;
             } else if (backupConfig.provider === 'mountpoint') {
                 backupConfig.mountPoint = $scope.mountPoint;
@@ -284,7 +297,7 @@ app.controller('RestoreController', ['$scope', 'Client', function ($scope, Clien
     function waitForRestore() {
         $scope.busy = true;
 
-        Client.getStatus(function (error, status) {
+        Client.getProvisionStatus(function (error, status) {
             if (!error && !status.restore.active) { // restore finished
                 if (status.restore.errorMessage) {
                     $scope.busy = false;
@@ -346,7 +359,7 @@ app.controller('RestoreController', ['$scope', 'Client', function ($scope, Clien
     };
 
     function init() {
-        Client.getStatus(function (error, status) {
+        Client.getProvisionStatus(function (error, status) {
             if (error) return Client.initError(error, init);
 
             if (status.restore.active) return waitForRestore();
@@ -358,10 +371,25 @@ app.controller('RestoreController', ['$scope', 'Client', function ($scope, Clien
                 return;
             }
 
-            $scope.status = status;
-            $scope.instanceId = search.instanceId;
-            $scope.setupToken = search.setupToken;
-            $scope.initialized = true;
+            Client.getProvisionBlockDevices(function (error, result) {
+                if (error) {
+                    console.error('Failed to list blockdevices:', error);
+                } else {
+                    // only offer non /, /boot or /home disks
+                    result = result.filter(function (d) { return d.mountpoint !== '/' && d.mountpoint !== '/home' && d.mountpoint !== '/boot'; });
+                    // only offer xfs and ext4 disks
+                    result = result.filter(function (d) { return d.type === 'xfs' || d.type === 'ext4'; });
+
+                    // amend label for UI
+                    result.forEach(function (d) { d.label = d.path; });
+                }
+
+                $scope.blockDevices = result;
+
+                $scope.instanceId = search.instanceId;
+                $scope.setupToken = search.setupToken;
+                $scope.initialized = true;
+            });
         });
     }
 

dashboard/src/js/setup.js

@@ -71,22 +71,24 @@ app.controller('SetupController', ['$scope', 'Client', function ($scope, Client)
             return;
         }
 
-        // if we are here from the ip first go to the real domain if already setup
+        // if we are here from https://ip/setup.html ,go to https://admin/setup.html
         if (status.adminFqdn && status.adminFqdn !== window.location.hostname) {
             window.location.href = 'https://' + status.adminFqdn + '/setup.html';
-            return;
+            return true;
         }
 
         // if we don't have a domain yet, first go to domain setup
         if (!status.adminFqdn) {
             window.location.href = '/setupdns.html';
-            return;
+            return true;
         }
 
         if (status.activated) {
             window.location.href = '/';
-            return;
+            return true;
         }
+
+        return false;
     }
 
     function setView(view) {
@@ -98,10 +100,10 @@ app.controller('SetupController', ['$scope', 'Client', function ($scope, Client)
     }
 
     function init() {
-        Client.getStatus(function (error, status) {
+        Client.getProvisionStatus(function (error, status) {
             if (error) return Client.initError(error, init);
 
-            redirectIfNeeded(status);
+            if (redirectIfNeeded(status)) return;
             setView(search.view);
 
             $scope.setupToken = search.setupToken;

dashboard/src/js/setupaccount.js

@@ -70,7 +70,7 @@ app.controller('SetupAccountController', ['$scope', '$translate', '$http', funct
     $scope.busy = false;
     $scope.error = null;
     $scope.view = 'setup';
-    $scope.status = null;
+    $scope.branding = null;
 
     $scope.profileLocked = !!search.profileLocked;
     $scope.existingUsername = !!search.username;
@@ -119,7 +119,7 @@ app.controller('SetupAccountController', ['$scope', '$translate', '$http', funct
             }
         }
 
-        $http.post(API_ORIGIN + '/api/v1/cloudron/setup_account', data).success(function (data, status) {
+        $http.post(API_ORIGIN + '/api/v1/auth/setup_account', data).success(function (data, status) {
             if (status !== 201) return error(data, status);
 
             // set token to autologin
@@ -133,14 +133,14 @@ app.controller('SetupAccountController', ['$scope', '$translate', '$http', funct
         $scope.view = 'noUsername';
         $scope.initialized = true;
     } else {
-        $http.get(API_ORIGIN + '/api/v1/cloudron/status').success(function (data, status) {
+        $http.get(API_ORIGIN + '/api/v1/auth/branding').success(function (data, status) {
             $scope.initialized = true;
 
             if (status !== 200) return;
 
             if (data.language) $translate.use(data.language);
 
-            $scope.status = data;
+            $scope.branding = data;
         }).error(function () {
             $scope.initialized = false;
         });

dashboard/src/js/setupdns.js

@@ -79,6 +79,7 @@ app.controller('SetupDNSController', ['$scope', '$http', '$timeout', 'Client', f
     // keep in sync with domains.js
     $scope.dnsProvider = [
         { name: 'AWS Route53', value: 'route53' },
+        { name: 'Bunny', value: 'bunny' },
         { name: 'Cloudflare', value: 'cloudflare' },
         { name: 'DigitalOcean', value: 'digitalocean' },
         { name: 'Gandi LiveDNS', value: 'gandi' },
@@ -110,6 +111,7 @@ app.controller('SetupDNSController', ['$scope', '$http', '$timeout', 'Client', f
         godaddyApiKey: '',
         godaddyApiSecret: '',
         linodeToken: '',
+        bunnyAccessKey: '',
         hetznerToken: '',
         vultrToken: '',
         nameComUsername: '',
@@ -200,6 +202,8 @@ app.controller('SetupDNSController', ['$scope', '$http', '$timeout', 'Client', f
             config.defaultProxyStatus = $scope.dnsCredentials.cloudflareDefaultProxyStatus;
         } else if (provider === 'linode') {
             config.token = $scope.dnsCredentials.linodeToken;
+        } else if (provider === 'bunny') {
+            config.token = $scope.dnsCredentials.bunnyAccessKey;
         } else if (provider === 'hetzner') {
             config.token = $scope.dnsCredentials.hetznerToken;
         } else if (provider === 'vultr') {
@@ -245,7 +249,7 @@ app.controller('SetupDNSController', ['$scope', '$http', '$timeout', 'Client', f
                 config: config,
                 tlsConfig: tlsConfig
             },
-            sysinfoConfig: sysinfoConfig,
+            ipv4Config: sysinfoConfig,
             providerToken: $scope.instanceId,
             setupToken: $scope.setupToken
         };
@@ -272,7 +276,7 @@ app.controller('SetupDNSController', ['$scope', '$http', '$timeout', 'Client', f
     function waitForDnsSetup() {
         $scope.state = 'waitingForDnsSetup';
 
-        Client.getStatus(function (error, status) {
+        Client.getProvisionStatus(function (error, status) {
             if (!error && !status.setup.active) {
                 if (!status.adminFqdn || status.setup.errorMessage) { // setup reset or errored. start over
                     $scope.error.setup = status.setup.errorMessage;
@@ -291,7 +295,7 @@ app.controller('SetupDNSController', ['$scope', '$http', '$timeout', 'Client', f
     }
 
     function initialize() {
-        Client.getStatus(function (error, status) {
+        Client.getProvisionStatus(function (error, status) {
             if (error) {
                 // During domain migration, the box code restarts and can result in getStatus() failing temporarily
                 console.error(error);

dashboard/src/js/terminal.js

@@ -1,376 +0,0 @@
-'use strict';
-
-/* global angular, $, Terminal, AttachAddon, FitAddon, ISTATES */
-
-// create main application module
-angular.module('Application', ['pascalprecht.translate', 'ngCookies', 'angular-md5', 'ui-notification']);
-
-angular.module('Application').controller('TerminalController', ['$scope', '$translate', '$timeout', '$location', 'Client', function ($scope, $translate, $timeout, $location, Client) {
-    var search = decodeURIComponent(window.location.search).slice(1).split('&').map(function (item) { return item.split('='); }).reduce(function (o, k) { o[k[0]] = k[1]; return o; }, {});
-
-    $scope.config = Client.getConfig();
-    $scope.user = Client.getUserInfo();
-
-    $scope.apps = [];
-    $scope.selected = '';
-    $scope.terminal = null;
-    $scope.terminalSocket = null;
-    $scope.fitAddon = null;
-    $scope.restartAppBusy = false;
-    $scope.appBusy = false;
-    $scope.selectedAppInfo = null;
-    $scope.schedulerTasks = [];
-
-    $scope.downloadFile = {
-        error: '',
-        filePath: '',
-        busy: false,
-
-        downloadUrl: function () {
-            if (!$scope.downloadFile.filePath) return '';
-
-            var filePath = encodeURIComponent($scope.downloadFile.filePath);
-
-            return Client.apiOrigin + '/api/v1/apps/' + $scope.selected.value + '/download?file=' + filePath + '&access_token=' + Client.getToken();
-        },
-
-        show: function () {
-            $scope.downloadFile.busy = false;
-            $scope.downloadFile.error = '';
-            $scope.downloadFile.filePath = '';
-            $('#downloadFileModal').modal('show');
-        },
-
-        submit: function () {
-            $scope.downloadFile.busy = true;
-
-            Client.checkDownloadableFile($scope.selected.value, $scope.downloadFile.filePath, function (error) {
-                $scope.downloadFile.busy = false;
-
-                if (error) {
-                    $scope.downloadFile.error = 'The requested file does not exist.';
-                    return;
-                }
-
-                // we have to click the link to make the browser do the download
-                // don't know how to prevent the browsers
-                $('#fileDownloadLink')[0].click();
-
-                $('#downloadFileModal').modal('hide');
-            });
-        }
-    };
-
-    $scope.uploadProgress = {
-        busy: false,
-        total: 0,
-        current: 0,
-
-        show: function () {
-            $scope.uploadProgress.total = 0;
-            $scope.uploadProgress.current = 0;
-
-            $('#uploadProgressModal').modal('show');
-        },
-
-        hide: function () {
-            $('#uploadProgressModal').modal('hide');
-        }
-    };
-
-    $scope.uploadFile = function () {
-        var fileUpload = document.querySelector('#fileUpload');
-
-        fileUpload.onchange = function (e) {
-            if (e.target.files.length === 0) return;
-
-            $scope.uploadProgress.busy = true;
-            $scope.uploadProgress.show();
-
-            Client.uploadFile($scope.selected.value, e.target.files[0], function progress(e) {
-                $scope.uploadProgress.total = e.total;
-                $scope.uploadProgress.current = e.loaded;
-            }, function (error) {
-                if (error) console.error(error);
-
-                $scope.uploadProgress.busy = false;
-                $scope.uploadProgress.hide();
-            });
-        };
-
-        fileUpload.click();
-    };
-
-    $scope.usesAddon = function (addon) {
-        if (!$scope.selected || !$scope.selected.addons) return false;
-        return !!Object.keys($scope.selected.addons).find(function (a) { return a === addon; });
-    };
-
-    function reset() {
-        if ($scope.terminal) {
-            $scope.terminal.dispose();
-            $scope.terminal = null;
-        }
-
-        if ($scope.terminalSocket) {
-            $scope.terminalSocket = null;
-        }
-
-        $scope.selectedAppInfo = null;
-    }
-
-    $scope.restartApp = function () {
-        $scope.restartAppBusy = true;
-        $scope.appBusy = true;
-
-        var appId = $scope.selected.value;
-
-        function waitUntilRestarted(callback) {
-            refreshApp(appId, function (error, result) {
-                if (error) return callback(error);
-
-                if (result.installationState === ISTATES.INSTALLED) return callback();
-                setTimeout(waitUntilRestarted.bind(null, callback), 2000);
-            });
-        }
-
-        Client.restartApp(appId, function (error) {
-            if (error) console.error('Failed to restart app.', error);
-
-            waitUntilRestarted(function (error) {
-                if (error) console.error('Failed wait for restart.', error);
-
-                $scope.restartAppBusy = false;
-                $scope.appBusy = false;
-            });
-        });
-    };
-
-    function createTerminalSocket(callback) {
-        var appId = $scope.selected.value;
-
-        Client.createExec(appId, { cmd: [ '/bin/bash' ], tty: true, lang: 'C.UTF-8' }, function (error, execId) {
-            if (error) return callback(error);
-
-            try {
-                // websocket cannot use relative urls
-                var url = Client.apiOrigin.replace('https', 'wss') + '/api/v1/apps/' + appId + '/exec/' + execId + '/startws?tty=true&rows=' + $scope.terminal.rows + '&columns=' + $scope.terminal.cols + '&access_token=' + Client.getToken();
-                $scope.terminalSocket = new WebSocket(url);
-                $scope.terminal.loadAddon(new AttachAddon.AttachAddon($scope.terminalSocket));
-
-                $scope.terminalSocket.onclose = function () {
-                    // retry in one second
-                    $scope.terminalReconnectTimeout = setTimeout(function () {
-                        showTerminal(true);
-                    }, 1000);
-                };
-
-                callback();
-            } catch (e) {
-                callback(e);
-            }
-        });
-    }
-
-    function refreshApp(id, callback) {
-        Client.getApp(id, function (error, result) {
-            if (error) return callback(error);
-
-            $scope.selectedAppInfo = result;
-
-            callback(null, result);
-        });
-    }
-
-    function showTerminal(retry) {
-        reset();
-
-        if (!$scope.selected) return;
-
-        var appId = $scope.selected.value;
-
-        refreshApp(appId, function (error) {
-            if (error) return console.error(error);
-
-            var result = $scope.selectedAppInfo;
-
-            $scope.schedulerTasks = result.manifest.addons.scheduler ? Object.keys(result.manifest.addons.scheduler).map(function (k) { return { name: k, command: result.manifest.addons.scheduler[k].command }; }) : [];
-
-            $scope.terminal = new Terminal();
-
-            $scope.fitAddon = new FitAddon.FitAddon();
-            $scope.terminal.loadAddon($scope.fitAddon);
-
-            $scope.terminal.open(document.querySelector('#terminalContainer'));
-
-            window.terminal = $scope.terminal;
-
-            // Let the browser handle paste
-            $scope.terminal.attachCustomKeyEventHandler(function (e) {
-                if (e.key === 'v' && (e.ctrlKey || e.metaKey)) return false;
-            });
-
-            if (retry) $scope.terminal.writeln('Reconnecting...');
-            else $scope.terminal.writeln('Connecting...');
-
-            // we have to give it some time to setup the terminal to make it fit, there is no event unfortunately
-            setTimeout(function () {
-                if (!$scope.terminal) return;
-
-                // this is here so that the text wraps correctly after the fit!
-                // var YELLOW = '\u001b[33m'; // https://gist.github.com/dainkaplan/4651352
-                // var NC = '\u001b[0m';
-                // $scope.terminal.writeln(YELLOW + 'If you resize the browser window, press Ctrl+D to start a new session with the current size.' + NC);
-
-                // we have to first write something on reconnect after app restart..not sure why
-                $scope.fitAddon.fit();
-
-                // create exec container after we fit() since we cannot resize exec container post-creation
-                createTerminalSocket(function (error) { if (error) console.error(error); });
-
-                $scope.terminal.focus();
-            }, 1000);
-        });
-    }
-
-    $scope.terminalInject = function (addon, extra) {
-        if (!$scope.terminalSocket) return;
-
-        var cmd, manifestVersion = $scope.selected.manifest.manifestVersion;
-        if (addon === 'mysql') {
-            if (manifestVersion === 1) {
-                cmd = 'mysql --user=${MYSQL_USERNAME} --password=${MYSQL_PASSWORD} --host=${MYSQL_HOST} ${MYSQL_DATABASE}';
-            } else {
-                cmd = 'mysql --user=${CLOUDRON_MYSQL_USERNAME} --password=${CLOUDRON_MYSQL_PASSWORD} --host=${CLOUDRON_MYSQL_HOST} ${CLOUDRON_MYSQL_DATABASE}';
-            }
-        } else if (addon === 'postgresql') {
-            if (manifestVersion === 1) {
-                cmd = 'PGPASSWORD=${POSTGRESQL_PASSWORD} psql -h ${POSTGRESQL_HOST} -p ${POSTGRESQL_PORT} -U ${POSTGRESQL_USERNAME} -d ${POSTGRESQL_DATABASE}';
-            } else {
-                cmd = 'PGPASSWORD=${CLOUDRON_POSTGRESQL_PASSWORD} psql -h ${CLOUDRON_POSTGRESQL_HOST} -p ${CLOUDRON_POSTGRESQL_PORT} -U ${CLOUDRON_POSTGRESQL_USERNAME} -d ${CLOUDRON_POSTGRESQL_DATABASE}';
-            }
-        } else if (addon === 'mongodb') {
-            if (manifestVersion === 1) {
-                cmd = 'mongo -u "${MONGODB_USERNAME}" -p "${MONGODB_PASSWORD}" ${MONGODB_HOST}:${MONGODB_PORT}/${MONGODB_DATABASE}';
-            } else {
-                cmd = 'mongosh -u "${CLOUDRON_MONGODB_USERNAME}" -p "${CLOUDRON_MONGODB_PASSWORD}" ${CLOUDRON_MONGODB_HOST}:${CLOUDRON_MONGODB_PORT}/${CLOUDRON_MONGODB_DATABASE}';
-            }
-        } else if (addon === 'redis') {
-            if (manifestVersion === 1) {
-                cmd = 'redis-cli -h "${REDIS_HOST}" -p "${REDIS_PORT}" -a "${REDIS_PASSWORD}"';
-            } else {
-                cmd = 'redis-cli -h "${CLOUDRON_REDIS_HOST}" -p "${CLOUDRON_REDIS_PORT}" -a "${CLOUDRON_REDIS_PASSWORD}"';
-            }
-        } else if (addon === 'scheduler' && extra) {
-            cmd = extra.command;
-        }
-
-        if (!cmd) return;
-
-        cmd += ' ';
-
-        $scope.terminalSocket.send(cmd);
-        $scope.terminal.focus();
-    };
-
-    // terminal right click handling
-    $scope.terminalClear = function () {
-        if (!$scope.terminal) return;
-        $scope.terminal.clear();
-        $scope.terminal.focus();
-    };
-
-    $scope.terminalCopy = function () {
-        if (!$scope.terminal) return;
-
-        // execCommand('copy') would copy any selection from the page, so do this only if terminal has a selection
-        if (!$scope.terminal.getSelection()) return;
-
-        document.execCommand('copy');
-        $scope.terminal.focus();
-    };
-
-    $('.contextMenuBackdrop').on('click', function () {
-        $('#terminalContextMenu').hide();
-        $('.contextMenuBackdrop').hide();
-
-        $scope.terminal.focus();
-    });
-
-    $('#terminalContainer').on('contextmenu', function (e) {
-        if (!$scope.terminal) return true;
-
-        e.preventDefault();
-
-        $('.contextMenuBackdrop').show();
-        $('#terminalContextMenu').css({
-            display: 'block',
-            left: e.pageX,
-            top: e.pageY
-        });
-
-        return false;
-    });
-
-    window.addEventListener('resize', function () {
-        if ($scope.fitAddon) $scope.fitAddon.fit();
-    });
-
-    Client.getStatus(function (error, status) {
-        if (error) return $scope.error(error);
-
-        if (!status.activated) {
-            console.log('Not activated yet, closing or redirecting', status);
-            window.close();
-            window.location.href = '/';
-            return;
-        }
-
-        // check version and force reload if needed
-        if (!localStorage.version) {
-            localStorage.version = status.version;
-        } else if (localStorage.version !== status.version) {
-            localStorage.version = status.version;
-            window.location.reload(true);
-        }
-
-        console.log('Running terminal version ', localStorage.version);
-
-        // get user profile as the first thing. this populates the "scope" and affects subsequent API calls
-        Client.refreshUserInfo(function (error) {
-            if (error) return $scope.error(error);
-
-            Client.refreshConfig(function (error) {
-                if (error) return $scope.error(error);
-
-                refreshApp(search.id, function (error, app) {
-                    $scope.selected = {
-                        type: 'app',
-                        value: app.id,
-                        name: app.fqdn + ' (' + app.manifest.title + ')',
-                        addons: app.manifest.addons,
-                        manifest: app.manifest
-                    };
-
-                    // now mark the Client to be ready
-                    Client.setReady();
-
-                    $scope.initialized = true;
-
-                    showTerminal();
-                });
-            });
-        });
-    });
-
-    $translate([ 'terminal.title' ]).then(function (tr) {
-        if (tr['terminal.title'] !== 'terminal.title') window.document.title = tr['terminal.title'];
-    });
-
-    // setup all the dialog focus handling
-    ['downloadFileModal'].forEach(function (id) {
-        $('#' + id).on('shown.bs.modal', function () {
-            $(this).find('[autofocus]:first').focus();
-        });
-    });
-}]);

dashboard/src/logs.html

@@ -1,84 +0,0 @@
-<!DOCTYPE html>
-<html ng-app="Application" ng-controller="LogsController">
-<head>
-  <meta charset="utf-8" />
-  <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height" />
-
-  <title>Cloudron Logs</title>
-  <meta name="description" content="Cloudron Logs">
-
-  <link id="favicon" href="/api/v1/cloudron/avatar" rel="icon" type="image/png">
-  <link rel="apple-touch-icon" href="/api/v1/cloudron/avatar">
-  <link rel="icon" href="/api/v1/cloudron/avatar">
-
-  <!-- CSS -->
-  <link type="text/css" rel="stylesheet" href="/3rdparty/angular-ui-notification.css?<%= revision %>"/>
-  <link type="text/css" rel="stylesheet" href="/theme.css?<%= revision %>">
-
-  <!-- Fontawesome -->
-  <link type="text/css" rel="stylesheet" href="/3rdparty/fontawesome/css/all.css?<%= revision %>"/>
-
-  <!-- jQuery-->
-  <script type="text/javascript" src="/3rdparty/js/jquery.min.js?<%= revision %>"></script>
-
-  <!-- async -->
-  <script type="text/javascript" src="/3rdparty/js/async-3.2.0.min.js?<%= revision %>"></script>
-
-  <!-- Bootstrap Core JavaScript -->
-  <script type="text/javascript" src="/3rdparty/js/bootstrap.min.js?<%= revision %>"></script>
-
-  <!-- Angularjs scripts -->
-  <script type="text/javascript" src="/3rdparty/js/angular.min.js?<%= revision %>"></script>
-  <script type="text/javascript" src="/3rdparty/js/angular-loader.min.js?<%= revision %>"></script>
-  <script type="text/javascript" src="/3rdparty/js/angular-cookies.min.js?<%= revision %>"></script>
-  <script type="text/javascript" src="/3rdparty/js/angular-animate.min.js?<%= revision %>"></script>
-  <script type="text/javascript" src="/3rdparty/js/angular-base64.min.js?<%= revision %>"></script>
-  <script type="text/javascript" src="/3rdparty/js/angular-md5.min.js?<%= revision %>"></script>
-  <script type="text/javascript" src="/3rdparty/js/angular-sanitize.min.js?<%= revision %>"></script>
-  <script type="text/javascript" src="/3rdparty/js/angular-ui-notification.js?<%= revision %>"></script>
-
-  <!-- Angular directives for bootstrap https://angular-ui.github.io/bootstrap/ -->
-  <script type="text/javascript" src="/3rdparty/js/ui-bootstrap-tpls-1.3.3.min.js?<%= revision %>"></script>
-
-  <!-- Angular translate https://angular-translate.github.io/ -->
-  <script type="text/javascript" src="/3rdparty/js/angular-translate.min.js?<%= revision %>"></script>
-  <script type="text/javascript" src="/3rdparty/js/angular-translate-loader-static-files.min.js?<%= revision %>"></script>
-  <script type="text/javascript" src="/3rdparty/js/angular-translate-storage-cookie.min.js?<%= revision %>"></script>
-  <script type="text/javascript" src="/3rdparty/js/angular-translate-storage-local.min.js?<%= revision %>"></script>
-
-  <!-- Showdown (markdown converter) -->
-  <script type="text/javascript" src="/3rdparty/js/showdown-1.9.1.min.js?<%= revision %>"></script>
-
-  <!-- colors -->
-  <script type="text/javascript" src="/3rdparty/js/colors.js?<%= revision %>"></script>
-
-  <!-- moment -->
-  <script type="text/javascript" src="/3rdparty/js/moment.min.js?<%= revision %>"></script>
-
-  <!-- Main Application -->
-  <script type="text/javascript" src="/js/logs.js?<%= revision %>"></script>
-
-</head>
-
-<body class="logs">
-
-  <a class="offline-banner animateMe" ng-show="client.offline" ng-cloak href="https://docs.cloudron.io/troubleshooting/" target="_blank"><i class="fa fa-circle-notch fa-spin"></i> {{ 'main.offline' | tr }}</a>
-
-  <div class="animateMe ng-hide layout-root" ng-show="initialized">
-    <div class="logs-controls">
-      <h3 style="display: inline-block;">{{ selected.name }}</h3>
-
-      <!-- logs actions -->
-      <div class="pull-right">
-        <a class="btn btn-primary" ng-href="{{ '/terminal.html?id=' + selected.value }}" target="_blank" ng-show="selected.type === 'app'"><i class="fa fa-terminal"></i> {{ 'terminal.title' | tr }}</a>
-        <a class="btn btn-primary" ng-href="{{ '/filemanager.html?type=app&id=' + selected.value }}" target="_blank" ng-show="selected.type === 'app'"><i class="fas fa-folder"></i> {{ 'filemanager.title' | tr }}</a>
-        <a class="btn btn-primary" ng-click="clear()"><i class="fa fa-trash"></i> {{ 'logs.clear' | tr }}</a>
-        <a class="btn btn-primary" ng-href="{{ selected.url }}&format=short&lines=-1"><i class="fa fa-download"></i> {{ 'logs.download' | tr }}</a>
-      </div>
-    </div>
-
-    <div class="logs-container"></div>
-  </div>
-
-</body>
-</html>

dashboard/src/notfound.html

@@ -4,8 +4,8 @@
     <meta charset="utf-8" />
     <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height" />
 
-    <title>Cloudron Not Found</title>
-    <meta name="description" content="Cloudron Not Found">
+    <title>Cloudron - Not Found</title>
+    <meta name="description" content="Cloudron - Not Found">
 
     <!-- Use static style as we can't include local stylesheets -->
     <style>

dashboard/src/passwordreset.html

@@ -6,8 +6,8 @@
     <meta http-equiv="Content-Security-Policy" content="default-src <%= apiOrigin %> 'unsafe-inline' 'unsafe-eval' 'self'; img-src <%= apiOrigin %> 'self'" />
 
     <!-- this gets changed once we get the status (because angular has not loaded yet, we see template string for a flash) -->
-    <title>Cloudron Login</title>
-    <meta name="description" content="Cloudron Login">
+    <title>Cloudron Password Reset</title>
+    <meta name="description" content="Cloudron Password Reset">
 
     <link id="favicon" href="<%= apiOrigin %>/api/v1/cloudron/avatar" rel="icon" type="image/png">
 
@@ -47,52 +47,14 @@
     <script type="text/javascript" src="/3rdparty/js/angular-translate-storage-local.min.js?<%= revision %>"></script>
 
     <!-- Setup Application -->
-    <script type="text/javascript" src="/js/login.js?<%= revision %>"></script>
+    <script type="text/javascript" src="/js/passwordreset.js?<%= revision %>"></script>
 
 </head>
 
-<body ng-app="Application" ng-controller="LoginController">
+<body ng-app="Application" ng-controller="PasswordResetController">
 
 <div class="layout-root ng-cloak" ng-show="initialized">
 
-  <div class="layout-content" ng-show="mode === 'login'">
-    <div class="card" style="padding: 20px; margin-top: 100px; max-width: 620px;">
-      <div class="row">
-        <div class="col-md-12" style="text-align: center;">
-          <img width="128" height="128" style="margin-top: -84px" src="<%= apiOrigin %>/api/v1/cloudron/avatar"/>
-          <br/>
-          <h1><small>{{ 'login.loginTo' | tr }}</small> {{ status.cloudronName || 'Cloudron' }}</h1>
-        </div>
-      </div>
-      <br/>
-      <div class="row">
-        <div class="col-md-12">
-          <h4 class="has-error" ng-show="error">{{ 'login.errorIncorrectCredentials' | tr }}</h4>
-        </div>
-      </div>
-      <div class="row">
-        <div class="col-md-12">
-          <form name="loginForm" ng-submit="onLogin()">
-            <div class="form-group">
-              <label class="control-label" for="inputUsername">{{ 'login.username' | tr }}</label>
-              <input type="text" class="form-control" id="inputUsername" name="username" ng-model="username" ng-disabled="busy" autofocus required>
-            </div>
-            <div class="form-group">
-              <label class="control-label" for="inputPassword">{{ 'login.password' | tr }}</label>
-              <input type="password" class="form-control" name="password" id="inputPassword" ng-model="password" ng-disabled="busy" required password-reveal>
-            </div>
-            <div class="form-group">
-              <label class="control-label" for="inputTotpToken">{{ 'login.2faToken' | tr }}</label>
-              <input type="text" class="form-control" name="totpToken" id="inputTotpToken" ng-model="totpToken" ng-disabled="busy" value="">
-            </div>
-            <button class="btn btn-primary btn-outline pull-right" type="submit" ng-disabled="busy || loginForm.$invalid"><i class="fa fa-circle-notch fa-spin" ng-show="busy"></i> {{ 'login.signInAction' | tr }}</button>
-          </form>
-          <a ng-href="" class="hand" ng-click="showPasswordReset()">{{ 'login.resetPasswordAction' | tr }}</a>
-        </div>
-      </div>
-    </div>
-  </div>
-
   <div class="layout-content" ng-show="mode === 'passwordReset'">
     <div class="card" style="padding: 20px; margin-top: 100px; max-width: 620px;">
       <div class="row">
@@ -111,9 +73,11 @@
               <input type="text" class="form-control" id="inputPasswordResetIdentifier" name="passwordResetIdentifier" ng-model="passwordResetIdentifier" ng-disabled="busy" autofocus required>
             </div>
             <br/>
-            <button class="btn btn-primary btn-outline pull-right" type="submit" ng-disabled="busy || passwordResetForm.$invalid"><i class="fa fa-circle-notch fa-spin" ng-show="busy"></i> {{ 'passwordReset.resetAction' | tr }}</button>
+            <div class="card-form-bottom-bar">
+              <a href="/" class="hand">{{ 'passwordReset.backToLoginAction' | tr }}</a>
+              <button class="btn btn-primary btn-outline" type="submit" ng-disabled="busy || passwordResetForm.$invalid"><i class="fa fa-circle-notch fa-spin" ng-show="busy"></i> {{ 'passwordReset.resetAction' | tr }}</button>
+            </div>
           </form>
-          <a ng-href="" class="hand" ng-click="showLogin()">{{ 'passwordReset.backToLoginAction' | tr }}</a>
         </div>
       </div>
     </div>
@@ -127,7 +91,7 @@
           <br/>
           <h2>{{ 'passwordReset.emailSent.title' | tr }}</h2>
           <br/>
-          <button class="btn btn-primary" ng-click="showLogin()">{{ 'passwordReset.backToLoginAction' | tr }}</button>
+          <a href="/" class="btn btn-primary">{{ 'passwordReset.backToLoginAction' | tr }}</a>
         </div>
       </div>
     </div>
@@ -171,10 +135,11 @@
               <label class="control-label" for="inputPasswordResetTotpToken">{{ 'login.2faToken' | tr }}</label>
               <input type="text" class="form-control" name="passwordResetTotpToken" id="inputPasswordResetTotpToken" ng-model="totpToken" ng-disabled="busy" value="">
             </div>
-            <br/>
-            <button class="btn btn-primary btn-outline pull-right" type="submit" ng-disabled="busy || newPasswordForm.$invalid || newPassword !== newPasswordRepeat"><i class="fa fa-circle-notch fa-spin" ng-show="busy"></i> {{ 'passwordReset.passwordChanged.submitAction' | tr }}</button>
+            <div class="card-form-bottom-bar">
+              <a href="/" class="hand">{{ 'passwordReset.backToLoginAction' | tr }}</a>
+              <button class="btn btn-primary btn-outline" type="submit" ng-disabled="busy || newPasswordForm.$invalid || newPassword !== newPasswordRepeat"><i class="fa fa-circle-notch fa-spin" ng-show="busy"></i> {{ 'passwordReset.passwordChanged.submitAction' | tr }}</button>
+            </div>
           </form>
-          <a ng-href="" class="hand" ng-click="showLogin()">{{ 'passwordReset.backToLoginAction' | tr }}</a>
         </div>
       </div>
     </div>
@@ -195,7 +160,7 @@
   </div>
 
   <footer class="text-center">
-    <span class="text-muted" ng-bind-html="status.footer | markdown2html"></span>
+    <span class="text-muted" ng-bind-html="branding.footer | markdown2html"></span>
   </footer>
 
 </div>

dashboard/src/restore.html

@@ -137,6 +137,12 @@
                                     <input type="text" class="form-control" ng-model="mountOptions.diskPath" id="inputConfigureDiskPath" name="diskPath" ng-disabled="busy" placeholder="Directory for backups" ng-required="provider === 'ext4' || provider === 'xfs'">
                                 </div>
 
+                                <!-- Disk -->
+                                <div class="form-group" ng-class="{ 'has-error': error.diskPath }" ng-show="provider === 'disk'">
+                                    <label class="control-label">Device</label>
+                                    <select class="form-control" ng-model="disk" ng-options="item as item.label for item in blockDevices track by item.path" ng-required="provider === 'disk'"></select>
+                                </div>
+
                                 <!-- SSHFS -->
                                 <div class="form-group" ng-show="provider === 'sshfs'">
                                     <label class="control-label" for="configureBackupPort">SSH Port</label>
@@ -235,6 +241,11 @@
                                     <select class="form-control" name="region" id="inputConfigureBackupVultrRegion" ng-model="endpoint" ng-options="a.value as a.name for a in vultrRegions" ng-disabled="busy" ng-required="provider === 'vultr-objectstorage'"></select>
                                 </div>
 
+                                <div class="form-group" ng-class="{ 'has-error': error.region }" ng-show="provider === 'contabo-objectstorage'">
+                                    <label class="control-label" for="inputConfigureBackupContaboRegion">Region</label>
+                                    <select class="form-control" name="region" id="inputConfigureBackupContaboRegion" ng-model="endpoint" ng-options="a.value as a.name for a in contaboRegions" ng-disabled="busy" ng-required="provider === 'contabo-objectstorage'"></select>
+                                </div>
+
                                 <div class="form-group" ng-class="{ 'has-error': error.accessKeyId }" ng-show="s3like(provider)">
                                     <label class="control-label" for="inputConfigureBackupAccessKeyId">Access key id</label>
                                     <input type="text" class="form-control" ng-model="accessKeyId" id="inputConfigureBackupAccessKeyId" name="accessKeyId" ng-disabled="busy" ng-required="s3like(provider)">

dashboard/src/setupaccount.html

@@ -58,7 +58,7 @@
         <div class="col-md-12" style="text-align: center;">
           <img width="128" height="128" style="margin-top: -84px" src="<%= apiOrigin %>/api/v1/cloudron/avatar"/>
           <br/>
-          <h1><small>{{ 'setupAccount.welcomeTo' | tr }}</small> {{ status.cloudronName || 'Cloudron' }}</h1>
+          <h1><small>{{ 'setupAccount.welcomeTo' | tr }}</small> {{ branding.cloudronName || 'Cloudron' }}</h1>
           <h3>{{ 'setupAccount.description' | tr }}</h3>
         </div>
       </div>
@@ -154,7 +154,7 @@
   </div>
 
   <footer class="text-center ng-cloak">
-    <span class="text-muted" ng-bind-html="status.footer | markdown2html"></span>
+    <span class="text-muted" ng-bind-html="branding.footer | markdown2html"></span>
   </footer>
 
 </div>

dashboard/src/setupdns.html

@@ -220,6 +220,12 @@
                                     <input type="text" class="form-control" ng-model="dnsCredentials.linodeToken" name="linodeToken" ng-required="dnsCredentials.provider === 'linode'" ng-disabled="dnsCredentials.busy">
                                 </p>
 
+                                <!-- Bunny -->
+                                <p class="form-group" ng-show="dnsCredentials.provider === 'bunny'">
+                                  <label class="control-label">Access Key</label>
+                                  <input type="text" class="form-control" ng-model="dnsCredentials.bunnyAccessKey" name="bunnyAccessKey" ng-required="dnsCredentials.provider === 'bunny'" ng-disabled="dnsCredentials.busy">
+                                </p>
+
                                 <!-- Porkbun -->
                                 <div class="form-group" ng-class="{ 'has-error': dnsCredentialsForm.porkbunApikey.$dirty && dnsCredentialsForm.porkbunApikey.$invalid }" ng-show="dnsCredentials.provider === 'porkbun'">
                                   <label class="control-label">API Key</label>

dashboard/src/terminal.html

@@ -1,172 +0,0 @@
-<!DOCTYPE html>
-<html ng-app="Application" ng-controller="TerminalController">
-<head>
-  <meta charset="utf-8" />
-  <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height" />
-
-  <title>Cloudron Terminal</title>
-  <meta name="description" content="Cloudron Terminal">
-
-  <link id="favicon" href="/api/v1/cloudron/avatar" rel="icon" type="image/png">
-  <link rel="apple-touch-icon" href="/api/v1/cloudron/avatar">
-  <link rel="icon" href="/api/v1/cloudron/avatar">
-
-  <!-- CSS -->
-  <link type="text/css" rel="stylesheet" href="/3rdparty/angular-ui-notification.css?<%= revision %>"/>
-  <link type="text/css" rel="stylesheet" href="/theme.css?<%= revision %>">
-
-  <!-- Fontawesome -->
-  <link type="text/css" rel="stylesheet" href="/3rdparty/fontawesome/css/all.css?<%= revision %>"/>
-
-  <!-- jQuery-->
-  <script type="text/javascript" src="/3rdparty/js/jquery.min.js?<%= revision %>"></script>
-
-  <!-- async -->
-  <script type="text/javascript" src="/3rdparty/js/async-3.2.0.min.js?<%= revision %>"></script>
-
-  <!-- Bootstrap Core JavaScript -->
-  <script type="text/javascript" src="/3rdparty/js/bootstrap.min.js?<%= revision %>"></script>
-
-  <!-- Angularjs scripts -->
-  <script type="text/javascript" src="/3rdparty/js/angular.min.js?<%= revision %>"></script>
-  <script type="text/javascript" src="/3rdparty/js/angular-loader.min.js?<%= revision %>"></script>
-  <script type="text/javascript" src="/3rdparty/js/angular-cookies.min.js?<%= revision %>"></script>
-  <script type="text/javascript" src="/3rdparty/js/angular-animate.min.js?<%= revision %>"></script>
-  <script type="text/javascript" src="/3rdparty/js/angular-base64.min.js?<%= revision %>"></script>
-  <script type="text/javascript" src="/3rdparty/js/angular-md5.min.js?<%= revision %>"></script>
-  <script type="text/javascript" src="/3rdparty/js/angular-sanitize.min.js?<%= revision %>"></script>
-  <script type="text/javascript" src="/3rdparty/js/angular-ui-notification.js?<%= revision %>"></script>
-
-  <!-- Angular directives for bootstrap https://angular-ui.github.io/bootstrap/ -->
-  <script type="text/javascript" src="/3rdparty/js/ui-bootstrap-tpls-1.3.3.min.js?<%= revision %>"></script>
-
-  <!-- Angular translate https://angular-translate.github.io/ -->
-  <script type="text/javascript" src="/3rdparty/js/angular-translate.min.js?<%= revision %>"></script>
-  <script type="text/javascript" src="/3rdparty/js/angular-translate-loader-static-files.min.js?<%= revision %>"></script>
-  <script type="text/javascript" src="/3rdparty/js/angular-translate-storage-cookie.min.js?<%= revision %>"></script>
-  <script type="text/javascript" src="/3rdparty/js/angular-translate-storage-local.min.js?<%= revision %>"></script>
-
-  <!-- Clipboard handling -->
-  <script type="text/javascript" src="/3rdparty/js/clipboard.min.js?<%= revision %>"></script>
-
-  <!-- xterm -->
-  <link type="text/css" rel="stylesheet" href="/3rdparty/xterm/css/xterm.css?<%= revision %>" />
-  <script src="/3rdparty/xterm/lib/xterm.js?<%= revision %>"></script>
-  <script src="/3rdparty/xterm-addon-attach/lib/xterm-addon-attach.js?<%= revision %>"></script>
-  <script src="/3rdparty/xterm-addon-fit/lib/xterm-addon-fit.js?<%= revision %>"></script>
-
-  <!-- Showdown (markdown converter) -->
-  <script type="text/javascript" src="/3rdparty/js/showdown-1.9.1.min.js?<%= revision %>"></script>
-
-  <!-- Main Application -->
-  <script type="text/javascript" src="/js/terminal.js?<%= revision %>"></script>
-
-</head>
-
-<body style="overflow: hidden;">
-
-  <!-- Modal download file -->
-  <div class="modal fade" id="downloadFileModal" tabindex="-1" role="dialog">
-    <div class="modal-dialog">
-      <div class="modal-content">
-        <div class="modal-header">
-          <h4 class="modal-title">{{ 'terminal.download.title' | tr:{ name: selected.name } }}</h4>
-        </div>
-        <div class="modal-body">
-          <form name="downloadFileForm" ng-submit="downloadFile.submit()">
-            <div class="form-group" ng-class="{ 'has-error': downloadFileForm.filePath.$dirty && downloadFile.error }">
-              <label class="control-label" for="inputDownloadFilePath">{{ 'terminal.download.filePath' | tr }}</label>
-              <div class="control-label" ng-show="{ 'has-error': downloadFileForm.filePath.$dirty && downloadFile.error }">
-                <small>{{ downloadFile.error }}</small>
-              </div>
-              <input type="text" class="form-control" name="filePath" ng-model="downloadFile.filePath" required autofocus>
-            </div>
-            <input id="inputDownloadFilePath" class="ng-hide" type="submit" ng-disabled="!downloadFile.filePath"/>
-          </form>
-        </div>
-        <div class="modal-footer">
-          <a id="fileDownloadLink" class="" ng-href="{{ downloadFile.downloadUrl() }}" target="_blank"></a>
-
-          <button type="button" class="btn btn-default" data-dismiss="modal">{{ 'main.dialog.cancel' | tr }}</button>
-          <button type="button" class="btn btn-success" ng-click="downloadFile.submit()" ng-disabled="!downloadFile.filePath"><i class="fa fa-circle-notch fa-spin" ng-show="downloadFile.busy"></i> {{ 'terminal.download.download' | tr }}</button>
-        </div>
-      </div>
-    </div>
-  </div>
-
-  <!-- Modal upload progress -->
-  <div class="modal fade" id="uploadProgressModal" tabindex="-1" role="dialog">
-    <div class="modal-dialog">
-      <div class="modal-content">
-        <div class="modal-header">
-          <h4 class="modal-title">{{ 'terminal.upload.title' | tr:{ name: selected.name } }}</h4>
-        </div>
-        <div class="modal-body">
-          <span><b>{{ uploadProgress.current | prettyDecimalSize }}</b> (total {{ uploadProgress.total | prettyDecimalSize }})</span>
-          <div class="progress progress-striped active">
-            <div class="progress-bar progress-bar-success" role="progressbar" style="width: {{ 100*(uploadProgress.current/uploadProgress.total) }}%"></div>
-          </div>
-        </div>
-        <div class="modal-footer"></div>
-      </div>
-    </div>
-  </div>
-
-  <div class="animateMe ng-hide layout-root terminal-view" ng-show="initialized">
-
-    <div class="terminal-controls">
-      <h3 style="display: inline-block;">{{ selected.name }}</h3>
-
-      <input type="file" id="fileUpload" class="hide"/>
-
-      <div class="pull-right">
-        <div class="btn-group" ng-show="usesAddon('scheduler')">
-          <button type="button" class="btn btn-success dropdown-toggle" data-toggle="dropdown" ng-disabled="appBusy">
-            {{ 'terminal.scheduler' | tr }} <span class="caret"></span>
-          </button>
-          <ul class="dropdown-menu">
-            <li ng-repeat="task in schedulerTasks"><a href="" ng-click="terminalInject('scheduler', task)">{{ task.name }}</a></li>
-          </ul>
-        </div>
-
-        <!-- addon actions -->
-        <button class="btn btn-success" ng-click="terminalInject('mysql')" ng-show="usesAddon('mysql')" ng-disabled="appBusy">MySQL</button>
-        <button class="btn btn-success" ng-click="terminalInject('postgresql')" ng-show="usesAddon('postgresql')" ng-disabled="appBusy">Postgres</button>
-        <button class="btn btn-success" ng-click="terminalInject('mongodb')" ng-show="usesAddon('mongodb')" ng-disabled="appBusy">MongoDB</button>
-        <button class="btn btn-success" ng-click="terminalInject('redis')" ng-show="usesAddon('redis')" ng-disabled="appBusy">Redis</button>
-
-        <!-- terminal actions -->
-        <button class="btn btn-primary" ng-click="restartApp()" ng-show="selected.type === 'app'" ng-disabled="appBusy"><i class="fa fa-sync-alt" ng-class="{ 'fa-spin': restartAppBusy }"></i> {{ 'terminal.restart' | tr }}</button>
-        <button class="btn btn-primary" ng-click="uploadFile()" ng-show="selected.type === 'app' && !uploadProgress.busy" ng-disabled="appBusy"><i class="fa fa-upload"></i> {{ 'terminal.uploadToTmp' | tr }}</button>
-        <button class="btn btn-primary" ng-click="uploadProgress.show()" ng-show="uploadProgress.busy" ng-disabled="appBusy"><i class="fa fa-circle-notch fa-spin"></i> {{ 'terminal.uploading' | tr }}</button>
-        <button class="btn btn-primary" ng-click="downloadFile.show()" ng-show="selected.type === 'app'" ng-disabled="appBusy"><i class="fa fa-download"></i> {{ 'terminal.downloadAction' | tr }}</button>
-      </div>
-    </div>
-
-    <div class="terminal-container" id="terminalContainer" ng-hide="appBusy"></div>
-    <div class="terminal-container placeholder" ng-show="appBusy">
-      <h4>&nbsp;
-        <span ng-show="restartAppBusy">{{ 'terminal.busy.restarting' | tr }}</span>
-        <span ng-show="selectedAppInfo.installationState === 'pending_debug' && selectedAppInfo.debugMode">{{ 'terminal.busy.restartingInPausedMode' | tr }}</span>
-        <span ng-show="selectedAppInfo.installationState === 'pending_debug' && !selectedAppInfo.debugMode ">{{ 'terminal.busy.resuming' | tr }}</span>
-        <span ng-show="selectedAppInfo.installationState === 'pending_installed'">{{ 'terminal.busy.installing' | tr }}</span>
-      </h4>
-
-      <div class="progress" ng-show="appBusy" style="width: 80%">
-        <div class="progress-bar progress-bar-striped active" role="progressbar" style="width: 100%"></div>
-      </div>
-    </div>
-
-    <div class="contextMenuBackdrop">
-      <ul class="dropdown-menu" id="terminalContextMenu" style="position: absolute; display:none;">
-        <li><a href="" ng-click="terminalCopy()">{{ 'terminal.contextmenu.copy' | tr }}</a></li>
-        <li class="disabled"><a>{{ 'terminal.contextmenu.pasteInfo' | tr }}</a></li>
-        <li role="separator" class="divider"></li>
-        <li><a href="" ng-click="terminalClear()">{{ 'terminal.contextmenu.clear' | tr }}</a></li>
-      </ul>
-    </div>
-
-  </div>
-
-</body>
-</html>

dashboard/src/theme.scss

@@ -320,6 +320,10 @@ h1, h2, h3 {
     z-index: 200;
 }
 
+.section-header {
+    margin-top: 50px;
+}
+
 .offscreen {
     position: absolute;
     left: -999em;
@@ -685,7 +689,7 @@ multiselect {
     }
 
     .card {
-        min-height: 488px;
+        min-height: 523px;
     }
 
     @media(min-width:768px) {
@@ -824,6 +828,19 @@ multiselect {
     cursor: not-allowed;
 }
 
+// ----------------------------
+// Login and password forms
+// ----------------------------
+
+.card-form-bottom-bar {
+    display: flex;
+    justify-content: space-between;
+}
+
+.card-form-bottom-bar > * {
+    align-self: center;
+}
+
 // ----------------------------
 // Appstore view
 // ----------------------------
@@ -1757,6 +1774,14 @@ tag-input {
 .logs {
     background: black;
 
+    .logs-error {
+        color: white;
+        width: 100%;
+        font-size: 18px;
+        text-align: center;
+        margin-top: 200px;
+    }
+
     .logs-controls {
         margin: 5px;
 
@@ -2023,8 +2048,13 @@ tag-input {
 .has-background {
 
     h1, h2, h3 {
-        filter: drop-shadow(0 0 0.5px black);
         color: white;
+        -webkit-text-stroke: 0.3px black;
+
+        .btn {
+            color: white;
+            -webkit-text-stroke: 0;
+        }
     }
 
     .modal-content {

dashboard/src/translation/da.json

@@ -51,7 +51,8 @@
             "save": "Gem",
             "close": "Luk",
             "no": "Nej",
-            "yes": "Ja"
+            "yes": "Ja",
+            "delete": "Slet"
         },
         "username": "Brugernavn",
         "displayName": "Vis navn",
@@ -87,7 +88,8 @@
         "statusEnabled": "Aktiveret",
         "statusDisabled": "Slået fra",
         "loadingPlaceholder": "Indlæsning",
-        "disableAction": "Deaktiver"
+        "disableAction": "Deaktiver",
+        "settings": "Indstillinger"
     },
     "appstore": {
         "category": {
@@ -1013,7 +1015,8 @@
             "hetznerToken": "Hetzner Token",
             "porkbunSecretapikey": "Hemmelig API-nøgle",
             "cloudflareDefaultProxyStatus": "Aktiver proxying for nye DNS-poster",
-            "porkbunApikey": "API-nøgle"
+            "porkbunApikey": "API-nøgle",
+            "bunnyAccessKey": "Bunny Access Key"
         },
         "title": "Domæner og certs",
         "addDomain": "Tilføj domæne",
@@ -1042,7 +1045,8 @@
         "domainWellKnown": {
             "title": "Well-Known locations på {{ domain }}"
         },
-        "tooltipWellKnown": "Indstil well-known lokationer"
+        "tooltipWellKnown": "Indstil well-known lokationer",
+        "count": "Samlede domæner: {{ count }}"
     },
     "notifications": {
         "markAllAsRead": "Markér alle som læst",
@@ -1817,7 +1821,9 @@
         "password": "Adgangskode",
         "2faToken": "2FA-token (hvis aktiveret)",
         "signInAction": "Log ind",
-        "resetPasswordAction": "Nulstil adgangskode"
+        "resetPasswordAction": "Nulstil adgangskode",
+        "errorIncorrect2FAToken": "2FA-token er ugyldig",
+        "errorInternal": "Intern fejl, prøv igen senere"
     },
     "lang": {
         "en": "English",
@@ -1831,9 +1837,47 @@
         "zh_Hans": "Kinesisk (forenklet)",
         "es": "Spansk",
         "ru": "Russisk",
-        "pt": "Portugisisk"
+        "pt": "Portugisisk",
+        "da": "Dansk"
     },
     "supportConfig": {
         "emailNotVerified": "Du bedes først bekræfte e-mailen på cloudron.io-kontoen for at sikre, at vi kan kontakte dig."
+    },
+    "oidc": {
+        "newClientDialog": {
+            "title": "Tilføj klient",
+            "description": "Tilføj nye OpenID connect-klientindstillinger.",
+            "createAction": "Opret"
+        },
+        "client": {
+            "name": "Navn",
+            "id": "Klient-id",
+            "secret": "Klientens secret",
+            "signingAlgorithm": "Signeringsalgoritme",
+            "loginRedirectUri": "Url til tilbagekaldelse af login (kommasepareret, hvis der er mere end én)",
+            "logoutRedirectUri": "Url til tilbagekaldelse af logout (valgfrit)"
+        },
+        "title": "OpenID Connect-udbyder",
+        "description": "Cloudron kan fungere som OpenID Connect-udbyder for interne apps og eksterne tjenester.",
+        "editClientDialog": {
+            "title": "Rediger klient {{ client }}"
+        },
+        "deleteClientDialog": {
+            "title": "Virkelig slette klient {{ client }}?",
+            "description": "Dette vil afbryde forbindelsen til alle eksterne OpenID-apps fra denne Cloudron, der bruger dette klient-id."
+        },
+        "env": {
+            "discoveryUrl": "URL til opdagelse",
+            "logoutUrl": "URL til logout",
+            "profileEndpoint": "Profil slutpunkt",
+            "keysEndpoint": "Nøgler Slutpunkt",
+            "tokenEndpoint": "Token slutpunkt",
+            "authEndpoint": "Auth-slutpunkt"
+        },
+        "clients": {
+            "title": "Klienter",
+            "newClient": "Ny klient",
+            "empty": "Ingen klienten endnu"
+        }
     }
 }

dashboard/src/translation/de.json

@@ -39,7 +39,8 @@
             "save": "Speichern",
             "close": "Schließen",
             "yes": "Ja",
-            "no": "Nein"
+            "no": "Nein",
+            "delete": "Löschen"
         },
         "username": "Username",
         "displayName": "Name",
@@ -87,7 +88,8 @@
             "users": "User"
         },
         "statusDisabled": "Deaktiviert",
-        "loadingPlaceholder": "Laden"
+        "loadingPlaceholder": "Laden",
+        "settings": "Einstellungen"
     },
     "network": {
         "title": "Netzwerk",
@@ -240,7 +242,7 @@
             "subscriptionRequired": "Diese Funktionen sind nur im Abo enthalten.",
             "require2FACheckbox": "User müssen Zwei-Faktor-Authentifizierung (2FA) aktivieren",
             "allowProfileEditCheckbox": "Erlaube Usern ihren Namen und E-Mail-Adresse zu ändern",
-            "title": "Einstellungen",
+            "title": "User Einstellungen",
             "require2FAWarning": "Richte 2FA ein um nicht ausgesperrt zu werden."
         },
         "groups": {
@@ -748,7 +750,8 @@
             "jitsiHostname": "Jitsi Pfad",
             "cloudflareDefaultProxyStatus": "Proxying für neue DNS-Einträge aktivieren",
             "porkbunSecretapikey": "Geheimer API-Schlüssel",
-            "porkbunApikey": "API-Schlüssel"
+            "porkbunApikey": "API-Schlüssel",
+            "bunnyAccessKey": "Bunny Access Key"
         },
         "changeDashboardDomain": {
             "title": "Die Dashboard-Domäne ändern",
@@ -1363,7 +1366,8 @@
                 "paste": "Einfügen",
                 "copy": "Kopieren",
                 "cut": "Ausschneiden",
-                "edit": "Bearbeiten"
+                "edit": "Bearbeiten",
+                "open": "Öffnen"
             },
             "symlink": "Symlink zu {{ target }}",
             "mtime": "Geändert"
@@ -1611,7 +1615,7 @@
             "appdata": {
                 "title": "Datenverzeichnis",
                 "dataDirPlaceholder": "Leer lassen, um Systemvorgabe zu verwenden",
-                "description": "Standardmäßig befinden sich die Daten dieser Anwendung unter <code>{{ storagePath }}</code>. Wenn dem Server der Speicherplatz ausgeht, kann durch Hinzufügen einer externen Festplatte, die Daten der Anwendung dorthin verschoben werden. Es wird nur das Ext4-Format unterstützt.",
+                "description": "Wenn dem Server der Speicherplatz ausgeht, kann durch Hinzufügen einer <a href=\"/#/volumes\">externen Festplatte</a>, die Daten der Anwendung dorthin verschoben werden.",
                 "moveAction": "Daten verschieben",
                 "diskUsage": "Die App verwendet derzeit {{ size }} an Speicherplatz (ab {{ date }})."
             },
@@ -1781,10 +1785,11 @@
         "pl": "Polnisch",
         "es": "Spanisch",
         "ru": "Russisch",
-        "pt": "Portugiesisch"
+        "pt": "Portugiesisch",
+        "da": "Dänisch"
     },
     "volumes": {
-        "description": "Datenträger sind Verzeichnisse auf dem Server, die von Anwendungen gemeinsam genutzt werden können. Dabei kann es sich um NFS/SSHFS/CIFS-Mounts oder externe Speicherplatten handeln, die an den Server angeschlossen sind. Datenträger werden dem App-Container unter <code>/media</code> zur Verfügung gestellt.",
+        "description": "Datenträger sind Verzeichnisse auf dem Server, die von Anwendungen gemeinsam genutzt werden können.",
         "removeVolumeDialog": {
             "removeAction": "Entfernen",
             "description": "Dies wird den Datenträger <code>{{ volume }}</code> löschen. Daten innerhalb des Host-Pfades werden nicht entfernt.",
@@ -1835,5 +1840,42 @@
     },
     "supportConfig": {
         "emailNotVerified": "Bitte verifizieren Sie zuerst die E-Mail Ihres cloudron.io-Kontos, um sicherzustellen, dass wir Sie kontaktieren können."
+    },
+    "oidc": {
+        "newClientDialog": {
+            "title": "Client hinzufügen",
+            "description": "Neuen OpenID Connect Clienten hinzufügen.",
+            "createAction": "Erstellen"
+        },
+        "client": {
+            "name": "Name",
+            "id": "Client ID",
+            "signingAlgorithm": "Signatur Algorithmus",
+            "loginRedirectUri": "Login Callback Url (bei mehreren mit Komma getrennt)",
+            "logoutRedirectUri": "Logout Callback Url (optional)",
+            "secret": "Client Geheimnis"
+        },
+        "title": "OpenID Connect Provider",
+        "description": "Cloudron kann als OpenID Connect Provider für interne und externe Apps fungieren.",
+        "editClientDialog": {
+            "title": "Client {{ client }} bearbeiten"
+        },
+        "deleteClientDialog": {
+            "title": "Wirklich Client {{ client }} löschen?",
+            "description": "Damit werden alle externen OpenID Apps, die diese Clientendetails nutzen, getrennt."
+        },
+        "env": {
+            "discoveryUrl": "Discovery URL",
+            "logoutUrl": "Logout URL",
+            "profileEndpoint": "Profil Endpunkt",
+            "keysEndpoint": "Schlüssel Endpunkt",
+            "tokenEndpoint": "Token Endpunkt",
+            "authEndpoint": "Auth Endpunkt"
+        },
+        "clients": {
+            "title": "Clienten",
+            "newClient": "Neuer Client",
+            "empty": "Noch keine Clienten erstellt"
+        }
     }
 }

dashboard/src/translation/en.json

@@ -39,7 +39,8 @@
             "save": "Save",
             "close": "Close",
             "no": "No",
-            "yes": "Yes"
+            "yes": "Yes",
+            "delete": "Delete"
         },
         "username": "Username",
         "displayName": "Display name",
@@ -55,7 +56,8 @@
         },
         "action": {
             "reboot": "Reboot",
-            "logs": "Logs"
+            "logs": "Logs",
+            "showLogs": "Show Logs"
         },
         "clipboard": {
             "copied": "Copied to clipboard",
@@ -87,7 +89,9 @@
         "enableAction": "Enable",
         "statusEnabled": "Enabled",
         "statusDisabled": "Disabled",
-        "loadingPlaceholder": "Loading"
+        "loadingPlaceholder": "Loading",
+        "settings": "Settings",
+        "saveAction": "Save"
     },
     "appstore": {
         "title": "App Store",
@@ -204,7 +208,7 @@
             "externalLdapTooltip": "From external LDAP directory"
         },
         "settings": {
-            "title": "Settings",
+            "title": "User Settings",
             "allowProfileEditCheckbox": "Allow users to edit their name and email",
             "require2FACheckbox": "Require users to set up 2FA",
             "subscriptionRequired": "These features are only available in the paid plans.",
@@ -503,7 +507,8 @@
         },
         "changeBackgroundImage": {
             "title": "Set Background Image"
-        }
+        },
+        "enable2FANotAvailable": "Not available for users from external authentication source"
     },
     "backups": {
         "title": "Backups",
@@ -660,7 +665,7 @@
         "settings": {
             "title": "Settings",
             "info": "These settings are global and apply to all domains.",
-            "location": "Mail server location",
+            "location": "Mail Server Location",
             "maxMailSize": "Maximum email size",
             "spamFilter": "Spam filtering",
             "spamFilterOverview": "{{ blacklistCount }} address(es) on the blocklist.",
@@ -705,7 +710,7 @@
         },
         "changeDomainDialog": {
             "title": "Change Email Server Location",
-            "description": "Cloudron will make the necessary DNS changes across all the domains and restart the mail server. Desktop & Mobile email clients have to be re-configured to use this new location as the IMAP and SMTP server.",
+            "description": "This will move the IMAP and SMTP server to the specified location.",
             "location": "Location",
             "locationPlaceholder": "Leave empty to use bare domain",
             "manualInfo": "Add an A record manually for {{ domain }} to this Cloudron's public IP"
@@ -788,7 +793,8 @@
         },
         "dyndns": {
             "title": "Dynamic DNS",
-            "description": "Enable this option to keep all your DNS records in sync with a changing IP address. This is useful when Cloudron runs in a network with a frequently changing public IP address like a home connection."
+            "description": "Enable this option to keep all your DNS records in sync with a changing IP address. This is useful when Cloudron runs in a network with a frequently changing public IP address like a home connection.",
+            "showLogsAction": "Show Logs"
         },
         "configureIp": {
             "title": "Configure IP Provider",
@@ -804,7 +810,13 @@
         },
         "configureIpv6": {
             "title": "Configure IPv6 Provider"
-        }
+        },
+        "trustedIps": {
+            "description": "HTTP headers from matching IP addresses will be trusted",
+            "title": "Configure Trusted IPs",
+            "summary": "{{ trustCount }} IPs trusted"
+        },
+        "trustedIpRanges": "Trusted IPs & Ranges "
     },
     "services": {
         "title": "Services",
@@ -920,7 +932,8 @@
             "reportPlaceholder": "Describe your issue",
             "emailPlaceholder": "If needed, provide an email address different from above to reach you",
             "emailVerifyAction": "Verify now",
-            "emailNotVerified": "Your cloudron.io account email {{ email }} is not verified. Please verify it to open support tickets."
+            "emailNotVerified": "Your cloudron.io account email {{ email }} is not verified. Please verify it to open support tickets.",
+            "typeBilling": "Billing Issue"
         },
         "remoteSupport": {
             "title": "Remote Support",
@@ -978,7 +991,7 @@
         },
         "changeDashboardDomain": {
             "title": "Change Dashboard Domain",
-            "description": "This will move the dashboard and the email server to the <code>my</code>subdomain of the selected domain.",
+            "description": "This will move the dashboard to the <code>my</code>subdomain of the selected domain.",
             "changeAction": "Change Domain",
             "cancelAction": "Cancel",
             "showLogsAction": "Show Logs"
@@ -1034,7 +1047,8 @@
             "hetznerToken": "Hetzner Token",
             "cloudflareDefaultProxyStatus": "Enable proxying  for new DNS records",
             "porkbunApikey": "API Key",
-            "porkbunSecretapikey": "Secret API Key"
+            "porkbunSecretapikey": "Secret API Key",
+            "bunnyAccessKey": "Bunny Access Key"
         },
         "removeDialog": {
             "title": "Really remove {{ domain }}?",
@@ -1050,7 +1064,8 @@
         "domainWellKnown": {
             "title": "Well-Known locations of {{ domain }}"
         },
-        "tooltipWellKnown": "Set Well-Known Locations"
+        "tooltipWellKnown": "Set Well-Known Locations",
+        "count": "Total domains: {{ count }}"
     },
     "notifications": {
         "title": "Notifications",
@@ -1062,7 +1077,9 @@
     "logs": {
         "title": "Logs",
         "clear": "Clear View",
-        "download": "Download Full Logs"
+        "download": "Download Full Logs",
+        "notFoundError": "No such task or app",
+        "logsGoneError": "Log file(s) not found"
     },
     "terminal": {
         "title": "Terminal",
@@ -1160,7 +1177,8 @@
                 "cut": "Cut",
                 "copy": "Copy",
                 "paste": "Paste",
-                "selectAll": "Select All"
+                "selectAll": "Select All",
+                "open": "Open"
             },
             "mtime": "Modified"
         },
@@ -1175,7 +1193,19 @@
         },
         "status": {
             "restartingApp": "restarting app"
-        }
+        },
+        "uploader": {
+            "uploading": "Uploading",
+            "exitWarning": "Upload still in progress. Really close this page?"
+        },
+        "textEditor": {
+            "undo": "Undo",
+            "redo": "Redo",
+            "save": "Save"
+        },
+        "extractionInProgress": "Extraction in progress",
+        "pasteInProgress": "Pasting in progress",
+        "deleteInProgress": "Deletion in progress"
     },
     "email": {
         "backAction": "Back to Email",
@@ -1449,7 +1479,8 @@
                 "description": "If the server is running out of disk space, use this to move the app's data to a <a href=\"/#/volumes\">volume</a>. Any data here is part of the app's backup.",
                 "dataDirPlaceholder": "Leave empty to use platform default",
                 "moveAction": "Move Data",
-                "diskUsage": "The app is currently using {{ size }} of storage (as of {{ date }})."
+                "diskUsage": "The app is currently using {{ size }} of storage (as of {{ date }}).",
+                "mountTypeWarning": "The destination file system must support file permissions and ownership for the move to work"
             },
             "mounts": {
                 "title": "Mounts",
@@ -1693,6 +1724,17 @@
             "label": "Label",
             "clearIconAction": "Clear Icon",
             "clearIconDescription": "This will try to fetch the app's favicon on save."
+        },
+        "servicesTabTitle": "Services",
+        "turn": {
+            "title": "TURN Setup",
+            "enable": "Configure the app to use the built-in TURN server",
+            "disable": "Do not configure the app's TURN settings. The app's TURN settings are left alone. You can configure it inside the app."
+        },
+        "redis": {
+            "title": "Redis Configuration",
+            "enable": "Configure the app to use Redis",
+            "disable": "Disable Redis"
         }
     },
     "login": {
@@ -1702,7 +1744,9 @@
         "password": "Password",
         "2faToken": "2FA Token (if enabled)",
         "signInAction": "Sign in",
-        "resetPasswordAction": "Reset password"
+        "resetPasswordAction": "Reset password",
+        "errorIncorrect2FAToken": "2FA token is invalid",
+        "errorInternal": "Internal error, try again later"
     },
     "passwordReset": {
         "title": "Password reset",
@@ -1782,7 +1826,8 @@
         "zh_Hans": "Chinese (Simplified)",
         "es": "Spanish",
         "ru": "Russian",
-        "pt": "Portuguese"
+        "pt": "Portuguese",
+        "da": "Danish"
     },
     "volumes": {
         "title": "Volumes",
@@ -1835,5 +1880,43 @@
         "mounts": {
             "description": "Apps can access mounted <a href=\"/#/volumes\">volumes</a> via <code>/media/{volume name}</code> directory. This data is not included in the app's backup."
         }
-    }
+    },
+    "oidc": {
+        "newClientDialog": {
+            "title": "Add Client",
+            "description": "Add new OpenID connect client settings.",
+            "createAction": "Create"
+        },
+        "client": {
+            "name": "Name",
+            "id": "Client ID",
+            "secret": "Client Secret",
+            "signingAlgorithm": "Signing Algorithm",
+            "loginRedirectUri": "Login callback Url (comma separated if more than one)",
+            "logoutRedirectUri": "Logout callback Url (optional)"
+        },
+        "title": "OpenID Connect Provider",
+        "description": "Cloudron can act as an OpenID Connect provider for internal apps and external services.",
+        "editClientDialog": {
+            "title": "Edit Client {{ client }}"
+        },
+        "deleteClientDialog": {
+            "title": "Really delete client {{ client }}?",
+            "description": "This will disconnect all external OpenID apps from this Cloudron using this client ID."
+        },
+        "env": {
+            "discoveryUrl": "Discovery URL",
+            "logoutUrl": "Logout URL",
+            "profileEndpoint": "Profile Endpoint",
+            "keysEndpoint": "Keys Endpoint",
+            "tokenEndpoint": "Token Endpoint",
+            "authEndpoint": "Auth Endpoint"
+        },
+        "clients": {
+            "title": "Clients",
+            "newClient": "New client",
+            "empty": "No clients yet"
+        }
+    },
+    "automation": "Automation"
 }

dashboard/src/translation/es.json

@@ -102,7 +102,8 @@
         "pagination": {
             "perPageSelector": "Mostrar {{ n }} por página",
             "next": "siguiente",
-            "prev": "anterior"
+            "prev": "anterior",
+            "itemCount": "Encontrado {{ count }}"
         },
         "table": {
             "date": "Fecha"
@@ -115,7 +116,8 @@
             "no": "No",
             "close": "Cerrar",
             "save": "Guardar",
-            "cancel": "Cancelar"
+            "cancel": "Cancelar",
+            "delete": "Borrar"
         },
         "logout": "Salir",
         "offline": "Cloudron está desconectado. Reconectando…",
@@ -137,7 +139,9 @@
         },
         "enableAction": "Habilitar",
         "statusEnabled": "Habilitado",
-        "statusDisabled": "Deshabilitado"
+        "statusDisabled": "Deshabilitado",
+        "loadingPlaceholder": "Cargando",
+        "settings": "Ajustes"
     },
     "apps": {
         "domainsFilterHeader": "Todos los Dominios",
@@ -950,7 +954,11 @@
             "vultrToken": "Token Vultr",
             "jitsiHostname": "Ubicación de Jitsi",
             "wellKnownDescription": "Cloudron utilizará los valores para responder a las URLs <code>/.well-known/</code> . Ten en cuenta que la aplicación debe estar disponible en el dominio desnudo <code>{{ domain }}</code> para que esto funcione. Consulta <a href=\"{{docsLink}}\" target=\"_blank\">esta documentación</a> para más información.",
-            "hetznerToken": "Token de Hetzner"
+            "hetznerToken": "Token de Hetzner",
+            "bunnyAccessKey": "Clave de acceso Bunny",
+            "cloudflareDefaultProxyStatus": "Habilitar proxy  para nuevos registros DNS",
+            "porkbunApikey": "Clave API",
+            "porkbunSecretapikey": "Clave API secreta"
         },
         "subscriptionRequired": {
             "setupAction": "Configura tu suscripción",
@@ -982,7 +990,8 @@
         "domainWellKnown": {
             "title": "Ubicaciones Well-known de {{ domain }}"
         },
-        "tooltipWellKnown": "Establece las ubicaciones Well-Known"
+        "tooltipWellKnown": "Establece las ubicaciones Well-Known",
+        "count": "Dominios totales: {{ count }}"
     },
     "app": {
         "appInfo": {
@@ -1098,7 +1107,8 @@
                 "saveAction": "Guardar",
                 "description": "La configuración de esta opción anulará cualquier encabezado CSP enviado por la propia aplicación",
                 "title": "Política de seguridad de contenido"
-            }
+            },
+            "hstsPreload": "Habilitar la carga previa de HSTS para este sitio y todos los subdominios"
         },
         "email": {
             "from": {
@@ -1207,7 +1217,8 @@
             "description": "Todos los datos generados entre ahora y la última copia de seguridad conocida se perderán de forma irrevocable. Se recomienda crear una copia de seguridad de los datos actuales antes de intentar una importación.",
             "title": "Importar Backup",
             "uploadAction": "Subir Configuración de Backup",
-            "importAction": "Importar"
+            "importAction": "Importar",
+            "remotePath": "Ruta del Backup"
         },
         "restoreDialog": {
             "warning": "Todos los datos generados entre ahora y la última copia de seguridad conocida se perderán de forma irrevocable. Se recomienda crear una copia de seguridad de los datos actuales antes de intentar una restauración.",
@@ -1324,7 +1335,8 @@
         "en": "Inglés",
         "es": "Español",
         "ru": "Ruso",
-        "pt": "Portugués"
+        "pt": "Portugués",
+        "da": "Danés"
     },
     "system": {
         "title": "Información del Sistema",
@@ -1345,7 +1357,8 @@
             "title": "Uso del Disco",
             "usedInfo": "{{ used }} usados de {{ size }}",
             "uninstalledApp": "Aplicación desinstalada",
-            "volumeContent": "Este disco es el volumen <code>{{ name }}</code>"
+            "volumeContent": "Este disco es el volumen <code>{{ name }}</code>",
+            "diskSpeed": "Velocidad: {{ speed }} MB/seg"
         },
         "selectPeriodLabel": "Seleccionar Periodo"
     },
@@ -1403,7 +1416,7 @@
         "removeVolumeActionTooltip": "Borrar Volumen",
         "openFileManagerActionTooltip": "Abrir Gestor de Archivos",
         "name": "Nombre",
-        "hostPath": "Punto de montaje",
+        "hostPath": "Objetivo",
         "addVolumeAction": "Añade un Volumen",
         "title": "Volúmenes",
         "description": "Los volúmenes son sistemas de archivos locales o remotos. Se pueden usar como el almacenamiento de datos principal de una aplicación o como una ubicación de almacenamiento compartida entre aplicaciones.",
@@ -1811,7 +1824,9 @@
         "password": "Contraseña",
         "2faToken": "Token 2FA (si está habilitado)",
         "signInAction": "Iniciar sesión",
-        "resetPasswordAction": "Resetear contraseña"
+        "resetPasswordAction": "Resetear contraseña",
+        "errorIncorrect2FAToken": "El token 2FA es inválido",
+        "errorInternal": "Error interno, prueba de nuevo más tarde"
     },
     "newLoginEmail": {
         "subject": "[<% = cloudron%>] Nuevo inicio de sesión en tu cuenta",
@@ -1827,5 +1842,42 @@
         "mounts": {
             "description": "Las aplicaciones pueden acceder a <a href=\"/#/volumes\">volúmenes</a> montados a través del directorio <code>/media/{volume name}</code>. Estos datos no están incluidos en la copia de seguridad de la aplicación."
         }
+    },
+    "oidc": {
+        "newClientDialog": {
+            "title": "Añadir Cliente",
+            "description": "Agrega una nueva configuración de cliente de conexión de OpenID.",
+            "createAction": "Crear"
+        },
+        "client": {
+            "name": "Nombre",
+            "id": "ID de cliente",
+            "secret": "Secreto de cliente",
+            "signingAlgorithm": "Algoritmo de firma",
+            "loginRedirectUri": "URL de devolución de llamada de inicio de sesión (separadas por comas si hay más de una)",
+            "logoutRedirectUri": "URL de devolución de llamada de cierre de sesión (opcional)"
+        },
+        "title": "Proveedor de conexión OpenID",
+        "description": "Cloudron puede actuar como proveedor de OpenID Connect para aplicaciones internas y servicios externos.",
+        "editClientDialog": {
+            "title": "Editar cliente {{ client }}"
+        },
+        "deleteClientDialog": {
+            "title": "¿Realmente quieres borrar el cliente {{ client }}?",
+            "description": "Esto desconectará todas las aplicaciones OpenID externas de este Cloudron que utilicen este ID de cliente."
+        },
+        "env": {
+            "discoveryUrl": "URL de descubrimiento",
+            "logoutUrl": "URL de cierre de sesión",
+            "profileEndpoint": "Punto final del perfil",
+            "keysEndpoint": "Punto final de claves",
+            "tokenEndpoint": "Punto final del Token",
+            "authEndpoint": "Punto final de autenticación"
+        },
+        "clients": {
+            "title": "Clientes",
+            "newClient": "Nuevo cliente",
+            "empty": "No hay clientes aún"
+        }
     }
 }

dashboard/src/translation/fr.json

@@ -50,7 +50,8 @@
         "pagination": {
             "prev": "préc.",
             "next": "suiv.",
-            "perPageSelector": "Afficher {{ n }} par page"
+            "perPageSelector": "Afficher {{ n }} par page",
+            "itemCount": "Trouvé {{ count }}"
         },
         "action": {
             "logs": "Journaux",
@@ -85,7 +86,8 @@
             "users": "Utilisateurs"
         },
         "disableAction": "Désactiver",
-        "enableAction": "Activer"
+        "enableAction": "Activer",
+        "loadingPlaceholder": "Chargement"
     },
     "users": {
         "title": "Annuaire des utilisateurs",
@@ -1739,7 +1741,9 @@
             "usageInfo": "{{ available | prettyDiskSize }}</b> sur <b>{{ size | prettyDiskSize }}</b> disponible(s)",
             "mountedAt": "{{ filesystem }} <small>monté sur</small> {{ mountpoint }}",
             "title": "Utilisation du disque",
-            "usedInfo": "{{ used }} utilisé de {{ size }}"
+            "usedInfo": "{{ used }} utilisé de {{ size }}",
+            "uninstalledApp": "Désinstaller App",
+            "diskSpeed": "Vitesse : {{ speed }} MB/sec"
         },
         "title": "Info système"
     },

dashboard/src/translation/nl.json

@@ -38,7 +38,8 @@
             "save": "Opslaan",
             "close": "Sluiten",
             "no": "Nee",
-            "yes": "Ja"
+            "yes": "Ja",
+            "delete": "Verwijder"
         },
         "username": "Gebruikersnaam",
         "displayName": "Naam",
@@ -54,7 +55,8 @@
         },
         "action": {
             "reboot": "Herstart",
-            "logs": "Logbestanden"
+            "logs": "Logbestanden",
+            "showLogs": "Toon logbestanden"
         },
         "clipboard": {
             "copied": "Gekopieerd naar klembord",
@@ -87,7 +89,9 @@
         "enableAction": "Inschakelen",
         "statusEnabled": "Ingeschakeld",
         "statusDisabled": "Uitgeschakeld",
-        "loadingPlaceholder": "Laden"
+        "loadingPlaceholder": "Laden",
+        "settings": "Instellingen",
+        "saveAction": "Opslaan"
     },
     "appstore": {
         "title": "App Store",
@@ -204,7 +208,7 @@
             "newGroupAction": "Nieuwe groep"
         },
         "settings": {
-            "title": "Instellingen",
+            "title": "Gebruiker instellingen",
             "require2FACheckbox": "Gebruikers moeten 2FA activeren",
             "subscriptionRequired": "Deze functies zijn alleen beschikbaar voor betaalde abonnementen.",
             "subscriptionRequiredAction": "Abonnement nemen",
@@ -503,7 +507,8 @@
         },
         "changeBackgroundImage": {
             "title": "Stel achtergrond afbeelding in"
-        }
+        },
+        "enable2FANotAvailable": "Niet beschikbaar voor gebruikers met een externe authenticatie bron"
     },
     "backups": {
         "title": "Backups",
@@ -660,7 +665,7 @@
         "settings": {
             "title": "Instellingen",
             "info": "Deze instellingen zijn generiek voor alle domeinen.",
-            "location": "Mail server locatie",
+            "location": "Mail Server Locatie",
             "maxMailSize": "Maximale e-mail grootte",
             "spamFilter": "Spam filtering",
             "spamFilterOverview": "{{ blacklistCount }} adres(sen) op de blokkeerlijst.",
@@ -708,7 +713,7 @@
             "manualInfo": "Voeg handmatig een A record toe voor {{ domain }} die verwijst naar het IP van deze Cloudron",
             "locationPlaceholder": "Leeg laten om hoofddomein te gebruiken",
             "title": "E-mail server locatie aanpassen",
-            "description": "Cloudron zorgt voor de benodigde DNS aanpassingen van alle domeinen en herstart de e-mail server. Desktop & mobiele e-mailprogramma's moeten opnieuw geconfigureerd worden met deze nieuwe locatie als IMAP en SMTP server."
+            "description": "Dit verhuist de IMAP en SMTP server naar de aangegeven lokatie."
         },
         "changeMailSizeDialog": {
             "title": "Maximale e-mail grootte aanpassen",
@@ -811,7 +816,8 @@
             "hetznerToken": "Hetzner Token",
             "cloudflareDefaultProxyStatus": "Inschakelen proxy voor nieuwe DNS regels",
             "porkbunApikey": "API sleutel",
-            "porkbunSecretapikey": "Geheime API sleutel"
+            "porkbunSecretapikey": "Geheime API sleutel",
+            "bunnyAccessKey": "Bunny toegangssleutel"
         },
         "title": "Domeinen & Certificaten",
         "addDomain": "Domein toevoegen",
@@ -830,7 +836,7 @@
             "cancelAction": "Annuleer",
             "showLogsAction": "Toon logbestanden",
             "title": "Dashboard-domein aanpassen",
-            "description": "Hierdoor verhuist het Dashboard en de e-mailserver naar het <code>my</code> subdomein van het geselecteerde domein."
+            "description": "Hierdoor verhuist het Dashboard naar het <code>my</code> subdomein van het geselecteerde domein."
         },
         "subscriptionRequired": {
             "title": "Abonnement verplicht",
@@ -851,7 +857,8 @@
         "domainWellKnown": {
             "title": "Well-Known locaties van {{ domain }}"
         },
-        "tooltipWellKnown": "Well-Known Locaties instellen"
+        "tooltipWellKnown": "Well-Known Locaties instellen",
+        "count": "Totaal domeinen: {{ count }}"
     },
     "app": {
         "email": {
@@ -959,7 +966,8 @@
                 "dataDirPlaceholder": "Laat leeg om platformstandaard te gebruiken",
                 "moveAction": "Verplaats data",
                 "description": "Als de server onvoldoende schijfruimte heeft, gebruik dit om de app data te verplaatsen naar een <a href=\"/#/volumes\">volume</a>. Alle data daar is onderdeel van de app's backup.",
-                "diskUsage": "De app gebruikt momenteel {{ size }} aan opslag (sinds {{ date }})."
+                "diskUsage": "De app gebruikt momenteel {{ size }} aan opslag (sinds {{ date }}).",
+                "mountTypeWarning": "Het bestemmingsbestandssysteem moet bestandsmachtigingen en eigendom ondersteunen om de verhuizing te laten werken"
             },
             "mounts": {
                 "title": "Koppelpunten",
@@ -1163,7 +1171,7 @@
                 "service": "Dienst (start eenmalig)"
             },
             "title": "Crontab",
-            "saveAction": "Bewaar",
+            "saveAction": "Opslaan",
             "addCommonPattern": "Voeg gemeenschappelijk patroon toe",
             "description": "Eigen app-specifieke cron jobs kunnen hier toegevoegd worden. Let op: standaard cron jobs voor deze applicatie zijn al geïntegreerd in de app en hoef je hier niet te configureren."
         },
@@ -1181,6 +1189,17 @@
             "label": "Label",
             "clearIconAction": "Icoon verwijderen",
             "clearIconDescription": "Hiermee wordt geprobeerd de favicon van de app op te halen na opslaan."
+        },
+        "servicesTabTitle": "Diensten",
+        "turn": {
+            "title": "TURN Instellen",
+            "enable": "Configureer de app om de ingebouwde TURN server te gebruiken",
+            "disable": "Configureer de TURN-instellingen van de app niet. De TURN-instellingen van de app worden met rust gelaten. Je kunt het in de app configureren."
+        },
+        "redis": {
+            "title": "Redis configuratie",
+            "enable": "Configureer de app om Redis te gebruiken",
+            "disable": "Redis uitschakelen"
         }
     },
     "network": {
@@ -1207,7 +1226,8 @@
         },
         "dyndns": {
             "title": "Dynamische DNS",
-            "description": "Schakel deze optie in om je DNS records synchroon te houden met je veranderende IP adres. Dit is handig als je Cloudron opgenomen is in een netwerk waarbij het publieke IP adres steeds wisselt zoals in een thuissituatie."
+            "description": "Schakel deze optie in om je DNS records synchroon te houden met je veranderende IP adres. Dit is handig als je Cloudron opgenomen is in een netwerk waarbij het publieke IP adres steeds wisselt zoals in een thuissituatie.",
+            "showLogsAction": "Toon logbestanden"
         },
         "configureIp": {
             "title": "Configureer IP aanbieder",
@@ -1223,7 +1243,13 @@
         },
         "configureIpv6": {
             "title": "Configureer IPv6 aanbieder"
-        }
+        },
+        "trustedIps": {
+            "description": "HTTP headers van bijbehorende IP adressen worden vertrouwd",
+            "summary": "{{ trustCount }} IP’s vertrouwd",
+            "title": "Configureer vertrouwde IP’s"
+        },
+        "trustedIpRanges": "Vertrouwde IP’s & bereiken "
     },
     "services": {
         "title": "Diensten",
@@ -1392,7 +1418,9 @@
     "logs": {
         "title": "Logbestanden",
         "clear": "Leegmaken",
-        "download": "Download volledige logbestanden"
+        "download": "Download volledige logbestanden",
+        "notFoundError": "Geen taak of app gevonden",
+        "logsGoneError": "Log bestand(en) niet gevonden"
     },
     "terminal": {
         "title": "Terminal",
@@ -1490,7 +1518,8 @@
                 "paste": "Plakken",
                 "copy": "Kopiëren",
                 "cut": "Knippen",
-                "edit": "Bewerk"
+                "edit": "Bewerk",
+                "open": "Open"
             },
             "mtime": "Bewerkt"
         },
@@ -1505,13 +1534,25 @@
         },
         "newDirectory": {
             "errorAlreadyExists": "Bestaat al"
-        }
+        },
+        "uploader": {
+            "exitWarning": "Uploaden nog bezig. Weet je zeker dat je deze pagina wilt sluiten?",
+            "uploading": "Uploaden"
+        },
+        "extractionInProgress": "Bezig met uitpakken",
+        "textEditor": {
+            "undo": "Ongedaan maken",
+            "redo": "Opnieuw doen",
+            "save": "Opslaan"
+        },
+        "pasteInProgress": "Bezig met plakken",
+        "deleteInProgress": "Bezig met verwijderen"
     },
     "email": {
         "backAction": "Terug naar e-mail",
         "config": {
             "title": "E-mailconfiguratie {{ domain }}",
-            "clientConfiguration": "Configureren E-mail clients"
+            "clientConfiguration": "Configureren E-mail programma's"
         },
         "incoming": {
             "disableAction": "Uitschakelen",
@@ -1557,7 +1598,7 @@
             "incomingPasswordUsage": "Wachtwoord van de eigenaar van de mailbox",
             "enabled": "Cloudron e-mailserver is geconfigureerd voor inkomende e-mails voor dit domein.",
             "disabled": "Cloudron e-mailserver ontvangt geen inkomende e-mails voor dit domein.",
-            "howToConnectDescription": "Gebruik onderstaande gegevens om e-mail clients in te stellen."
+            "howToConnectDescription": "Gebruik onderstaande gegevens om e-mail programma's in te stellen."
         },
         "outbound": {
             "tabTitle": "Uitgaand",
@@ -1684,7 +1725,7 @@
         "updateMailinglistDialog": {
             "activeCheckbox": "Mailing-lijst is actief"
         },
-        "howToConnectInfoModal": "Configureren e-mail clients",
+        "howToConnectInfoModal": "Configureren e-mail programma's",
         "mailboxImportDialog": {
             "title": "Importeer Mailboxen",
             "description": "Upload een JSON of CSV bestand met een schema zoals beschreven in onze <a href=\"{{ docsLink }}\" target=\"_blank\">documentatie</a>.",
@@ -1702,7 +1743,9 @@
         "password": "Wachtwoord",
         "resetPasswordAction": "Herstel wachtwoord",
         "2faToken": "2FA Token (indien ingeschakeld)",
-        "errorIncorrectCredentials": "Onjuiste gebruikersnaam of wachtwoord"
+        "errorIncorrectCredentials": "Onjuiste gebruikersnaam of wachtwoord",
+        "errorIncorrect2FAToken": "2FA token is niet geldig",
+        "errorInternal": "Interne fout, probeer later opnieuw"
     },
     "passwordReset": {
         "title": "Wachtwoord herstellen",
@@ -1775,7 +1818,8 @@
         "pl": "Pools",
         "es": "Spaans",
         "ru": "Russisch",
-        "pt": "Portugees"
+        "pt": "Portugees",
+        "da": "Deens"
     },
     "passwordResetEmail": {
         "subject": "[<%= cloudron %>] Wachtwoord herstellen",
@@ -1835,5 +1879,43 @@
         "mounts": {
             "description": "Apps kunnen toegang krijgen tot <a href=\"/#/volumes\">volumes</a> via <code>/media/{volume name}</code> directory. Deze data is niet opgenomen in de app backup."
         }
-    }
+    },
+    "oidc": {
+        "newClientDialog": {
+            "title": "Client toevoegen",
+            "description": "Nieuwe OpenID Connect client instellingen toevoegen.",
+            "createAction": "Aanmaken"
+        },
+        "client": {
+            "name": "Naam",
+            "id": "Client ID",
+            "secret": "Client geheim",
+            "signingAlgorithm": "Ondertekeningsalgoritme",
+            "loginRedirectUri": "Login callback URL (met komma gescheiden indien meer dan één)",
+            "logoutRedirectUri": "Logout callback URL (optioneel)"
+        },
+        "title": "OpenID Connect aanbieder",
+        "description": "Cloudron kan als een OpenID Connect aanbieder voor interne apps en externe diensten fungeren.",
+        "editClientDialog": {
+            "title": "Bewerk Client {{ client }}"
+        },
+        "deleteClientDialog": {
+            "title": "Weet je zeker dat je Client {{ client }} wilt verwijderen?",
+            "description": "Hiermee worden alle externe OpenID apps met dit Client ID losgekoppeld."
+        },
+        "env": {
+            "discoveryUrl": "Discovery URL",
+            "logoutUrl": "Logout URL",
+            "profileEndpoint": "Profiel Eindpunt",
+            "keysEndpoint": "Sleutels Eindpunt",
+            "tokenEndpoint": "Token Eindpunt",
+            "authEndpoint": "Auth Eindpunt"
+        },
+        "clients": {
+            "title": "Clients",
+            "newClient": "Nieuwe Client",
+            "empty": "Nog geen Clients"
+        }
+    },
+    "automation": "Automatisering"
 }

dashboard/src/translation/ru.json

@@ -56,7 +56,8 @@
             "save": "Сохранить",
             "close": "Закрыть",
             "no": "Нет",
-            "yes": "Да"
+            "yes": "Да",
+            "delete": "Удалить"
         },
         "username": "Имя пользователя",
         "displayName": "Отображаемое имя",
@@ -72,7 +73,8 @@
         },
         "action": {
             "reboot": "Перезагрузка",
-            "logs": "Логи"
+            "logs": "Логи",
+            "showLogs": "Показать логи"
         },
         "searchPlaceholder": "Поиск",
         "multiselect": {
@@ -87,7 +89,9 @@
         "enableAction": "Включить",
         "statusEnabled": "Включено",
         "statusDisabled": "Выключено",
-        "loadingPlaceholder": "Загрузка"
+        "loadingPlaceholder": "Загрузка",
+        "settings": "Настройки",
+        "saveAction": "Сохранить"
     },
     "appstore": {
         "category": {
@@ -640,7 +644,8 @@
                 "moveAction": "Переместить данные",
                 "dataDirPlaceholder": "Оставьте пустым, чтобы сохранить настройку по умолчанию",
                 "description": "Если на диске заканчивается место, вы можете перенести данные приложения в <a href=\"/#/volumes\">том</a>. Любые данные по этому пути станут частью резервной копии приложения.",
-                "diskUsage": "Приложение использует {{ size }} хранилища (по состоянию на {{ date }})."
+                "diskUsage": "Приложение использует {{ size }} хранилища (по состоянию на {{ date }}).",
+                "mountTypeWarning": "Чтобы перемещение прошло успешно конечная файловая система должна поддерживать разрешения и права доступа к файлам"
             },
             "mounts": {
                 "volume": "Том",
@@ -833,6 +838,17 @@
             "label": "Метка",
             "clearIconAction": "Очистить иконку",
             "clearIconDescription": "Это действие попытается загрузить favicon после сохранения."
+        },
+        "servicesTabTitle": "Службы",
+        "turn": {
+            "title": "Настроить TURN",
+            "enable": "Настроить использование встроенного TURN сервера в приложении",
+            "disable": "Не настраивать TURN сервер для данного приложения. Вы можете настроить его самостоятельно внутри самого приложения."
+        },
+        "redis": {
+            "title": "Настроить Redis",
+            "enable": "Настроить использование Redis в приложении",
+            "disable": "Отключить Redis"
         }
     },
     "backups": {
@@ -1035,7 +1051,7 @@
         },
         "changeDomainDialog": {
             "title": "Изменить расположение сервера электронной почты",
-            "description": "Cloudron внесет необходимые изменения в DNS во всех доменах и перезапустит почтовый сервер. Настольные и мобильные почтовые клиенты должны быть повторно настроены для использования нового расположения сервера IMAP и SMTP.",
+            "description": "Данное действие перенесёт IMAP и SMTP сервер в указанное расположение.",
             "location": "Расположение",
             "locationPlaceholder": "Оставьте пустым, чтобы использовать основной домен",
             "manualInfo": "Вручную добавьте A запись для {{ domain }}, указав публичный IP Вашего Cloudron"
@@ -1118,7 +1134,8 @@
         },
         "dyndns": {
             "title": "Динамический DNS",
-            "description": "Включите эту опцию, чтобы синхронизировать все ваши DNS-записи с изменяющимся IP-адресом. Это полезно, когда Cloudron работает в сети с часто меняющимся общедоступным IP-адресом, например, в домашних сетях."
+            "description": "Включите эту опцию, чтобы синхронизировать все ваши DNS-записи с изменяющимся IP-адресом. Это полезно, когда Cloudron работает в сети с часто меняющимся общедоступным IP-адресом, например, в домашних сетях.",
+            "showLogsAction": "Показать логи"
         },
         "configureIp": {
             "title": "Настроить источник IP",
@@ -1134,7 +1151,13 @@
         },
         "configureIpv6": {
             "title": "Настройка IPv6"
-        }
+        },
+        "trustedIps": {
+            "summary": "{{ trustCount }} IP доверены",
+            "title": "Настроить доверенные IP",
+            "description": "HTTP заголовки от совпадающих IP адресов будут доверены"
+        },
+        "trustedIpRanges": "Доверенные IP и диапазоны "
     },
     "services": {
         "title": "Службы",
@@ -1310,7 +1333,7 @@
             "changeAction": "Изменить домен",
             "cancelAction": "Отменить",
             "showLogsAction": "Показать логи",
-            "description": "Данное действие переместит панель управления и сервер электронной почты на <code>my</code> поддомен выбранного домена."
+            "description": "Данное действие переместит панель управления на <code>my</code> поддомен выбранного домена."
         },
         "subscriptionRequired": {
             "title": "Требуется подписка",
@@ -1363,7 +1386,8 @@
             "hetznerToken": "Токен Hetzner",
             "cloudflareDefaultProxyStatus": "Активировать прокси для новых DNS записей",
             "porkbunApikey": "API Ключ",
-            "porkbunSecretapikey": "Secret API Ключ"
+            "porkbunSecretapikey": "Secret API Ключ",
+            "bunnyAccessKey": "Ключ доступа Bunny"
         },
         "addDomain": "Добавить домен",
         "removeDialog": {
@@ -1380,7 +1404,8 @@
         "domainWellKnown": {
             "title": "Общеизвестные расположения {{ domain }}"
         },
-        "tooltipWellKnown": "Установить общеизвестные расположения"
+        "tooltipWellKnown": "Установить общеизвестные расположения",
+        "count": "Всего доменов: {{ count }}"
     },
     "notifications": {
         "title": "Уведомления",
@@ -1392,7 +1417,9 @@
     "logs": {
         "title": "Логи",
         "clear": "Очистить обзор",
-        "download": "Скачать полные логи"
+        "download": "Скачать полные логи",
+        "notFoundError": "Задача или приложение не существует",
+        "logsGoneError": "Файл(ы) журнала не найден(ы)"
     },
     "terminal": {
         "title": "Терминал",
@@ -1477,7 +1504,8 @@
                 "cut": "Вырезать",
                 "paste": "Вставить",
                 "selectAll": "Выбрать все",
-                "copy": "Скопировать"
+                "copy": "Скопировать",
+                "open": "Открыть"
             },
             "symlink": "Символическая ссылка на {{ target }}",
             "mtime": "Изменён"
@@ -1505,7 +1533,19 @@
         },
         "status": {
             "restartingApp": "перезапускаем приложение"
-        }
+        },
+        "extractionInProgress": "Идёт извлечение",
+        "uploader": {
+            "exitWarning": "Загрузка ещё не завершена. Вы уверены, что хотите закрыть страницу?",
+            "uploading": "Загружаем"
+        },
+        "textEditor": {
+            "undo": "Отменить операцию",
+            "redo": "Повторить операцию",
+            "save": "Сохранить"
+        },
+        "pasteInProgress": "Выполняется копирование / перемещение",
+        "deleteInProgress": "Выполняется удаление"
     },
     "email": {
         "outbound": {
@@ -1702,7 +1742,9 @@
         "loginTo": "Войти в",
         "username": "Имя пользователя",
         "2faToken": "2FA Токен (если включен)",
-        "errorIncorrectCredentials": "Неправильное имя пользователя или пароль"
+        "errorIncorrectCredentials": "Неправильное имя пользователя или пароль",
+        "errorIncorrect2FAToken": "Неверный 2FA токен",
+        "errorInternal": "Внутренняя ошибка, попробуйте позже"
     },
     "passwordReset": {
         "title": "Сброс пароля",
@@ -1776,7 +1818,8 @@
         "zh_Hans": "Китайский (Упрощенный)",
         "es": "Испанский",
         "ru": "Русский",
-        "pt": "Португальский"
+        "pt": "Португальский",
+        "da": "Датский"
     },
     "setupAccount": {
         "username": "Имя пользователя",
@@ -1835,5 +1878,43 @@
         "mounts": {
             "description": "Приложения могут получить доступ к смонтированным <a href=\"/#/volumes\">томам</a> по пути <code>/media/{имя тома}</code>. Данные таких томов не будут включаться в резервные копии приложения."
         }
-    }
+    },
+    "oidc": {
+        "newClientDialog": {
+            "createAction": "Создать",
+            "title": "Добавить клиента",
+            "description": "Добавить настройки нового клиента OpenID connect."
+        },
+        "client": {
+            "name": "Имя",
+            "id": "ID Клиента",
+            "secret": "Секрет",
+            "signingAlgorithm": "Метод подписи",
+            "loginRedirectUri": "URL обратного вызова (если больше одного, отделите их запятой)",
+            "logoutRedirectUri": "URL обратного вызова для выхода из системы (необязательно)"
+        },
+        "clients": {
+            "title": "Клиенты",
+            "newClient": "Новый клиент",
+            "empty": "Клиенты не найдены"
+        },
+        "title": "Поставщик OpenID Сonnect",
+        "description": "Cloudron может выступать в качестве поставщика OpenID connect для внутренних приложений и внешних сервисов.",
+        "editClientDialog": {
+            "title": "Редактировать клиента {{ client }}"
+        },
+        "deleteClientDialog": {
+            "title": "Вы точно хотите удалить клиента {{ client }}?",
+            "description": "Это действие отключит все внешние OpenID приложения, использующие данный клиент ID, от Cloudron."
+        },
+        "env": {
+            "discoveryUrl": "URL обнаружения",
+            "logoutUrl": "URL выхода из системы",
+            "profileEndpoint": "Конечная точка профиля",
+            "keysEndpoint": "Конечная точка ключей",
+            "tokenEndpoint": "Конечная точка токена",
+            "authEndpoint": "Конечная точка аутентификации"
+        }
+    },
+    "automation": "Автоматизация"
 }

dashboard/src/views/app.html

@@ -368,6 +368,11 @@
             <select class="form-control" name="region" id="inputimportBackupVultrRegion" ng-model="importBackup.endpoint" ng-options="a.value as a.name for a in vultrRegions" ng-disabled="importBackup.busy" ng-required="importBackup.provider === 'vultr-objectstorage'"></select>
           </div>
 
+          <div class="form-group" ng-class="{ 'has-error': importBackup.error.region }" ng-show="importBackup.provider === 'contabo-objectstorage'">
+            <label class="control-label" for="inputimportBackupContaboRegion">{{ 'backups.configureBackupStorage.region' | tr }}</label>
+            <select class="form-control" name="region" id="inputimportBackupContaboRegion" ng-model="importBackup.endpoint" ng-options="a.value as a.name for a in contaboRegions" ng-disabled="importBackup.busy" ng-required="importBackup.provider === 'contabo-objectstorage'"></select>
+          </div>
+
           <div class="form-group" ng-class="{ 'has-error': importBackup.error.accessKeyId }" ng-show="s3like(importBackup.provider)">
             <label class="control-label" for="inputImportBackupAccessKeyId">{{ 'backups.configureBackupStorage.s3AccessKeyId' | tr }}</label>
             <input type="text" class="form-control" ng-model="importBackup.accessKeyId" id="inputImportBackupAccessKeyId" name="accessKeyId" ng-disabled="importBackup.busy" ng-required="s3like(importBackup.provider)">
@@ -581,9 +586,9 @@
             <i ng-hide="app.installationState === 'pending_start' || app.installationState === 'pending_stop'" class="fas" ng-class="{ 'fa-power-off': !uninstall.startButton, 'fa-play': uninstall.startButton }"></i>
           </button>
           <div class="btn-group btn-group-sm" role="group">
-            <a class="btn btn-sm btn-default" ng-href="{{ '/logs.html?appId=' + app.id }}" target="_blank" uib-tooltip="{{ 'app.logsActionTooltip' | tr }}" tooltip-append-to-body="true" tooltip-placement="bottom"><i class="fas fa-align-left"></i></a>
-            <a class="btn btn-sm btn-default" ng-if="app.type !== APP_TYPES.PROXIED" ng-href="{{ '/terminal.html?id=' + app.id }}" target="_blank" uib-tooltip="{{ 'app.terminalActionTooltip' | tr }}" tooltip-append-to-body="true" tooltip-placement="bottom"><i class="fa fa-terminal"></i></a>
-            <a class="btn btn-sm btn-default" ng-if="app.manifest.addons.localstorage" ng-href="{{ '/filemanager.html?type=app&id=' + app.id }}" target="_blank" uib-tooltip="{{ 'app.filemanagerActionTooltip' | tr }}" tooltip-append-to-body="true" tooltip-placement="bottom"><i class="fas fa-folder"></i></a>
+            <a class="btn btn-sm btn-default" ng-href="{{ '/frontend/logs.html?appId=' + app.id }}" target="_blank" uib-tooltip="{{ 'app.logsActionTooltip' | tr }}" tooltip-append-to-body="true" tooltip-placement="bottom"><i class="fas fa-align-left"></i></a>
+            <a class="btn btn-sm btn-default" ng-if="app.type !== APP_TYPES.PROXIED" ng-href="{{ '/frontend/terminal.html?id=' + app.id }}" target="_blank" uib-tooltip="{{ 'app.terminalActionTooltip' | tr }}" tooltip-append-to-body="true" tooltip-placement="bottom"><i class="fa fa-terminal"></i></a>
+            <a class="btn btn-sm btn-default" ng-if="app.manifest.addons.localstorage" ng-href="{{ '/frontend/filemanager.html#/home/app/' + app.id }}" target="_blank" uib-tooltip="{{ 'app.filemanagerActionTooltip' | tr }}" tooltip-append-to-body="true" tooltip-placement="bottom"><i class="fas fa-folder"></i></a>
           </div>
           <div class="dropdown" style="display: inline-block">
             <button class="btn btn-sm btn-default dropdown-toggle" type="button" data-toggle="dropdown" uib-tooltip="{{ 'app.docsActionTooltip' | tr }}" tooltip-append-to-body="true" tooltip-placement="bottom">
@@ -632,6 +637,7 @@
         <div ng-click="setView('proxy')" ng-class="{ 'active': view === 'proxy' }" ng-show="app.type === APP_TYPES.PROXIED">Proxy</div>
         <div ng-click="setView('access')" ng-class="{ 'active': view === 'access' }" ng-show="app.accessLevel === 'admin'">{{ 'app.accessControlTabTitle' | tr }}</div>
         <div ng-click="setView('resources')" ng-class="{ 'active': view === 'resources' }" ng-show="app.type !== APP_TYPES.PROXIED">{{ 'app.resourcesTabTitle' | tr }}</div>
+        <div ng-click="setView('services')" ng-class="{ 'active': view === 'services' }" ng-show="app.type !== APP_TYPES.PROXIED && (app.manifest.addons.turn.optional || app.manifest.addons.redis.optional)">{{ 'app.servicesTabTitle' | tr }}</div>
         <div ng-click="setView('storage')" ng-class="{ 'active': view === 'storage' }" ng-show="app.accessLevel === 'admin' && app.type !== APP_TYPES.PROXIED">{{ 'app.storageTabTitle' | tr }}</div>
         <div ng-click="setView('graphs')" ng-class="{ 'active': view === 'graphs' }" ng-show="app.type !== APP_TYPES.PROXIED">{{ 'app.graphsTabTitle' | tr }}</div>
         <div ng-click="setView('security')" ng-class="{ 'active': view === 'security' }">{{ 'app.securityTabTitle' | tr }}</div>
@@ -965,6 +971,61 @@
         </div>
       </div>
 
+      <div class="card" ng-show="view === 'services'">
+        <div class="row" ng-show="app.manifest.addons.turn.optional">
+          <div class="col-md-12">
+            <label class="control-label">{{ 'app.turn.title' | tr }} <sup><a ng-href="https://docs.cloudron.io/apps/#turn" class="help" target="_blank"><i class="fa fa-question-circle"></i></a></sup></label>
+
+            <div class="radio">
+              <label>
+                <input type="radio" ng-model="services.enableTurn" value="1"> {{ 'app.turn.enable' | tr }}
+              </label>
+            </div>
+
+            <div class="radio">
+              <label>
+                <input type="radio" ng-model="services.enableTurn" value="0"> {{ 'app.turn.disable' | tr }}
+              </label>
+            </div>
+          </div>
+
+          <div class="col-md-12 text-right">
+            <br/>
+            <button class="btn btn-outline btn-primary pull-right" ng-click="services.submitTurn()" ng-disabled="app.enableTurn === services.enableTurn || services.busy || app.error || app.taskId" tooltip-enable="app.error || app.taskId" uib-tooltip="{{ app.error ? 'App is in error state' : 'App is busy' }}">
+              <i class="fa fa-circle-notch fa-spin" ng-show="services.busy"></i> {{ 'main.saveAction' | tr }}
+            </button>
+          </div>
+        </div>
+
+        <hr ng-show="app.manifest.addons.turn.optional && app.manifest.addons.redis.optional">
+
+        <div class="row" ng-show="app.manifest.addons.redis.optional">
+          <div class="col-md-12">
+            <label class="control-label">{{ 'app.redis.title' | tr }} <sup><a ng-href="https://docs.cloudron.io/apps/#redis" class="help" target="_blank"><i class="fa fa-question-circle"></i></a></sup></label>
+
+            <div class="radio">
+              <label>
+                <input type="radio" ng-model="services.enableRedis" value="1"> {{ 'app.redis.enable' | tr }}
+              </label>
+            </div>
+
+            <div class="radio">
+              <label>
+                <input type="radio" ng-model="services.enableRedis" value="0"> {{ 'app.redis.disable' | tr }}
+              </label>
+            </div>
+          </div>
+
+          <div class="col-md-12 text-right">
+            <br/>
+            <button class="btn btn-outline btn-primary pull-right" ng-click="services.submitRedis()" ng-disabled="app.enablRedis === services.enableRedis || services.busy || app.error || app.taskId" tooltip-enable="app.error || app.taskId" uib-tooltip="{{ app.error ? 'App is in error state' : 'App is busy' }}">
+              <i class="fa fa-circle-notch fa-spin" ng-show="services.busy"></i> {{ 'main.saveAction' | tr }}
+            </button>
+          </div>
+        </div>
+
+      </div>
+
       <div class="card" ng-show="view === 'storage'">
         <div class="row">
           <div class="col-md-12">
@@ -973,6 +1034,7 @@
             <p ng-bind-html="'app.storage.appdata.description' | tr:{ storagePath: ('/home/yellowtent/appsdata/' + app.id) }"></p>
             <form role="form" name="storageDataDirForm" ng-submit="storage.submitDataDir()" autocomplete="off">
               <select class="form-control" ng-model="storage.location" ng-options="location.displayName for location in storage.locationOptions track by location.id"></select>
+              <p class="text-warning" ng-show="storage.location.type === 'volume' && storage.location.mountType === 'mountpoint'" ng-bind-html="'app.storage.appdata.mountTypeWarning' | tr"></p>
 
               <br/>
 
@@ -985,6 +1047,7 @@
               <input class="ng-hide" type="submit" ng-disabled="!storageDataDirForm.$dirty || storageDataDirForm.$invalid || storage.busyDataDir || app.error || app.taskId"/>
             </form>
           </div>
+
         </div>
         <div class="row">
           <div class="col-md-12 text-right">
@@ -1021,6 +1084,7 @@
                   </select>
                 </td>
                 <td class="text-right no-wrap" style="vertical-align: middle">
+                  <a class="btn btn-xs btn-default" ng-href="{{ '/frontend/filemanager.html#/home/volume/' + mount.volume.id }}" target="_blank" uib-tooltip="{{ 'volumes.openFileManagerActionTooltip' | tr }}"><i class="fas fa-folder"></i></a>
                   <button class="btn btn-danger btn-xs" ng-click="storage.delMount($event, $index)"><i class="far fa-trash-alt"></i></button>
                 </td>
               </tr>

dashboard/src/views/app.js

@@ -10,7 +10,7 @@
 /* global Clipboard */
 /* global SECRET_PLACEHOLDER */
 /* global APP_TYPES, STORAGE_PROVIDERS, BACKUP_FORMATS */
-/* global REGIONS_S3, REGIONS_WASABI, REGIONS_DIGITALOCEAN, REGIONS_EXOSCALE, REGIONS_SCALEWAY, REGIONS_LINODE, REGIONS_OVH, REGIONS_IONOS, REGIONS_UPCLOUD, REGIONS_VULTR  */
+/* global REGIONS_S3, REGIONS_WASABI, REGIONS_DIGITALOCEAN, REGIONS_EXOSCALE, REGIONS_SCALEWAY, REGIONS_LINODE, REGIONS_OVH, REGIONS_IONOS, REGIONS_UPCLOUD, REGIONS_VULTR, REGIONS_CONTABO  */
 
 angular.module('Application').controller('AppController', ['$scope', '$location', '$translate', '$timeout', '$interval', '$route', '$routeParams', 'Client', function ($scope, $location, $translate, $timeout, $interval, $route, $routeParams, Client) {
     $scope.s3Regions = REGIONS_S3;
@@ -23,6 +23,7 @@ angular.module('Application').controller('AppController', ['$scope', '$location'
     $scope.ionosRegions = REGIONS_IONOS;
     $scope.upcloudRegions = REGIONS_UPCLOUD;
     $scope.vultrRegions = REGIONS_VULTR;
+    $scope.contaboRegions = REGIONS_VULTR;
 
     $scope.storageProviders = STORAGE_PROVIDERS;
 
@@ -435,7 +436,7 @@ angular.module('Application').controller('AppController', ['$scope', '$location'
 
             $scope.access.error = {};
             $scope.access.ftp = app.manifest.addons.localstorage && app.manifest.addons.localstorage.ftp;
-            $scope.access.ssoAuth = (app.manifest.addons['ldap'] || app.manifest.addons['proxyAuth']) && app.sso;
+            $scope.access.ssoAuth = (app.manifest.addons['ldap'] || app.manifest.addons['oidc'] || app.manifest.addons['proxyAuth']) && app.sso;
             $scope.access.accessRestrictionOption = app.accessRestriction ? 'groups' : 'any';
             $scope.access.accessRestrictionOptionCur = app.accessRestriction ? 'groups' : 'any';
             $scope.access.accessRestriction = { users: [], groups: [] };
@@ -585,6 +586,54 @@ angular.module('Application').controller('AppController', ['$scope', '$location'
         },
     };
 
+    $scope.services = {
+        error: {},
+
+        busy: false,
+        enableTurn: '1', // curse of radio buttons
+        enableRedis: '1',
+
+        show: function () {
+            var app = $scope.app;
+
+            $scope.services.error = {};
+            $scope.services.enableTurn = app.enableTurn ? '1' : '0';
+            $scope.services.enableRedis = app.enableRedis ? '1' : '0';
+        },
+
+        submitTurn: function () {
+            $scope.services.busy = true;
+            $scope.services.error = {};
+
+            Client.configureApp($scope.app.id, 'turn', { enable: $scope.services.enableTurn === '1' }, function (error) {
+                if (error && error.statusCode === 400) {
+                    $scope.services.busy = false;
+                    $scope.services.error.turn = true;
+                    return;
+                }
+                if (error) return Client.error(error);
+
+                $timeout(function () { $scope.services.busy = false; }, 1000);
+            });
+        },
+
+        submitRedis: function () {
+            $scope.services.busy = true;
+            $scope.services.error = {};
+
+            Client.configureApp($scope.app.id, 'redis', { enable: $scope.services.enableRedis === '1' }, function (error) {
+                if (error && error.statusCode === 400) {
+                    $scope.services.busy = false;
+                    $scope.services.error.redis = true;
+                    return;
+                }
+                if (error) return Client.error(error);
+
+                $timeout(function () { $scope.services.busy = false; }, 1000);
+            });
+        },
+    };
+
     $scope.storage = {
         error: {},
 
@@ -613,7 +662,7 @@ angular.module('Application').controller('AppController', ['$scope', '$location'
             ];
 
             $scope.volumes.forEach(function (volume) {
-                $scope.storage.locationOptions.push({ id: volume.id, type: 'volume', value: volume.id, displayName: 'Volume - ' + volume.name });
+                $scope.storage.locationOptions.push({ id: volume.id, type: 'volume', value: volume.id, displayName: 'Volume - ' + volume.name, mountType: volume.mountType });
             });
 
             $scope.storage.location = $scope.storage.locationOptions.find(function (l) { return l.id === (app.storageVolumeId || 'default'); });
@@ -1259,7 +1308,8 @@ angular.module('Application').controller('AppController', ['$scope', '$location'
                || provider === 'exoscale-sos' || provider === 'digitalocean-spaces'
                || provider === 'scaleway-objectstorage' || provider === 'wasabi' || provider === 'backblaze-b2' || provider === 'cloudflare-r2'
                || provider === 'linode-objectstorage' || provider === 'ovh-objectstorage' || provider === 'ionos-objectstorage'
-               || provider === 'vultr-objectstorage' || provider === 'upcloud-objectstorage' || provider === 'idrive-e2';
+               || provider === 'vultr-objectstorage' || provider === 'upcloud-objectstorage' || provider === 'idrive-e2'
+               || provider === 'contabo-objectstorage';
     };
 
     $scope.mountlike = function (provider) {
@@ -1357,6 +1407,10 @@ angular.module('Application').controller('AppController', ['$scope', '$location'
                 } else if (backupConfig.provider === 'vultr-objectstorage') {
                     backupConfig.region = $scope.vultrRegions.find(function (x) { return x.value === $scope.importBackup.endpoint; }).region;
                     backupConfig.signatureVersion = 'v4';
+                } else if (backupConfig.provider === 'contabo-objectstorage') {
+                    backupConfig.region = $scope.contaboRegions.find(function (x) { return x.value === $scope.importBackup.endpoint; }).region;
+                    backupConfig.signatureVersion = 'v4';
+                    backupConfig.s3ForcePathStyle = true; // https://docs.contabo.com/docs/products/Object-Storage/technical-description (no virtual buckets)
                 } else if (backupConfig.provider === 'upcloud-objectstorage') {
                     var m = /^.*\.(.*)\.upcloudobjects.com$/.exec(backupConfig.endpoint);
                     backupConfig.region = m ? m[1] : 'us-east-1'; // let it fail in validation phase if m is not valid

dashboard/src/views/apps.js

@@ -187,21 +187,19 @@ angular.module('Application').controller('AppsController', ['$scope', '$translat
                 accessRestriction.groups = $scope.applinksEdit.accessRestriction.groups.map(function (g) { return g.id; });
             }
 
-            var icon;
-            if ($scope.applinksEdit.icon.data === '__original__') { // user reset the icon
-                icon = '';
-            } else if ($scope.applinksEdit.icon.data) { // user loaded custom icon
-                icon = $scope.applinksEdit.icon.data.replace(/^data:image\/[a-z]+;base64,/, '');
-            }
-
             var data = {
                 upstreamUri: $scope.applinksEdit.upstreamUri,
                 label: $scope.applinksEdit.label,
                 accessRestriction: accessRestriction,
-                icon: icon,
                 tags: $scope.applinksEdit.tags.split(' ').map(function (t) { return t.trim(); }).filter(function (t) { return !!t; })
             };
 
+            if ($scope.applinksEdit.icon.data === '__original__') { // user reset the icon
+                data.icon = '';
+            } else if ($scope.applinksEdit.icon.data) { // user loaded custom icon
+                data.icon = $scope.applinksEdit.icon.data.replace(/^data:image\/[a-z]+;base64,/, '');
+            }
+
             Client.updateApplink($scope.applinksEdit.id, data, function (error) {
                 $scope.applinksEdit.busyEdit = false;
 

dashboard/src/views/appstore.js

@@ -25,7 +25,6 @@ angular.module('Application').controller('AppStoreController', ['$scope', '$tran
     $scope.cachedCategory = ''; // used to cache the selected category while searching
     $scope.searchString = '';
     $scope.validSubscription = false;
-    $scope.unstableApps = false;
     $scope.subscription = {};
     $scope.memory = null; // { memory, swap }
 
@@ -45,6 +44,7 @@ angular.module('Application').controller('AppStoreController', ['$scope', '$tran
     // If new categories added make sure the translation below exists
     $scope.categories = [
         { id: 'analytics', icon: 'fa fa-chart-line', label: 'Analytics'},
+        { id: 'automation', icon: 'fa fa-robot', label: 'Automation'},
         { id: 'blog', icon: 'fa fa-font', label: 'Blog'},
         { id: 'chat', icon: 'fa fa-comments', label: 'Chat'},
         { id: 'crm', icon: 'fab fa-connectdevelop', label: 'CRM'},
@@ -223,7 +223,7 @@ angular.module('Application').controller('AppStoreController', ['$scope', '$tran
 
             var manifest = app.manifest;
             $scope.appInstall.optionalSso = !!manifest.optionalSso;
-            $scope.appInstall.customAuth = !(manifest.addons['ldap'] || manifest.addons['proxyAuth']);
+            $scope.appInstall.customAuth = !(manifest.addons['ldap'] || manifest.addons['oidc'] || manifest.addons['proxyAuth']);
 
             $scope.appInstall.accessRestrictionOption = $scope.groups.length ? '' : 'any'; // make the user select an ACL conciously if groups are used
             $scope.appInstall.accessRestriction = { users: [], groups: [] };

dashboard/src/views/backups.html

@@ -101,47 +101,47 @@
       <div class="modal-body">{{ 'backups.cleanupBackups.description' | tr }}</div>
       <div class="modal-footer">
         <button type="button" class="btn btn-default" data-dismiss="modal">{{ 'main.dialog.cancel' | tr }}</button>
-        <button type="submit" class="btn btn-outline btn-success pull-right" ng-click="createBackup.startCleanup()">{{ 'backups.cleanupBackups.cleanupNow' | tr }}</button>
+        <button type="submit" class="btn btn-outline btn-success pull-right" ng-click="cleanupBackups.start()">{{ 'backups.cleanupBackups.cleanupNow' | tr }}</button>
       </div>
     </div>
   </div>
 </div>
 
-<!-- modal backup config -->
-<div class="modal fade" id="configureScheduleAndRetentionModal" tabindex="-1" role="dialog">
+<!-- modal backup schedule config -->
+<div class="modal fade" id="backupPolicyModal" tabindex="-1" role="dialog">
   <div class="modal-dialog">
     <div class="modal-content">
       <div class="modal-header">
         <h4 class="modal-title">{{ 'backups.configureBackupSchedule.title' | tr }}</h4>
       </div>
       <div class="modal-body">
-        <form name="configureScheduleAndRetentionForm" role="form" novalidate ng-submit="configureScheduleAndRetention.submit()" autocomplete="off">
-          <p class="has-error text-center" ng-show="configureScheduleAndRetention.error">{{ configureScheduleAndRetention.error.generic }}</p>
+        <form name="backupPolicyForm" role="form" novalidate ng-submit="backupPolicy.submit()" autocomplete="off">
+          <p class="has-error text-center" ng-show="backupPolicy.error">{{ backupPolicy.error.generic }}</p>
 
           <div class="form-group">
             <label class="control-label" for="backupSchedule">{{ 'backups.configureBackupSchedule.schedule' | tr }}</label>
             <p ng-bind-html="'backups.configureBackupSchedule.scheduleDescription' | tr"></p>
 
             <div class="row" style="margin-left: 20px;">
-              <div class="col-md-5" ng-class="{ 'has-error': !configureScheduleAndRetention.days.length }">
-                {{ 'backups.configureBackupSchedule.days' | tr }}: <multiselect id="backupSchedule" class="input-sm stretch" ng-model="configureScheduleAndRetention.days" options="a.name for a in cronDays" data-multiple="true" ng-required></multiselect>
+              <div class="col-md-5" ng-class="{ 'has-error': !backupPolicy.days.length }">
+                {{ 'backups.configureBackupSchedule.days' | tr }}: <multiselect id="backupSchedule" class="input-sm stretch" ng-model="backupPolicy.days" options="a.name for a in cronDays" data-multiple="true" ng-required></multiselect>
               </div>
 
-              <div class="col-md-5" ng-class="{ 'has-error': !configureScheduleAndRetention.hours.length }">
-                {{ 'backups.configureBackupSchedule.hours' | tr }}: <multiselect class="input-sm stretch" ng-model="configureScheduleAndRetention.hours" options="a.name for a in cronHours" data-multiple="true"></multiselect>
+              <div class="col-md-5" ng-class="{ 'has-error': !backupPolicy.hours.length }">
+                {{ 'backups.configureBackupSchedule.hours' | tr }}: <multiselect class="input-sm stretch" ng-model="backupPolicy.hours" options="a.name for a in cronHours" data-multiple="true"></multiselect>
               </div>
             </div>
           </div>
 
           <div class="form-group">
             <label class="control-label" for="backupRetention">{{ 'backups.configureBackupSchedule.retentionPolicy' | tr }}</label>
-            <select class="form-control" id="backupRetention" ng-model="configureScheduleAndRetention.retentionPolicy" ng-options="a.value as a.name for a in retentionPolicies"></select>
+            <select class="form-control" id="backupRetention" ng-model="backupPolicy.retention" ng-options="a.value as a.name for a in backupRetentions"></select>
           </div>
         </form>
       </div>
       <div class="modal-footer ">
         <button type="button" class="btn btn-default" data-dismiss="modal">{{ 'main.dialog.cancel' | tr }}</button>
-        <button type="submit" class="btn btn-outline btn-success pull-right" ng-click="configureScheduleAndRetention.submit()" ng-disabled="!configureScheduleAndRetention.valid() || configureScheduleAndRetention.busy"><i class="fa fa-circle-notch fa-spin" ng-show="configureScheduleAndRetention.busy"></i><span> {{ 'main.dialog.save' | tr }}</span></button>
+        <button type="submit" class="btn btn-outline btn-success pull-right" ng-click="backupPolicy.submit()" ng-disabled="!backupPolicy.valid() || backupPolicy.busy"><i class="fa fa-circle-notch fa-spin" ng-show="backupPolicy.busy"></i><span> {{ 'main.dialog.save' | tr }}</span></button>
       </div>
     </div>
   </div>
@@ -207,10 +207,16 @@
             <input type="password" class="form-control" ng-model="configureBackup.mountOptions.password" id="configureBackupPassword" name="cifsPassword" ng-disabled="configureBackup.busy" password-reveal>
           </div>
 
-          <!-- EXT4 -->
-          <div class="form-group" ng-class="{ 'has-error': configureBackup.error.diskPath || !configureBackup.mountOptions.diskPath }" ng-show="configureBackup.provider === 'ext4' || configureBackup.provider === 'xfs'">
+          <!-- EXT4/XFS -->
+          <div class="form-group" ng-class="{ 'has-error': configureBackup.error.diskPath || !configureBackup.mountOptions.diskPath }" ng-show="configureBackup.provider === 'xfs' || configureBackup.provider === 'ext4'">
             <label class="control-label" for="inputConfigureDiskPath">{{ 'backups.configureBackupStorage.diskPath' | tr }}</label>
-            <input type="text" class="form-control" ng-model="configureBackup.mountOptions.diskPath" id="inputConfigureDiskPath" name="diskPath" ng-disabled="configureBackup.busy" placeholder="/dev/disk/by-uuid/uuid" ng-required="configureBackup.provider === 'ext4' || configureBackup.provider === 'xfs'">
+            <input type="text" class="form-control" ng-model="configureBackup.mountOptions.diskPath" id="inputConfigureDiskPath" name="diskPath" ng-disabled="configureBackup.busy" placeholder="/dev/disk/by-uuid/uuid" ng-required="configureBackup.provider === 'xfs' || configureBackup.provider === 'ext4'">
+          </div>
+
+          <!-- Disk -->
+          <div class="form-group" ng-class="{ 'has-error': configureBackup.error.diskPath || !configureBackup.mountOptions.diskPath }" ng-show="configureBackup.provider === 'disk'">
+            <label class="control-label">{{ 'backups.configureBackupStorage.diskPath' | tr }}</label>
+            <select class="form-control" ng-model="configureBackup.disk" ng-options="item as item.label for item in configureBackup.blockDevices track by item.path" ng-required="configureBackup.provider === 'disk'"></select>
           </div>
 
           <!-- SSHFS -->
@@ -325,6 +331,11 @@
             <select class="form-control" name="region" id="inputConfigureBackupVultrRegion" ng-model="configureBackup.endpoint" ng-options="a.value as a.name for a in vultrRegions" ng-disabled="configureBackup.busy" ng-required="configureBackup.provider === 'vultr-objectstorage'"></select>
           </div>
 
+          <div class="form-group" ng-class="{ 'has-error': configureBackup.error.region }" ng-show="configureBackup.provider === 'contabo-objectstorage'">
+            <label class="control-label" for="inputConfigureBackupContaboRegion">{{ 'backups.configureBackupStorage.region' | tr }}</label>
+            <select class="form-control" name="region" id="inputConfigureBackupContaboRegion" ng-model="configureBackup.endpoint" ng-options="a.value as a.name for a in contaboRegions" ng-disabled="configureBackup.busy" ng-required="configureBackup.provider === 'contabo-objectstorage'"></select>
+          </div>
+
           <div class="form-group" ng-class="{ 'has-error': configureBackup.error.accessKeyId }" ng-show="s3like(configureBackup.provider)">
             <label class="control-label" for="inputConfigureBackupAccessKeyId">{{ 'backups.configureBackupStorage.s3AccessKeyId' | tr }}</label>
             <input type="text" class="form-control" ng-model="configureBackup.accessKeyId" id="inputConfigureBackupAccessKeyId" name="accessKeyId" ng-disabled="configureBackup.busy" ng-required="s3like(configureBackup.provider)">
@@ -468,8 +479,8 @@
       <div class="col-xs-6 text-right no-wrap">
         <span ng-show="backupConfig.provider === 'filesystem'">{{ backupConfig.backupFolder }}</span>
         <span ng-show="mountlike(backupConfig.provider)">
-          <i class="fa fa-circle" ng-style="{ color: backupConfig.mountStatus.state === 'active' ? '#27CE65' : '#d9534f' }" ng-show="backupConfig.mountStatus" uib-tooltip="{{ backupConfig.mountStatus.message }}"></i>
-          <span ng-show="backupConfig.provider === 'filesystem' || backupConfig.provider === 'ext4' || backupConfig.provider === 'xfs' || backupConfig.provider === 'mountpoint'">{{ backupConfig.mountOptions.diskPath || backupConfig.mountPoint }}{{ (backupConfig.prefix ? '/' : '') + backupConfig.prefix }}</span>
+          <i class="fa fa-circle" ng-style="{ color: mountStatus.state === 'active' ? '#27CE65' : '#d9534f' }" ng-show="mountStatus" uib-tooltip="{{ mountStatus.message }}"></i>
+          <span ng-show="backupConfig.provider === 'disk' || backupConfig.provider === 'filesystem' || backupConfig.provider === 'ext4' || backupConfig.provider === 'xfs' || backupConfig.provider === 'mountpoint'">{{ backupConfig.mountOptions.diskPath || backupConfig.mountPoint }}{{ (backupConfig.prefix ? '/' : '') + backupConfig.prefix }}</span>
           <span ng-show="backupConfig.provider === 'cifs' || backupConfig.provider === 'nfs' || backupConfig.provider === 'sshfs'">{{ backupConfig.mountOptions.host }}:{{ backupConfig.mountOptions.remoteDir }}{{ (backupConfig.prefix ? '/' : '') + backupConfig.prefix }}</span>
         </span>
 
@@ -507,8 +518,23 @@
     </div>
   </div>
 
-  <div class="text-left">
-    <h3>{{ 'backups.schedule.title' | tr }}</h3>
+  <div class="text-left section-header">
+    <h3>
+      {{ 'backups.schedule.title' | tr }}
+      <!-- <a class="btn btn-sm btn-default pull-right" ng-href="/frontend/logs.html?taskId={{cleanupBackups.taskId}}" target="_blank" uib-tooltip="{{ 'backups.logs.showLogs' | tr }}"><i class="fas fa-align-left"></i></a> -->
+      <div class="btn-group btn-group-sm pull-right">
+        <button type="button" class="btn btn-small btn-default dropdown-toggle" ng-show="cleanupTasks.length" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" uib-tooltip="{{ 'backups.logs.showLogs' | tr }}">
+          <i class="fas fa-align-left"></i> <span class="caret"></span>
+        </button>
+        <ul class="dropdown-menu">
+          <li ng-repeat="task in cleanupTasks">
+            <a ng-href="/frontend/logs.html?taskId={{task.id}}" target="_blank" class="text-right">
+            {{ task.ts | prettyLongDate }} <i class="fa" style="margin-left: 20px" ng-class="{ 'status-active fa-check-circle': !task.active && task.success, 'fa-circle-notch fa-spin': task.active, 'status-error fa-times-circle': !task.active && !task.success }"></i>
+            </a>
+          </li>
+        </ul>
+      </div>
+    </h3>
   </div>
 
   <div class="card" style="margin-bottom: 15px;">
@@ -518,7 +544,7 @@
         <span class="text-muted">{{ 'backups.schedule.schedule' | tr }}</span>
       </div>
       <div class="col-xs-6 text-right">
-        <span>{{ prettyBackupSchedule(backupConfig.schedulePattern) }}</span>
+        <span>{{ prettyBackupSchedule(backupPolicy.currentPolicy.schedule) }}</span>
       </div>
     </div>
     <div class="row">
@@ -526,19 +552,34 @@
         <span class="text-muted">{{ 'backups.schedule.retentionPolicy' | tr }}</span>
       </div>
       <div class="col-xs-6 text-right">
-        <span>{{ prettyBackupRetentionPolicy(backupConfig.retentionPolicy) }}</span>
+        <span>{{ prettyBackupRetention(backupPolicy.currentPolicy.retention) }}</span>
       </div>
     </div>
     <br/>
     <div class="row">
       <div class="col-md-12 text-right">
-        <button class="btn btn-outline btn-primary pull-right" ng-show="user.isAtLeastOwner" ng-click="configureScheduleAndRetention.show()">{{ 'backups.schedule.configure' | tr }}</button>
+        <button class="btn btn-default" ng-click="cleanupBackups.ask()" ng-disabled="cleanupBackups.busy" style="margin-right: 5px"><i class="fa fa-circle-notch fa-spin" ng-show="cleanupBackups.busy"></i> {{ 'backups.listing.cleanupBackups' | tr }}</button>
+        <button class="btn btn-outline btn-primary pull-right" ng-show="user.isAtLeastOwner" ng-click="backupPolicy.show()">{{ 'backups.schedule.configure' | tr }}</button>
       </div>
     </div>
   </div>
 
-  <div class="text-left">
-    <h3>{{ 'backups.listing.title' | tr }}</h3>
+  <div class="text-left section-header">
+    <h3>
+      {{ 'backups.listing.title' | tr }}
+      <div class="btn-group btn-group-sm pull-right">
+        <button type="button" class="btn btn-small btn-default dropdown-toggle" ng-show="backupTasks.length" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" uib-tooltip="{{ 'backups.logs.showLogs' | tr }}">
+          <i class="fas fa-align-left"></i> <span class="caret"></span>
+        </button>
+        <ul class="dropdown-menu">
+          <li ng-repeat="task in backupTasks">
+            <a ng-href="/frontend/logs.html?taskId={{task.id}}" target="_blank" class="text-right">
+            {{ task.ts | prettyLongDate }} <i class="fa" style="margin-left: 20px" ng-class="{ 'status-active fa-check-circle': !task.active && task.success, 'fa-circle-notch fa-spin': task.active, 'status-error fa-times-circle': !task.active && !task.success }"></i>
+            </a>
+          </li>
+        </ul>
+      </div>
+    </h3>
   </div>
 
   <div class="card card-large">
@@ -594,23 +635,9 @@
 
     <div class="row">
       <div class="col-md-12 text-right">
-        <button class="btn btn-default" ng-click="createBackup.cleanupBackups()" ng-show="!createBackup.busy" style="margin-right: 5px">{{ 'backups.listing.cleanupBackups' | tr }}</button>
         <button class="btn btn-outline btn-primary" ng-click="createBackup.startBackup()" ng-show="!createBackup.busy">{{ 'backups.listing.backupNow' | tr }}</button>
         <button class="btn btn-outline btn-danger" ng-click="createBackup.stopTask()" ng-show="createBackup.busy">{{ 'backups.listing.stopTask' | tr:{ taskType: createBackup.taskType } }}</button>
       </div>
     </div>
   </div>
-
-  <div class="text-left">
-    <h3>{{ 'backups.logs.title' | tr }}</h3>
-  </div>
-
-  <div class="card card-large" style="margin-bottom: 15px;">
-    <div class="row">
-      <div class="col-md-12">
-        <p>{{ 'backups.logs.description' | tr }}</p>
-        <a class="btn btn-primary pull-right" ng-href="/logs.html?taskId={{createBackup.taskId}}" ng-disabled="!createBackup.taskId" target="_blank">{{ 'backups.logs.showLogs' | tr }}</a>
-      </div>
-    </div>
-  </div>
 </div>

dashboard/src/views/backups.js

@@ -1,7 +1,7 @@
 'use strict';
 
 /* global $, angular, TASK_TYPES, SECRET_PLACEHOLDER, STORAGE_PROVIDERS, BACKUP_FORMATS, APP_TYPES */
-/* global REGIONS_S3, REGIONS_WASABI, REGIONS_DIGITALOCEAN, REGIONS_EXOSCALE, REGIONS_SCALEWAY, REGIONS_LINODE, REGIONS_OVH, REGIONS_IONOS, REGIONS_UPCLOUD, REGIONS_VULTR  */
+/* global REGIONS_S3, REGIONS_WASABI, REGIONS_DIGITALOCEAN, REGIONS_EXOSCALE, REGIONS_SCALEWAY, REGIONS_LINODE, REGIONS_OVH, REGIONS_IONOS, REGIONS_UPCLOUD, REGIONS_VULTR , REGIONS_CONTABO */
 
 angular.module('Application').controller('BackupsController', ['$scope', '$location', '$rootScope', '$timeout', 'Client', function ($scope, $location, $rootScope, $timeout, Client) {
     Client.onReady(function () { if (!Client.getUserInfo().isAtLeastAdmin) $location.path('/'); });
@@ -12,11 +12,13 @@ angular.module('Application').controller('BackupsController', ['$scope', '$locat
     $scope.config = Client.getConfig();
     $scope.user = Client.getUserInfo();
     $scope.memory = null; // { memory, swap }
-
+    $scope.mountStatus = null; // { state, message }
     $scope.manualBackupApps = [];
 
     $scope.backupConfig = {};
     $scope.backups = [];
+    $scope.backupTasks = [];
+    $scope.cleanupTasks = [];
 
     $scope.s3Regions = REGIONS_S3;
     $scope.wasabiRegions = REGIONS_WASABI;
@@ -28,12 +30,13 @@ angular.module('Application').controller('BackupsController', ['$scope', '$locat
     $scope.ionosRegions = REGIONS_IONOS;
     $scope.upcloudRegions = REGIONS_UPCLOUD;
     $scope.vultrRegions = REGIONS_VULTR;
+    $scope.contaboRegions = REGIONS_CONTABO;
 
     $scope.storageProviders = STORAGE_PROVIDERS.concat([
         { name: 'No-op (Only for testing)', value: 'noop' }
     ]);
 
-    $scope.retentionPolicies = [
+    $scope.backupRetentions = [
         { name: '2 days', value: { keepWithinSecs: 2 * 24 * 60 * 60 }},
         { name: '1 week', value: { keepWithinSecs: 7 * 24 * 60 * 60 }}, // default
         { name: '1 month', value: { keepWithinSecs: 30 * 24 * 60 * 60 }},
@@ -83,8 +86,8 @@ angular.module('Application').controller('BackupsController', ['$scope', '$locat
         return prettyDay + ' at ' + prettyHour;
     };
 
-    $scope.prettyBackupRetentionPolicy = function (retentionPolicy) {
-        var tmp = $scope.retentionPolicies.find(function (p) { return angular.equals(p.value, retentionPolicy); });
+    $scope.prettyBackupRetention = function (retention) {
+        var tmp = $scope.backupRetentions.find(function (p) { return angular.equals(p.value, retention); });
         return tmp ? tmp.name : '';
     };
 
@@ -119,11 +122,9 @@ angular.module('Application').controller('BackupsController', ['$scope', '$locat
         message: '',
         errorMessage: '',
         taskId: '',
-        taskType: TASK_TYPES.TASK_BACKUP,
 
-        checkStatus: function () {
-            // TODO support both task types TASK_BACKUP and TASK_CLEAN_BACKUPS
-            Client.getLatestTaskByType($scope.createBackup.taskType, function (error, task) {
+        init: function () {
+            Client.getLatestTaskByType(TASK_TYPES.TASK_BACKUP, function (error, task) {
                 if (error) return console.error(error);
 
                 if (!task) return;
@@ -143,6 +144,8 @@ angular.module('Application').controller('BackupsController', ['$scope', '$locat
                     $scope.createBackup.percent = 100; // indicates that 'result' is valid
                     $scope.createBackup.errorMessage = data.success ? '' : data.error.message;
 
+                    getBackupTasks();
+
                     return fetchBackups();
                 }
 
@@ -158,7 +161,6 @@ angular.module('Application').controller('BackupsController', ['$scope', '$locat
             $scope.createBackup.percent = 0;
             $scope.createBackup.message = '';
             $scope.createBackup.errorMessage = '';
-            $scope.createBackup.taskType = TASK_TYPES.TASK_BACKUP;
 
             Client.startBackup(function (error, taskId) {
                 if (error) {
@@ -177,32 +179,14 @@ angular.module('Application').controller('BackupsController', ['$scope', '$locat
                     return;
                 }
 
-                $scope.createBackup.taskId = taskId;
-                $scope.createBackup.updateStatus();
-            });
-        },
-
-        cleanupBackups: function () {
-            $('#cleanupBackupsModal').modal('show');
-        },
-
-        startCleanup: function () {
-            $scope.createBackup.busy = true;
-            $scope.createBackup.percent = 0;
-            $scope.createBackup.message = '';
-            $scope.createBackup.errorMessage = '';
-            $scope.createBackup.taskType = TASK_TYPES.TASK_CLEAN_BACKUPS;
-
-            $('#cleanupBackupsModal').modal('hide');
-
-            Client.cleanupBackups(function (error, taskId) {
-                if (error) console.error(error);
+                getBackupTasks();
 
                 $scope.createBackup.taskId = taskId;
                 $scope.createBackup.updateStatus();
             });
         },
 
+
         stopTask: function () {
             Client.stopTask($scope.createBackup.taskId, function (error) {
                 if (error) {
@@ -214,6 +198,7 @@ angular.module('Application').controller('BackupsController', ['$scope', '$locat
                     }
 
                     $scope.createBackup.busy = false;
+                    getBackupTasks();
 
                     return;
                 }
@@ -221,6 +206,62 @@ angular.module('Application').controller('BackupsController', ['$scope', '$locat
         }
     };
 
+    $scope.cleanupBackups = {
+        busy: false,
+        taskId: 0,
+
+        init: function () {
+            Client.getLatestTaskByType(TASK_TYPES.TASK_CLEAN_BACKUPS, function (error, task) {
+                if (error) return console.error(error);
+
+                if (!task) return;
+
+                $scope.cleanupBackups.taskId = task.id;
+                $scope.cleanupBackups.updateStatus();
+
+                getCleanupTasks();
+            });
+        },
+
+        updateStatus: function () {
+            Client.getTask($scope.cleanupBackups.taskId, function (error, data) {
+                if (error) return window.setTimeout($scope.cleanupBackups.updateStatus, 5000);
+
+                if (!data.active) {
+                    $scope.cleanupBackups.busy = false;
+
+                    getCleanupTasks();
+                    fetchBackups();
+
+                    return;
+                }
+
+                $scope.cleanupBackups.busy = true;
+                $scope.cleanupBackups.message = data.message;
+                window.setTimeout($scope.cleanupBackups.updateStatus, 3000);
+            });
+        },
+
+        ask: function () {
+            $('#cleanupBackupsModal').modal('show');
+        },
+
+        start: function () {
+            $scope.cleanupBackups.busy = true;
+
+            $('#cleanupBackupsModal').modal('hide');
+
+            Client.cleanupBackups(function (error, taskId) {
+                if (error) console.error(error);
+
+                $scope.cleanupBackups.taskId = taskId;
+                $scope.cleanupBackups.updateStatus();
+
+                getCleanupTasks();
+            });
+        }
+    };
+
     $scope.listBackups = {
     };
 
@@ -229,11 +270,12 @@ angular.module('Application').controller('BackupsController', ['$scope', '$locat
             || provider === 'exoscale-sos' || provider === 'digitalocean-spaces'
             || provider === 'scaleway-objectstorage' || provider === 'wasabi' || provider === 'backblaze-b2' || provider === 'cloudflare-r2'
             || provider === 'linode-objectstorage' || provider === 'ovh-objectstorage' || provider === 'ionos-objectstorage'
-            || provider === 'vultr-objectstorage' || provider === 'upcloud-objectstorage' || provider === 'idrive-e2';
+            || provider === 'vultr-objectstorage' || provider === 'upcloud-objectstorage' || provider === 'idrive-e2'
+            || provider === 'contabo-objectstorage';
     };
 
     $scope.mountlike = function (provider) {
-        return provider === 'sshfs' || provider === 'cifs' || provider === 'nfs' || provider === 'mountpoint' || provider === 'ext4' || provider === 'xfs';
+        return provider === 'sshfs' || provider === 'cifs' || provider === 'nfs' || provider === 'mountpoint' || provider === 'ext4' || provider === 'xfs' || provider === 'disk';
     };
 
     // https://stackoverflow.com/questions/3665115/how-to-create-a-file-in-memory-for-user-to-download-but-not-through-server#18197341
@@ -261,7 +303,7 @@ angular.module('Application').controller('BackupsController', ['$scope', '$locat
             if ($scope.backupConfig[k] !== SECRET_PLACEHOLDER) tmp[k] = $scope.backupConfig[k];
         });
 
-        var filename = 'cloudron-backup-config-' + (new Date()).toISOString().replace(/:|T/g,'-').replace(/\..*/,'') + '.json';
+        var filename = 'cloudron-backup-config-' + (new Date()).toISOString().replace(/:|T/g,'-').replace(/\..*/,'') + ' (' + $scope.config.adminFqdn + ')' + '.json';
         download(filename, JSON.stringify(tmp, null, 4));
     };
 
@@ -307,68 +349,76 @@ angular.module('Application').controller('BackupsController', ['$scope', '$locat
         }
     };
 
-    $scope.configureScheduleAndRetention = {
+    $scope.backupPolicy = {
         busy: false,
         error: {},
 
-        retentionPolicy:  $scope.retentionPolicies[0],
+        currentPolicy: null,
+
+        retention:  null,
         days: [],
         hours: [],
 
+        init: function () {
+            Client.getBackupPolicy(function (error, policy) {
+                if (error) Client.error(error);
+                $scope.backupPolicy.currentPolicy = policy;
+            });
+        },
+
         show: function () {
-            $scope.configureScheduleAndRetention.error = {};
-            $scope.configureScheduleAndRetention.busy = false;
+            $scope.backupPolicy.error = {};
+            $scope.backupPolicy.busy = false;
 
-            var selectedPolicy = $scope.retentionPolicies.find(function (x) { return angular.equals(x.value, $scope.backupConfig.retentionPolicy); });
-            if (!selectedPolicy) selectedPolicy = $scope.retentionPolicies[0];
+            var selectedRetention = $scope.backupRetentions.find(function (x) { return angular.equals(x.value, $scope.backupPolicy.currentPolicy.retention); });
+            if (!selectedRetention) selectedRetention = $scope.backupRetentions[0];
 
-            $scope.configureScheduleAndRetention.retentionPolicy = selectedPolicy.value;
+            $scope.backupPolicy.retention = selectedRetention.value;
 
-            var tmp = $scope.backupConfig.schedulePattern.split(' ');
+            var tmp = $scope.backupPolicy.currentPolicy.schedule.split(' ');
             var hours = tmp[2].split(','), days = tmp[5].split(',');
             if (days[0] === '*') {
-                $scope.configureScheduleAndRetention.days = angular.copy($scope.cronDays, []);
+                $scope.backupPolicy.days = angular.copy($scope.cronDays, []);
             } else {
-                $scope.configureScheduleAndRetention.days = days.map(function (day) { return $scope.cronDays[parseInt(day, 10)]; });
+                $scope.backupPolicy.days = days.map(function (day) { return $scope.cronDays[parseInt(day, 10)]; });
             }
-            $scope.configureScheduleAndRetention.hours = hours.map(function (hour) { return $scope.cronHours[parseInt(hour, 10)]; });
+            $scope.backupPolicy.hours = hours.map(function (hour) { return $scope.cronHours[parseInt(hour, 10)]; });
 
-            $('#configureScheduleAndRetentionModal').modal('show');
+            $('#backupPolicyModal').modal('show');
         },
 
         valid: function () {
-            return $scope.configureScheduleAndRetention.days.length && $scope.configureScheduleAndRetention.hours.length;
+            return $scope.backupPolicy.days.length && $scope.backupPolicy.hours.length;
         },
 
         submit: function () {
-            if (!$scope.configureScheduleAndRetention.days.length) return;
-            if (!$scope.configureScheduleAndRetention.hours.length) return;
+            if (!$scope.backupPolicy.days.length) return;
+            if (!$scope.backupPolicy.hours.length) return;
 
-            $scope.configureScheduleAndRetention.error = {};
-            $scope.configureScheduleAndRetention.busy = true;
-
-            // start with the full backupConfig since the api requires all fields
-            var backupConfig = $scope.backupConfig;
-            backupConfig.retentionPolicy = $scope.configureScheduleAndRetention.retentionPolicy;
+            $scope.backupPolicy.error = {};
+            $scope.backupPolicy.busy = true;
 
             var daysPattern;
-            if ($scope.configureScheduleAndRetention.days.length === 7) daysPattern = '*';
-            else daysPattern = $scope.configureScheduleAndRetention.days.map(function (d) { return d.value; });
+            if ($scope.backupPolicy.days.length === 7) daysPattern = '*';
+            else daysPattern = $scope.backupPolicy.days.map(function (d) { return d.value; });
 
             var hoursPattern;
-            if ($scope.configureScheduleAndRetention.hours.length === 24) hoursPattern = '*';
-            else hoursPattern = $scope.configureScheduleAndRetention.hours.map(function (d) { return d.value; });
+            if ($scope.backupPolicy.hours.length === 24) hoursPattern = '*';
+            else hoursPattern = $scope.backupPolicy.hours.map(function (d) { return d.value; });
 
-            backupConfig.schedulePattern ='00 00 ' + hoursPattern + ' * * ' + daysPattern;
+            var policy = {
+                retention: $scope.backupPolicy.retention,
+                schedule: '00 00 ' + hoursPattern + ' * * ' + daysPattern
+            };
 
-            Client.setBackupConfig(backupConfig, function (error) {
-                $scope.configureScheduleAndRetention.busy = false;
+            Client.setBackupPolicy(policy, function (error) {
+                $scope.backupPolicy.busy = false;
 
                 if (error) {
                     if (error.statusCode === 424) {
-                        $scope.configureScheduleAndRetention.error.generic = error.message;
+                        $scope.backupPolicy.error.generic = error.message;
                     } else if (error.statusCode === 400) {
-                        $scope.configureScheduleAndRetention.error.generic = error.message;
+                        $scope.backupPolicy.error.generic = error.message;
                     } else {
                         console.error('Unable to change schedule or retention.', error);
                     }
@@ -376,13 +426,18 @@ angular.module('Application').controller('BackupsController', ['$scope', '$locat
                     return;
                 }
 
-                $('#configureScheduleAndRetentionModal').modal('hide');
+                $('#backupPolicyModal').modal('hide');
 
-                getBackupConfig();
+                $scope.backupPolicy.init();
             });
         }
     };
 
+    $scope.$watch('configureBackup.disk', function (newValue) {
+        if (!newValue) return;
+        $scope.configureBackup.mountOptions.diskPath = '/dev/disk/by-uuid/' + newValue.uuid;
+    });
+
     $scope.configureBackup = {
         busy: false,
         error: {},
@@ -414,6 +469,8 @@ angular.module('Application').controller('BackupsController', ['$scope', '$locat
         downloadConcurrency: '',
         syncConcurrency: '', // sort of similar to upload
 
+        blockDevices: [],
+        disk: null,
         mountOptions: {
             host: '',
             remoteDir: '',
@@ -448,6 +505,7 @@ angular.module('Application').controller('BackupsController', ['$scope', '$locat
             $scope.configureBackup.syncConcurrency = $scope.configureBackup.provider === 's3' ? 20 : 10;
             $scope.configureBackup.copyConcurrency = $scope.configureBackup.provider === 's3' ? 500 : 10;
 
+            $scope.configureBackup.disk = null;
             $scope.configureBackup.mountOptions = { host: '', remoteDir: '', username: '', password: '', diskPath: '', seal: false, user: '', port: 22, privateKey: '' };
         },
 
@@ -482,12 +540,13 @@ angular.module('Application').controller('BackupsController', ['$scope', '$locat
             $scope.configureBackup.useHardlinks = !$scope.backupConfig.noHardlinks;
             $scope.configureBackup.chown = $scope.backupConfig.chown;
 
-            $scope.configureBackup.memoryLimit = $scope.backupConfig.memoryLimit;
+            var limits = $scope.backupConfig.limits || {};
+            $scope.configureBackup.memoryLimit = limits.memoryLimit;
 
-            $scope.configureBackup.uploadPartSize = $scope.backupConfig.uploadPartSize || ($scope.configureBackup.provider === 'scaleway-objectstorage' ? 100 * 1024 * 1024 : 10 * 1024 * 1024);
-            $scope.configureBackup.downloadConcurrency = $scope.backupConfig.downloadConcurrency || ($scope.backupConfig.provider === 's3' ? 30 : 10);
-            $scope.configureBackup.syncConcurrency = $scope.backupConfig.syncConcurrency || ($scope.backupConfig.provider === 's3' ? 20 : 10);
-            $scope.configureBackup.copyConcurrency = $scope.backupConfig.copyConcurrency || ($scope.backupConfig.provider === 's3' ? 500 : 10);
+            $scope.configureBackup.uploadPartSize = limits.uploadPartSize || ($scope.configureBackup.provider === 'scaleway-objectstorage' ? 100 * 1024 * 1024 : 10 * 1024 * 1024);
+            $scope.configureBackup.downloadConcurrency = limits.downloadConcurrency || ($scope.backupConfig.provider === 's3' ? 30 : 10);
+            $scope.configureBackup.syncConcurrency = limits.syncConcurrency || ($scope.backupConfig.provider === 's3' ? 20 : 10);
+            $scope.configureBackup.copyConcurrency = limits.copyConcurrency || ($scope.backupConfig.provider === 's3' ? 500 : 10);
 
             var totalMemory = Math.max(($scope.memory.memory + $scope.memory.swap) * 1.5, 2 * 1024 * 1024);
             $scope.configureBackup.memoryTicks = [ $scope.MIN_MEMORY_LIMIT ];
@@ -513,7 +572,28 @@ angular.module('Application').controller('BackupsController', ['$scope', '$locat
                 privateKey: mountOptions.privateKey || ''
             };
 
-            $('#configureBackupModal').modal('show');
+            Client.getBlockDevices(function (error, result) {
+                if (error) return console.error('Failed to list blockdevices:', error);
+
+                // only offer non /, /boot or /home disks
+                result = result.filter(function (d) { return d.mountpoint !== '/' && d.mountpoint !== '/home' && d.mountpoint !== '/boot'; });
+                // only offer xfs and ext4 disks
+                result = result.filter(function (d) { return d.type === 'xfs' || d.type === 'ext4'; });
+
+                // amend label for UI
+                result.forEach(function (d) {
+                    d.label = d.path;
+
+                    // pre-select current if set
+                    if (d.path === $scope.configureBackup.mountOptions.diskPath || ('/dev/disk/by-uuid/' + d.uuid) === $scope.configureBackup.mountOptions.diskPath) {
+                        $scope.configureBackup.disk = d;
+                    }
+                });
+
+                $scope.configureBackup.blockDevices = result;
+
+                $('#configureBackupModal').modal('show');
+            });
         },
 
         submit: function () {
@@ -523,10 +603,12 @@ angular.module('Application').controller('BackupsController', ['$scope', '$locat
             var backupConfig = {
                 provider: $scope.configureBackup.provider,
                 format: $scope.configureBackup.format,
-                memoryLimit: $scope.configureBackup.memoryLimit,
                 // required for api call to provide all fields
                 schedulePattern: $scope.backupConfig.schedulePattern,
-                retentionPolicy: $scope.backupConfig.retentionPolicy
+                retentionPolicy: $scope.backupConfig.retentionPolicy,
+                limits: {
+                    memoryLimit: $scope.configureBackup.memoryLimit,
+                },
             };
             if ($scope.configureBackup.password) {
                 backupConfig.password = $scope.configureBackup.password;
@@ -570,6 +652,10 @@ angular.module('Application').controller('BackupsController', ['$scope', '$locat
                 } else if (backupConfig.provider === 'vultr-objectstorage') {
                     backupConfig.region = $scope.vultrRegions.find(function (x) { return x.value === $scope.configureBackup.endpoint; }).region;
                     backupConfig.signatureVersion = 'v4';
+                } else if (backupConfig.provider === 'contabo-objectstorage') {
+                    backupConfig.region = $scope.contaboRegions.find(function (x) { return x.value === $scope.configureBackup.endpoint; }).region;
+                    backupConfig.signatureVersion = 'v4';
+                    backupConfig.s3ForcePathStyle = true; // https://docs.contabo.com/docs/products/Object-Storage/technical-description (no virtual buckets)
                 } else if (backupConfig.provider === 'upcloud-objectstorage') { // the UI sets region and endpoint
                     var m = /^.*\.(.*)\.upcloudobjects.com$/.exec(backupConfig.endpoint);
                     backupConfig.region = m ? m[1] : 'us-east-1'; // let it fail in validation phase if m is not valid
@@ -615,7 +701,7 @@ angular.module('Application').controller('BackupsController', ['$scope', '$locat
                         backupConfig.mountOptions.port = $scope.configureBackup.mountOptions.port;
                         backupConfig.mountOptions.privateKey = $scope.configureBackup.mountOptions.privateKey;
                     }
-                } else if (backupConfig.provider === 'ext4' || backupConfig.provider === 'xfs') {
+                } else if (backupConfig.provider === 'ext4' || backupConfig.provider === 'xfs' || backupConfig.provider === 'disk') {
                     backupConfig.mountOptions.diskPath = $scope.configureBackup.mountOptions.diskPath;
                 } else if (backupConfig.provider === 'mountpoint') {
                     backupConfig.mountPoint = $scope.configureBackup.mountPoint;
@@ -627,12 +713,12 @@ angular.module('Application').controller('BackupsController', ['$scope', '$locat
                 backupConfig.noHardlinks = !$scope.configureBackup.useHardlinks;
             }
 
-            backupConfig.uploadPartSize = $scope.configureBackup.uploadPartSize;
+            backupConfig.limits.uploadPartSize = $scope.configureBackup.uploadPartSize;
 
             if (backupConfig.format === 'rsync') {
-                backupConfig.downloadConcurrency = $scope.configureBackup.downloadConcurrency;
-                backupConfig.syncConcurrency = $scope.configureBackup.syncConcurrency;
-                backupConfig.copyConcurrency = $scope.configureBackup.copyConcurrency;
+                backupConfig.limits.downloadConcurrency = $scope.configureBackup.downloadConcurrency;
+                backupConfig.limits.syncConcurrency = $scope.configureBackup.syncConcurrency;
+                backupConfig.limits.copyConcurrency = $scope.configureBackup.copyConcurrency;
             }
 
             Client.setBackupConfig(backupConfig, function (error) {
@@ -727,6 +813,35 @@ angular.module('Application').controller('BackupsController', ['$scope', '$locat
             if (error) return console.error(error);
 
             $scope.backupConfig = backupConfig;
+            $scope.mountStatus = null;
+
+            if (!$scope.mountlike($scope.backupConfig.provider)) return;
+
+            Client.getBackupMountStatus(function (error, mountStatus) {
+                if (error) return console.error(error);
+
+                $scope.mountStatus = mountStatus;
+            });
+        });
+    }
+
+    function getBackupTasks() {
+        Client.getTasksByType(TASK_TYPES.TASK_BACKUP, function (error, tasks) {
+            if (error) return console.error(error);
+
+            if (!tasks.length) return;
+
+            $scope.backupTasks = tasks.slice(0, 10);
+        });
+    }
+
+    function getCleanupTasks() {
+        Client.getTasksByType(TASK_TYPES.TASK_CLEAN_BACKUPS, function (error, tasks) {
+            if (error) return console.error(error);
+
+            if (!tasks.length) return;
+
+            $scope.cleanupTasks = tasks.slice(0, 10);
         });
     }
 
@@ -742,7 +857,12 @@ angular.module('Application').controller('BackupsController', ['$scope', '$locat
             $scope.manualBackupApps = Client.getInstalledApps().filter(function (app) { return app.type !== APP_TYPES.LINK && !app.enableBackup; });
 
             // show backup status
-            $scope.createBackup.checkStatus();
+            $scope.createBackup.init();
+            $scope.cleanupBackups.init();
+            $scope.backupPolicy.init();
+
+            getBackupTasks();
+            getCleanupTasks();
         });
     });
 

dashboard/src/views/domains.html

@@ -109,6 +109,14 @@
           </div>
 
           <!-- Cloudflare -->
+          <div class="form-group" ng-class="{ 'has-error': false }" ng-show="domainConfigure.provider === 'cloudflare'">
+            <label class="control-label">{{ 'domains.domainDialog.cloudflareTokenType' | tr }}</label>
+            <select class="form-control" ng-model="domainConfigure.cloudflareTokenType">
+              <option value="GlobalApiKey">{{ 'domains.domainDialog.cloudflareTokenTypeGlobalApiKey' | tr }}</option>
+              <option value="ApiToken">{{ 'domains.domainDialog.cloudflareTokenTypeApiToken' | tr }}</option>
+            </select>
+          </div>
+
           <div class="form-group" ng-class="{ 'has-error': false }" ng-show="domainConfigure.provider === 'cloudflare'">
             <label class="control-label" ng-show="domainConfigure.cloudflareTokenType === 'GlobalApiKey'">{{ 'domains.domainDialog.cloudflareTokenTypeGlobalApiKey' | tr }}</label>
             <label class="control-label" ng-show="domainConfigure.cloudflareTokenType === 'ApiToken'">{{ 'domains.domainDialog.cloudflareTokenTypeApiToken' | tr }}</label>
@@ -126,20 +134,18 @@
             </label>
           </div>
 
-          <div class="form-group" ng-class="{ 'has-error': false }" ng-show="domainConfigure.provider === 'cloudflare'">
-            <label class="control-label">{{ 'domains.domainDialog.cloudflareTokenType' | tr }}</label>
-            <select class="form-control" ng-model="domainConfigure.cloudflareTokenType">
-              <option value="GlobalApiKey">{{ 'domains.domainDialog.cloudflareTokenTypeGlobalApiKey' | tr }}</option>
-              <option value="ApiToken">{{ 'domains.domainDialog.cloudflareTokenTypeApiToken' | tr }}</option>
-            </select>
-          </div>
-
           <!-- Linode -->
           <div class="form-group" ng-class="{ 'has-error': false }" ng-show="domainConfigure.provider === 'linode'">
             <label class="control-label">{{ 'domains.domainDialog.linodeToken' | tr }}</label>
             <input type="text" class="form-control" ng-model="domainConfigure.linodeToken" name="linodeToken" ng-disabled="domainConfigure.busy" ng-required="domainConfigure.provider === 'linode'">
           </div>
 
+          <!-- Bunny -->
+          <div class="form-group" ng-class="{ 'has-error': false }" ng-show="domainConfigure.provider === 'bunny'">
+            <label class="control-label">{{ 'domains.domainDialog.bunnyAccessKey' | tr }}</label>
+            <input type="text" class="form-control" ng-model="domainConfigure.bunnyAccessKey" name="bunnyAccessKey" ng-disabled="domainConfigure.busy" ng-required="domainConfigure.provider === 'bunny'">
+          </div>
+
           <!-- Hetzner -->
           <div class="form-group" ng-class="{ 'has-error': false }" ng-show="domainConfigure.provider === 'hetzner'">
             <label class="control-label">{{ 'domains.domainDialog.hetznerToken' | tr }}</label>
@@ -325,15 +331,15 @@
                 {{ prettyProviderName(domain) }}
               </td>
               <td class="text-right no-wrap" style="vertical-align: bottom">
-                <button class="btn btn-xs btn-default" ng-click="domainWellKnown.show(domain)" title="{{ 'domains.tooltipWellKnown' | tr }}"><i class="fa fa-atlas"></i></button>
-                <button class="btn btn-xs btn-default" ng-click="domainConfigure.show(domain)" title="{{ 'domains.tooltipEdit' | tr }}"><i class="fa fa-pencil-alt"></i></button>
-                <button class="btn btn-xs btn-danger" ng-click="domainRemove.show(domain)" title="{{ 'domains.tooltipRemove' | tr }}" ng-disabled="domain.domain === config.adminDomain"><i class="far fa-trash-alt"></i></button>
+                <button class="btn btn-xs btn-default" ng-click="domainWellKnown.show(domain)" uib-tooltip="{{ 'domains.tooltipWellKnown' | tr }}"><i class="fa fa-atlas"></i></button>
+                <button class="btn btn-xs btn-default" ng-click="domainConfigure.show(domain)" uib-tooltip="{{ 'domains.tooltipEdit' | tr }}"><i class="fa fa-pencil-alt"></i></button>
+                <button class="btn btn-xs btn-danger" ng-click="domainRemove.show(domain)" uib-tooltip="{{ 'domains.tooltipRemove' | tr }}" ng-disabled="domain.domain === config.adminDomain"><i class="far fa-trash-alt"></i></button>
               </td>
             </tr>
           </tbody>
         </table>
         <div class="pull-left">
-          {{ 'main.pagination.itemCount' | tr:{ count: (domains | filter:domainSearchString).length } }}
+          {{ 'domains.count' | tr:{ count: (domains | filter:domainSearchString).length } }}
         </div>
         <div class="pull-right" ng-show="domains.length > pageSize">
           <button class="btn btn-default btn-outline btn-xs" ng-click="showPrevPage()" ng-class="{ 'btn-primary': currentPage > 1 }" ng-disabled="currentPage <= 1"><i class="fa fa-angle-double-left"></i> {{ 'main.pagination.prev' | tr }}</button>
@@ -344,8 +350,22 @@
     </div>
   </div>
 
-  <div class="text-left">
-    <h3>{{ 'domains.renewCerts.title' | tr }}</h3>
+  <div class="text-left section-header">
+    <h3>
+      {{ 'domains.renewCerts.title' | tr }}
+      <div class="btn-group btn-group-sm pull-right">
+        <button type="button" class="btn btn-small btn-default dropdown-toggle" ng-show="renewCerts.tasks.length" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" uib-tooltip="{{ 'domains.renewCerts.showLogsAction' | tr }}">
+          <i class="fas fa-align-left"></i> <span class="caret"></span>
+        </button>
+        <ul class="dropdown-menu">
+          <li ng-repeat="task in renewCerts.tasks">
+            <a ng-href="/frontend/logs.html?taskId={{task.id}}" target="_blank" class="text-right">
+            {{ task.ts | prettyLongDate }} <i class="fa" style="margin-left: 20px" ng-class="{ 'status-active fa-check-circle': !task.active && task.success, 'fa-circle-notch fa-spin': task.active, 'status-error fa-times-circle': !task.active && !task.success }"></i>
+            </a>
+          </li>
+        </ul>
+      </div>
+    </h3>
   </div>
 
   <div class="card">
@@ -369,14 +389,27 @@
         <p ng-hide="renewCerts.busy">
           <div class="has-error" ng-show="!renewCerts.active">{{ renewCerts.errorMessage }}</div>
         </p>
-        <a class="btn btn-primary pull-right" ng-href="/logs.html?taskId={{renewCerts.taskId}}" ng-disabled="!renewCerts.taskId" target="_blank">{{ 'domains.renewCerts.showLogsAction' | tr }}</a>
-        <button class="btn btn-outline btn-primary pull-right" ng-click="renewCerts.renew()" ng-disabled="renewCerts.busy" style="margin-right: 10px">{{ 'domains.renewCerts.renewAllAction' | tr }}</button>
+        <button class="btn btn-outline btn-primary pull-right" ng-click="renewCerts.renew()" ng-disabled="renewCerts.busy">{{ 'domains.renewCerts.renewAllAction' | tr }}</button>
       </div>
     </div>
   </div>
 
-  <div class="text-left">
-    <h3>{{ 'domains.syncDns.title' | tr }}</h3>
+  <div class="text-left section-header">
+    <h3>
+      {{ 'domains.syncDns.title' | tr }}
+      <div class="btn-group btn-group-sm pull-right">
+        <button type="button" class="btn btn-small btn-default dropdown-toggle" ng-show="syncDns.tasks.length" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" uib-tooltip="{{ 'domains.renewCerts.showLogsAction' | tr }}">
+          <i class="fas fa-align-left"></i> <span class="caret"></span>
+        </button>
+        <ul class="dropdown-menu">
+          <li ng-repeat="task in syncDns.tasks">
+            <a ng-href="/frontend/logs.html?taskId={{task.id}}" target="_blank" class="text-right">
+            {{ task.ts | prettyLongDate }} <i class="fa" style="margin-left: 20px" ng-class="{ 'status-active fa-check-circle': !task.active && task.success, 'fa-circle-notch fa-spin': task.active, 'status-error fa-times-circle': !task.active && !task.success }"></i>
+            </a>
+          </li>
+        </ul>
+      </div>
+    </h3>
   </div>
 
   <div class="card">
@@ -400,14 +433,27 @@
         <p ng-hide="syncDns.busy">
           <div class="has-error" ng-show="!syncDns.active">{{ syncDns.errorMessage }}</div>
         </p>
-        <a class="btn btn-primary pull-right" ng-href="/logs.html?taskId={{syncDns.taskId}}" ng-disabled="!syncDns.taskId" target="_blank">{{ 'domains.syncDns.showLogsAction' | tr }}</a>
-        <button class="btn btn-outline btn-primary pull-right" ng-click="syncDns.sync()" ng-disabled="syncDns.busy" style="margin-right: 10px">{{ 'domains.syncDns.syncAction' | tr }}</button>
+        <button class="btn btn-outline btn-primary pull-right" ng-click="syncDns.sync()" ng-disabled="syncDns.busy">{{ 'domains.syncDns.syncAction' | tr }}</button>
       </div>
     </div>
   </div>
 
-  <div class="text-left">
-    <h3>{{ 'domains.changeDashboardDomain.title' | tr }}</h3>
+  <div class="text-left section-header">
+    <h3>
+      {{ 'domains.changeDashboardDomain.title' | tr }}
+      <div class="btn-group btn-group-sm pull-right">
+        <button type="button" class="btn btn-small btn-default dropdown-toggle" ng-show="changeDashboard.tasks.length" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" uib-tooltip="{{ 'domains.renewCerts.showLogsAction' | tr }}">
+          <i class="fas fa-align-left"></i> <span class="caret"></span>
+        </button>
+        <ul class="dropdown-menu">
+          <li ng-repeat="task in changeDashboard.tasks">
+            <a ng-href="/frontend/logs.html?taskId={{task.id}}" target="_blank" class="text-right">
+            {{ task.ts | prettyLongDate }} <i class="fa" style="margin-left: 20px" ng-class="{ 'status-active fa-check-circle': !task.active && task.success, 'fa-circle-notch fa-spin': task.active, 'status-error fa-times-circle': !task.active && !task.success }"></i>
+            </a>
+          </li>
+        </ul>
+      </div>
+    </h3>
   </div>
 
   <div class="card">
@@ -432,16 +478,15 @@
     </div>
 
     <div class="row">
-      <div class="col-md-6">
+      <div class="col-md-8">
         <p ng-show="changeDashboard.busy">{{ changeDashboard.message }}</p>
         <p ng-hide="changeDashboard.busy">
           <div class="has-error" ng-show="!changeDashboard.active">{{ changeDashboard.errorMessage }}</div>
         </p>
       </div>
-      <div class="col-md-6 text-right">
+      <div class="col-md-4 text-right">
         <button class="btn btn-outline btn-primary" ng-click="changeDashboard.change()" ng-hide="changeDashboard.busy" ng-disabled="changeDashboard.selectedDomain.domain === changeDashboard.adminDomain.domain">{{ 'domains.changeDashboardDomain.changeAction' | tr }}</button>
         <button class="btn btn-outline btn-danger" ng-click="changeDashboard.stop()" ng-show="changeDashboard.busy" style="margin-right: 10px">{{ 'domains.changeDashboardDomain.cancelAction' | tr }}</button>
-        <a class="btn btn-primary pull-right" ng-href="/logs.html?taskId={{changeDashboard.taskId}}" ng-show="changeDashboard.busy" target="_blank">{{ 'domains.changeDashboardDomain.showLogsAction' | tr }}</a>
       </div>
     </div>
   </div>

dashboard/src/views/domains.js

@@ -11,7 +11,7 @@ angular.module('Application').controller('DomainsController', ['$scope', '$locat
     $scope.domains = [];
     $scope.ready = false;
     $scope.domainSearchString = '';
-    $scope.pageSize = 10;
+    $scope.pageSize = localStorage.cloudronPageSize || 10;
     $scope.currentPage = 1;
 
     $scope.showNextPage = function () {
@@ -44,6 +44,7 @@ angular.module('Application').controller('DomainsController', ['$scope', '$locat
     // keep in sync with setupdns.js
     $scope.dnsProvider = [
         { name: 'AWS Route53', value: 'route53' },
+        { name: 'Bunny', value: 'bunny' },
         { name: 'Cloudflare', value: 'cloudflare' },
         { name: 'DigitalOcean', value: 'digitalocean' },
         { name: 'Gandi LiveDNS', value: 'gandi' },
@@ -63,6 +64,7 @@ angular.module('Application').controller('DomainsController', ['$scope', '$locat
 
     $scope.prettyProviderName = function (domain) {
         switch (domain.provider) {
+        case 'bunny': return 'Bunny';
         case 'route53': return 'AWS Route53';
         case 'cloudflare': return 'Cloudflare';
         case 'digitalocean': return 'DigitalOcean';
@@ -246,6 +248,7 @@ angular.module('Application').controller('DomainsController', ['$scope', '$locat
         cloudflareDefaultProxyStatus: false,
         cloudflareTokenType: 'GlobalApiKey',
         linodeToken: '',
+        bunnyAccessKey: '',
         hetznerToken: '',
         vultrToken: '',
         nameComToken: '',
@@ -303,6 +306,7 @@ angular.module('Application').controller('DomainsController', ['$scope', '$locat
                 }
                 $scope.domainConfigure.digitalOceanToken = domain.provider === 'digitalocean' ? domain.config.token : '';
                 $scope.domainConfigure.linodeToken = domain.provider === 'linode' ? domain.config.token : '';
+                $scope.domainConfigure.bunnyAccessKey = domain.provider === 'bunny' ? domain.config.accessKey : '';
                 $scope.domainConfigure.hetznerToken = domain.provider === 'hetzner' ? domain.config.token : '';
                 $scope.domainConfigure.vultrToken = domain.provider === 'vultr' ? domain.config.token : '';
                 $scope.domainConfigure.gandiApiKey = domain.provider === 'gandi' ? domain.config.token : '';
@@ -373,6 +377,8 @@ angular.module('Application').controller('DomainsController', ['$scope', '$locat
                 data.token = $scope.domainConfigure.digitalOceanToken;
             } else if (provider === 'linode') {
                 data.token = $scope.domainConfigure.linodeToken;
+            } else if (provider === 'bunny') {
+                data.accessKey = $scope.domainConfigure.bunnyAccessKey;
             } else if (provider === 'hetzner') {
                 data.token = $scope.domainConfigure.hetznerToken;
             } else if (provider === 'vultr') {
@@ -483,21 +489,20 @@ angular.module('Application').controller('DomainsController', ['$scope', '$locat
         percent: 0,
         message: '',
         errorMessage: '',
-        taskId: '',
+        tasks: [],
 
-        checkStatus: function () {
-            Client.getLatestTaskByType(TASK_TYPES.TASK_CHECK_CERTS, function (error, task) {
+        refreshTasks: function () {
+            Client.getTasksByType(TASK_TYPES.TASK_CHECK_CERTS, function (error, tasks) {
                 if (error) return console.error(error);
-
-                if (!task) return;
-
-                $scope.renewCerts.taskId = task.id;
-                $scope.renewCerts.updateStatus();
+                $scope.renewCerts.tasks = tasks.slice(0, 10);
+                if ($scope.renewCerts.tasks.length && $scope.renewCerts.tasks[0].active) $scope.renewCerts.updateStatus();
             });
         },
 
         updateStatus: function () {
-            Client.getTask($scope.renewCerts.taskId, function (error, data) {
+            var taskId = $scope.renewCerts.tasks[0].id;
+
+            Client.getTask(taskId, function (error, data) {
                 if (error) return window.setTimeout($scope.renewCerts.updateStatus, 5000);
 
                 if (!data.active) {
@@ -506,6 +511,8 @@ angular.module('Application').controller('DomainsController', ['$scope', '$locat
                     $scope.renewCerts.percent = 100; // indicates that 'result' is valid
                     $scope.renewCerts.errorMessage = data.success ? '' : data.error.message;
 
+                    $scope.renewCerts.refreshTasks(); // update the tasks list dropdown
+
                     return;
                 }
 
@@ -523,15 +530,13 @@ angular.module('Application').controller('DomainsController', ['$scope', '$locat
             $scope.renewCerts.errorMessage = '';
 
             // always rebuild the nginx configs when triggered via the UI. we assume user is clicking this because something is wrong
-            Client.renewCerts({ rebuild: true }, function (error, taskId) {
+            Client.renewCerts({ rebuild: true }, function (error /*, taskId */) {
                 if (error) {
                     console.error(error);
                     $scope.renewCerts.errorMessage = error.message;
-
                     $scope.renewCerts.busy = false;
                 } else {
-                    $scope.renewCerts.taskId = taskId;
-                    $scope.renewCerts.updateStatus();
+                    $scope.renewCerts.refreshTasks();
                 }
             });
         }
@@ -542,21 +547,19 @@ angular.module('Application').controller('DomainsController', ['$scope', '$locat
         percent: 0,
         message: '',
         errorMessage: '',
-        taskId: '',
+        tasks: [],
 
-        checkStatus: function () {
-            Client.getLatestTaskByType(TASK_TYPES.TASK_SYNC_DNS_RECORDS, function (error, task) {
+        refreshTasks: function () {
+            Client.getTasksByType(TASK_TYPES.TASK_SYNC_DNS_RECORDS, function (error, tasks) {
                 if (error) return console.error(error);
-
-                if (!task) return;
-
-                $scope.syncDns.taskId = task.id;
-                $scope.syncDns.updateStatus();
+                $scope.syncDns.tasks = tasks.slice(0, 10);
+                if ($scope.syncDns.tasks.length && $scope.syncDns.tasks[0].active) $scope.syncDns.updateStatus();
             });
         },
 
         updateStatus: function () {
-            Client.getTask($scope.syncDns.taskId, function (error, data) {
+            var taskId = $scope.syncDns.tasks[0].id;
+            Client.getTask(taskId, function (error, data) {
                 if (error) return window.setTimeout($scope.syncDns.updateStatus, 5000);
 
                 if (!data.active) {
@@ -565,6 +568,8 @@ angular.module('Application').controller('DomainsController', ['$scope', '$locat
                     $scope.syncDns.percent = 100; // indicates that 'result' is valid
                     $scope.syncDns.errorMessage = data.success ? '' : data.error.message;
 
+                    $scope.syncDns.refreshTasks(); // update the tasks list dropdown
+
                     return;
                 }
 
@@ -581,15 +586,13 @@ angular.module('Application').controller('DomainsController', ['$scope', '$locat
             $scope.syncDns.message = '';
             $scope.syncDns.errorMessage = '';
 
-            Client.setDnsRecords({}, function (error, taskId) {
+            Client.setDnsRecords({}, function (error /*, taskId */) {
                 if (error) {
                     console.error(error);
                     $scope.syncDns.errorMessage = error.message;
-
                     $scope.syncDns.busy = false;
                 } else {
-                    $scope.syncDns.taskId = taskId;
-                    $scope.syncDns.updateStatus();
+                    $scope.syncDns.refreshTasks();
                 }
             });
         }
@@ -643,24 +646,21 @@ angular.module('Application').controller('DomainsController', ['$scope', '$locat
         taskId: '',
         selectedDomain: null,
         adminDomain: null,
+        tasks: [],
+
+        refreshTasks: function () {
+            Client.getTasksByType(TASK_TYPES.TASK_PREPARE_DASHBOARD_LOCATION, function (error, tasks) {
+                if (error) return console.error(error);
+                $scope.changeDashboard.tasks = tasks.slice(0, 10);
+                if ($scope.changeDashboard.tasks.length && $scope.changeDashboard.tasks[0].active) $scope.changeDashboard.updateStatus();
+            });
+        },
 
         stop: function () {
             Client.stopTask($scope.changeDashboard.taskId, function (error) {
                 if (error) console.error(error);
                 $scope.changeDashboard.busy = false;
-            });
-        },
-
-        // this function is not called intentionally. currently, we do switching in two steps - prepare and set
-        // if the user refreshed the UI in the middle of prepare, then it would be awkward to resume/call 'set' when the
-        // user visits the UI the next time around.
-        checkStatus: function () {
-            Client.getLatestTaskByType('prepareDashboardDomain', function (error, task) {
-                if (error) return console.error(error);
-                if (!task) return;
-
-                $scope.changeDashboard.taskId = task.id;
-                $scope.changeDashboard.updateStatus();
+                $scope.changeDashboard.refreshTasks();
             });
         },
 
@@ -715,7 +715,7 @@ angular.module('Application').controller('DomainsController', ['$scope', '$locat
                     $scope.changeDashboard.busy = false;
                 } else {
                     $scope.changeDashboard.taskId = taskId;
-                    $scope.changeDashboard.updateStatus();
+                    $scope.changeDashboard.refreshTasks();
                 }
             });
         }
@@ -728,7 +728,9 @@ angular.module('Application').controller('DomainsController', ['$scope', '$locat
             $scope.ready = true;
         });
 
-        $scope.renewCerts.checkStatus();
+        $scope.renewCerts.refreshTasks();
+        $scope.syncDns.refreshTasks();
+        $scope.changeDashboard.refreshTasks();
     });
 
     document.getElementById('gcdnsKeyFileInput').onchange = readFileLocally($scope.domainConfigure.gcdnsKey, 'content', 'keyFileName');

dashboard/src/views/email.html

@@ -725,7 +725,7 @@
                   <div id="collapse_dns_{{ record.value }}" class="panel-collapse collapse">
                     <div class="panel-body">
                       <p ng-show="record.name === 'MX' && domain.provider === 'namecheap'">{{ 'email.dnsStatus.namecheapInfo' | tr }} <sup><a ng-href="https://docs.cloudron.io/domains/#namecheap-dns" class="help" target="_blank"><i class="fa fa-question-circle"></i></a></sup></p>
-                      <p ng-show="record.name === 'PTR'">{{ 'email.dnsStatus.ptrInfo' | tr }} <sup><a ng-href="https://docs.cloudron.io/troubleshooting/#ptr-record" class="help" target="_blank"><i class="fa fa-question-circle"></i></a></sup></p>
+                      <p ng-show="record.name === 'PTR'">{{ 'email.dnsStatus.ptrInfo' | tr }} <sup><a ng-href="https://docs.cloudron.io/email/#ptr-record" class="help" target="_blank"><i class="fa fa-question-circle"></i></a></sup></p>
                       <p ng-show="expectedDnsRecords[record.value].name">{{ 'email.dnsStatus.hostname' | tr }}: <b ng-click-select><tt>{{ expectedDnsRecords[record.value].name }}</tt></b></p>
                       <p ng-hide="expectedDnsRecords[record.value].name">{{ 'email.dnsStatus.domain' | tr }}: <b ng-click-select><tt>{{ expectedDnsRecords[record.value].domain }}</tt></b></p>
                       <p>{{ 'email.dnsStatus.type' | tr }}: <b ng-click-select><tt>{{ expectedDnsRecords[record.value].type }}</tt></b></p>

dashboard/src/views/email.js

@@ -64,6 +64,12 @@ angular.module('Application').controller('EmailController', ['$scope', '$locatio
         Client.openSubscriptionSetup($scope.$parent.subscription);
     };
 
+    function updateMailUsage(mailboxName, quotaLimit) {
+        if (!$scope.mailUsage) $scope.mailUsage = {};
+        if (!$scope.mailUsage[mailboxName]) $scope.mailUsage[mailboxName] = {};
+        $scope.mailUsage[mailboxName].quotaLimit = quotaLimit;
+    }
+
     function refreshMailUsage() {
         Client.getMailUsage($scope.domain.domain, function (error, usage) {
             if (error) console.error(error);
@@ -646,7 +652,7 @@ angular.module('Application').controller('EmailController', ['$scope', '$locatio
                     }
 
                     function done() {
-                        $scope.mailUsage[$scope.mailboxes.edit.name + '@' + $scope.domain.domain].quotaLimit = $scope.mailboxes.edit.storageQuotaEnabled ? $scope.mailboxes.edit.storageQuota : 0; // hack to avoid refresh
+                        updateMailUsage($scope.mailboxes.edit.name + '@' + $scope.domain.domain, $scope.mailboxes.edit.storageQuotaEnabled ? $scope.mailboxes.edit.storageQuota : 0); // hack to avoid refresh
 
                         $scope.mailboxes.edit.busy = false;
                         $scope.mailboxes.edit.error = null;

dashboard/src/views/emails-eventlog.html

@@ -7,7 +7,7 @@
     <h1>
       {{ 'emails.eventlog.title' | tr }}
 
-      <a class="btn btn-default btn-outline pull-right" href="/logs.html?id=mail" target="_blank">{{ 'main.action.logs' | tr }}</a>
+      <a class="btn btn-default btn-outline pull-right" href="/frontend/logs.html?id=mail" target="_blank">{{ 'main.action.logs' | tr }}</a>
       <a class="btn btn-default btn-outline pull-right" href="#/emails-queue">{{ 'emails.action.queue' | tr }}</a>
     </h1>
   </div>

dashboard/src/views/emails-queue.html

@@ -7,7 +7,7 @@
     <h1>
       {{ 'emails.queue.title' | tr }}
 
-      <a class="btn btn-default btn-outline pull-right" href="/logs.html?id=mail" target="_blank">{{ 'main.action.logs' | tr }}</a>
+      <a class="btn btn-default btn-outline pull-right" href="/frontend/logs.html?id=mail" target="_blank">{{ 'main.action.logs' | tr }}</a>
     </h1>
   </div>
 </div>

dashboard/src/views/emails.html

@@ -1,50 +1,3 @@
-<!-- Modal change mail server domain -->
-<div class="modal fade" id="mailLocationModal" tabindex="-1" role="dialog">
-  <div class="modal-dialog">
-    <div class="modal-content">
-      <div class="modal-header">
-        <h4 class="modal-title">{{ 'emails.changeDomainDialog.title' | tr }}</h4>
-      </div>
-      <div class="modal-body">
-        <div ng-bind-html=" 'emails.changeDomainDialog.description' | tr "></div>
-        <br>
-
-        <form name="mailLocationForm" role="form" novalidate ng-submit="mailLocation.submit()" autocomplete="off">
-          <div class="form-group" ng-class="{ 'has-error': (mailLocationForm.subdomain.$dirty && mailLocationForm.subdomain.$invalid) || (!mailLocationForm.subdomain.$dirty && mailLocation.error)}">
-            <label class="control-label">{{ 'emails.changeDomainDialog.location' | tr }}</label>
-
-            <div class="has-error" ng-show="mailLocation.error">{{ mailLocation.error.message }}</div>
-
-            <div class="input-group form-inline">
-              <input type="text" class="form-control" ng-model="mailLocation.subdomain" id="mailLocationLocationInput" name="location" placeholder="{{ 'emails.changeDomainDialog.locationPlaceholder' | tr }}" autofocus>
-
-              <div class="input-group-btn">
-                <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
-                  <span>{{ (!mailLocation.subdomain ? '' : '.') + mailLocation.domain.domain }}</span>
-                  <span class="caret"></span>
-                </button>
-                <ul class="dropdown-menu dropdown-menu-right" role="menu">
-                  <li ng-repeat="domain in domains">
-                    <a href="" ng-click="mailLocation.domain = domain">{{ domain.domain }}</a>
-                  </li>
-                </ul>
-              </div>
-            </div>
-          </div>
-
-          <p class="text-center text-warning text-bold" ng-show="mailLocation.domain.provider === 'manual'" ng-bind-html="'emails.changeDomainDialog.manualInfo' | tr:{ domain: mailLocation.domain.domain }"></p>
-
-          <input class="ng-hide" type="submit" ng-disabled="mailLocationForm.$invalid"/>
-        </form>
-      </div>
-      <div class="modal-footer">
-        <button type="button" class="btn btn-default" data-dismiss="modal">{{ 'main.dialog.cancel' | tr }}</button>
-        <button type="button" class="btn btn-success" ng-click="mailLocation.submit()" ng-disabled="mailLocationForm.$invalid || mailLocation.busy"><i class="fa fa-circle-notch fa-spin" ng-show="mailLocation.busy"></i> {{ 'main.dialog.save' | tr }}</button>
-      </div>
-    </div>
-  </div>
-</div>
-
 <!-- Modal change max email size -->
 <div class="modal fade" id="maxEmailSizeChangeModal" tabindex="-1" role="dialog">
   <div class="modal-dialog">
@@ -216,12 +169,11 @@
       <div class="pull-right">
         <a class="btn btn-default" ng-show="user.isAtLeastOwner" href="#/emails-queue">{{ 'emails.action.queue' | tr }}</a>
         <a class="btn btn-default" ng-show="user.isAtLeastOwner" href="#/emails-eventlog">{{ 'eventlog.title' | tr }}</a>
-        <!-- hidden for now, until we see a purpose -->
-        <!-- <a class="btn btn-sm btn-default" ng-disabled="user.isAtLeastOwner" href="/filemanager.html?id=mail&type=mail" target="_blank" uib-tooltip="{{ 'app.filemanagerActionTooltip' | tr }}" tooltip-append-to-body="true" tooltip-placement="bottom"><i class="fas fa-folder"></i></a> -->
       </div>
     </h1>
   </div>
 
+  <!-- domain listing -->
   <div class="text-left">
     <h3>{{ 'emails.domains.title' | tr }}</h3>
   </div>
@@ -271,7 +223,8 @@
     </div>
   </div>
 
-  <div class="text-left" ng-show="user.isAtLeastOwner">
+  <!-- mailbox sharing -->
+  <div class="text-left section-header" ng-show="user.isAtLeastOwner">
     <h3>{{ 'emails.mailboxSharing.title' | tr }}</h3>
   </div>
 
@@ -291,22 +244,82 @@
     </div>
   </div>
 
-  <div class="text-left" ng-show="user.isAtLeastOwner">
+  <!-- server location -->
+  <div class="text-left section-header" ng-show="user.isAtLeastOwner">
+    <h3>
+      {{ 'emails.settings.location' | tr }}
+      <div class="btn-group btn-group-sm pull-right">
+        <button type="button" class="btn btn-small btn-default dropdown-toggle" ng-show="mailLocation.tasks.length" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" uib-tooltip="{{ 'main.action.showLogs' | tr }}">
+          <i class="fas fa-align-left"></i> <span class="caret"></span>
+        </button>
+        <ul class="dropdown-menu">
+          <li ng-repeat="task in mailLocation.tasks">
+            <a ng-href="/frontend/logs.html?taskId={{task.id}}" target="_blank" class="text-right">
+            {{ task.ts | prettyLongDate }} <i class="fa" style="margin-left: 20px" ng-class="{ 'status-active fa-check-circle': !task.active && task.success, 'fa-circle-notch fa-spin': task.active, 'status-error fa-times-circle': !task.active && !task.success }"></i>
+            </a>
+          </li>
+        </ul>
+      </div>
+    </h3>
+  </div>
+
+  <div class="card">
+    <div class="row">
+      <div class="col-md-7">
+        <p ng-bind-html="'emails.changeDomainDialog.description' | tr"></p>
+      </div>
+      <div class="col-md-5">
+        <div class="input-group form-inline">
+          <input type="text" class="form-control" ng-model="mailLocation.subdomain" id="mailLocationLocationInput" name="location" placeholder="{{ 'emails.changeDomainDialog.locationPlaceholder' | tr }}" autofocus>
+
+          <div class="input-group-btn">
+            <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
+              <span>{{ (!mailLocation.subdomain ? '' : '.') + mailLocation.domain.domain }}</span>
+              <span class="caret"></span>
+            </button>
+            <ul class="dropdown-menu dropdown-menu-right" role="menu">
+              <li ng-repeat="domain in domains">
+                <a href="" ng-click="mailLocation.domain = domain">{{ domain.domain }}</a>
+              </li>
+            </ul>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div class="row">
+      <div class="col-md-12" style="margin-bottom: 10px;">
+        <div ng-show="mailLocation.busy" class="progress progress-striped active animateMe">
+          <div class="progress-bar progress-bar-success" role="progressbar" style="width: {{ mailLocation.percent }}%"></div>
+        </div>
+      </div>
+    </div>
+
+    <p class="text-center text-warning text-bold" ng-show="mailLocation.domain.provider === 'manual'" ng-bind-html="'emails.changeDomainDialog.manualInfo' | tr:{ domain: mailLocation.domain.domain }"></p>
+
+    <div class="row">
+      <div class="col-md-6">
+        <p ng-show="mailLocation.busy">{{ mailLocation.message }}</p>
+        <p ng-hide="mailLocation.busy">
+          <div class="has-error" ng-show="!mailLocation.active">{{ mailLocation.errorMessage }}</div>
+        </p>
+      </div>
+      <div class="col-md-6 text-right">
+        <!-- save is always enabled so that user can "redo" the task -->
+        <button class="btn btn-outline btn-primary" ng-click="mailLocation.change()" ng-hide="mailLocation.busy">{{ 'main.dialog.save' | tr }}</button>
+        <button class="btn btn-outline btn-danger" ng-click="mailLocation.stop()" ng-show="mailLocation.busy" style="margin-right: 10px">{{ 'main.dialog.cancel' | tr }}</button>
+      </div>
+    </div>
+  </div>
+
+  <!-- settings -->
+  <div class="text-left section-header" ng-show="user.isAtLeastOwner">
     <h3>{{ 'emails.settings.title' | tr }}</h3>
   </div>
 
   <div class="card" ng-show="user.isAtLeastOwner" style="margin-bottom: 15px;">
     <p ng-bind-html=" 'emails.settings.info' | tr "></p>
-
     <div class="row">
-      <div class="col-xs-6">
-        <span class="text-muted">{{ 'emails.settings.location' | tr }}</span>
-      </div>
-      <div class="col-xs-6 text-right">
-        <span>{{ mailLocation.currentLocation.subdomain + (!mailLocation.currentLocation.subdomain ? '' : '.') + mailLocation.currentLocation.domain.domain }}
-          <a ng-hide="mailLocation.busy" href="" ng-click="mailLocation.show()"><i class="fa fa-edit text-small"></i></a> <!-- ng-disabled does not work for links -->
-        </span>
-      </div>
       <div class="col-xs-6">
         <span class="text-muted">{{ 'emails.settings.maxMailSize' | tr }}</span>
       </div>
@@ -341,19 +354,6 @@
         <a href="" ng-click="solrConfig.show()"><i class="fa fa-edit text-small"></i></a>
       </div>
     </div>
-
-    <div class="row" ng-show="mailLocation.busy">
-      <div class="col-md-12" style="margin-top: 10px;">
-        {{ 'emails.settings.changeDomainProgress' | tr }}
-        <div style="display: flex; margin: 4px 0;">
-          <div class="progress progress-striped active animateMe" style="flex-grow: 1;">
-            <div class="progress-bar progress-bar-success" role="progressbar" style="width: {{ mailLocation.percent }}%"></div>
-          </div>
-          <div ng-show="mailLocation.taskMinutesActive >= 2" class="text-danger hand" style="margin: 0 4px;" ng-click="mailLocation.stopTask()" uib-tooltip="Cancel Task"><i class="fas fa-times"></i></div>
-        </div>
-        <p>{{ mailLocation.message }}</p>
-      </div>
-    </div>
   </div>
 
 </div>

dashboard/src/views/emails.js

@@ -10,39 +10,30 @@ angular.module('Application').controller('EmailsController', ['$scope', '$locati
     $scope.user = Client.getUserInfo();
     $scope.domains = [];
 
-    // this is required because we need to rewrite the MAIL_SERVER_NAME env var
-    $scope.reconfigureEmailApps = function () {
-        var installedApps = Client.getInstalledApps();
-        for (var i = 0; i < installedApps.length; i++) {
-            if (!installedApps[i].manifest.addons.email) continue;
-
-            Client.repairApp(installedApps[i].id, { }, function (error) {
-                if (error) console.error(error);
-            });
-        }
-    };
-
     $scope.mailLocation = {
         busy: false,
-        error: null,
+        percent: 0,
+        message: '',
+        errorMessage: '',
+
         currentLocation: { domain: null, subdomain: '' },
         domain: null,
         subdomain: '',
-        taskId: null,
-        percent: 0,
-        taskMinutesActive: 0,
-        message: '',
-        errorMessage: '',
-        reconfigure: false,
+        tasks: [],
 
-        stopTask: function () {
-            Client.getLatestTaskByType(TASK_TYPES.TASK_CHANGE_MAIL_LOCATION, function (error, task) {
+        refreshTasks: function () {
+            Client.getTasksByType(TASK_TYPES.TASK_CHANGE_MAIL_LOCATION, function (error, tasks) {
                 if (error) return console.error(error);
-                if (!task.id) return;
+                $scope.mailLocation.tasks = tasks.slice(0, 10);
+                if ($scope.mailLocation.tasks.length && $scope.mailLocation.tasks[0].active) $scope.mailLocation.updateStatus();
+            });
+        },
 
-                Client.stopTask(task.id, function (error) {
-                    if (error) console.error(error);
-                });
+        stop: function () {
+            Client.stopTask($scope.mailLocation.tasks[0].id, function (error) {
+                if (error) console.error(error);
+                $scope.mailLocation.busy = false;
+                $scope.mailLocation.refreshTasks();
             });
         },
 
@@ -50,46 +41,26 @@ angular.module('Application').controller('EmailsController', ['$scope', '$locati
             Client.getMailLocation(function (error, location) {
                 if (error) return console.error('Failed to get max email location', error);
 
-                $scope.mailLocation.currentLocation.subdomain = location.subdomain;
-                $scope.mailLocation.currentLocation.domain = $scope.domains.find(function (d) { return location.domain === d.domain; });
+                $scope.mailLocation.currentLocation.subdomain = $scope.mailLocation.subdomain = location.subdomain;
+                $scope.mailLocation.currentLocation.domain = $scope.mailLocation.domain = $scope.domains.find(function (d) { return location.domain === d.domain; });
 
-                Client.getLatestTaskByType(TASK_TYPES.TASK_CHANGE_MAIL_LOCATION, function (error, task) {
-                    if (error) return console.error(error);
-                    if (!task) return;
-
-                    $scope.mailLocation.taskId = task.id;
-                    $scope.mailLocation.reconfigure = task.active; // if task is active when this view reloaded, reconfigure email apps when task done
-                    $scope.mailLocation.updateStatus();
-                });
+                $scope.mailLocation.refreshTasks();
             });
         },
 
-        show: function () {
-            $scope.mailLocation.busy = false;
-            $scope.mailLocation.error = null;
-
-            $scope.mailLocation.domain = $scope.mailLocation.currentLocation.domain;
-            $scope.mailLocation.subdomain = $scope.mailLocation.currentLocation.subdomain;
-
-            $scope.mailLocationForm.$setUntouched();
-            $scope.mailLocationForm.$setPristine();
-
-            $('#mailLocationModal').modal('show');
-        },
-
         updateStatus: function () {
-            Client.getTask($scope.mailLocation.taskId, function (error, data) {
+            var taskId = $scope.mailLocation.tasks[0].id;
+
+            Client.getTask(taskId, function (error, data) {
                 if (error) return window.setTimeout($scope.mailLocation.updateStatus, 5000);
 
                 if (!data.active) {
-                    $scope.mailLocation.taskId = null;
                     $scope.mailLocation.busy = false;
                     $scope.mailLocation.message = '';
-                    $scope.mailLocation.percent = 0;
-                    $scope.taskMinutesActive = 0;
+                    $scope.mailLocation.percent = 100;
                     $scope.mailLocation.errorMessage = data.success ? '' : data.error.message;
 
-                    if ($scope.mailLocation.reconfigure) $scope.reconfigureEmailApps();
+                    $scope.mailLocation.refreshTasks(); // update the tasks list dropdown
 
                     return;
                 }
@@ -97,32 +68,26 @@ angular.module('Application').controller('EmailsController', ['$scope', '$locati
                 $scope.mailLocation.busy = true;
                 $scope.mailLocation.percent = data.percent;
                 $scope.mailLocation.message = data.message;
-                $scope.mailLocation.taskMinutesActive = moment().diff(moment(data.creationTime), 'minutes');
-
                 window.setTimeout($scope.mailLocation.updateStatus, 1000);
             });
         },
 
-        submit: function () {
+        change: function () {
             $scope.mailLocation.busy = true;
+            $scope.mailLocation.percent = 0;
+            $scope.mailLocation.message = '';
+            $scope.mailLocation.errorMessage = '';
 
             Client.setMailLocation($scope.mailLocation.subdomain, $scope.mailLocation.domain.domain, function (error, result) {
                 if (error) {
+                    console.error(error);
+                    $scope.mailLocation.errorMessage = error.message;
                     $scope.mailLocation.busy = false;
-                    $scope.mailLocation.error = error;
-                    return;
+                } else {
+                    $scope.mailLocation.refreshTasks();
                 }
 
-                // update UI immediately
-                $scope.mailLocation.currentLocation = { subdomain: $scope.mailLocation.subdomain, domain: $scope.mailLocation.domain };
-
-                $scope.mailLocation.taskId = result.taskId;
-                $scope.mailLocation.reconfigure = true; // reconfigure email apps when task done
-                $scope.mailLocation.updateStatus();
-
                 Client.refreshConfig(); // update config.mailFqdn
-
-                $('#mailLocationModal').modal('hide');
             });
         }
     };
@@ -438,8 +403,9 @@ angular.module('Application').controller('EmailsController', ['$scope', '$locati
                         if (error) return console.error('Failed to fetch usage for domain', domain.domain, error);
 
                         domain.usage = 0;
-                        // quotaValue can be missing for deleted mailboxes that are on disk but removed from dovecot/ldap itself
-                        Object.keys(usage).forEach(function (m) { domain.usage += (usage[m].quotaValue || usage[m].diskSize); });
+                        // we used to use quotaValue here but it's quite different wrt diskSize. so choose diskSize consistently
+                        // also, quotaValue can be missing for deleted mailboxes that are on disk but removed from dovecot/ldap itself
+                        Object.keys(usage).forEach(function (m) { domain.usage += usage[m].diskSize; });
                     });
                 });
             });

dashboard/src/views/eventlog.js

@@ -32,7 +32,6 @@ angular.module('Application').controller('EventLogController', ['$scope', '$loca
         { name: 'app.start', value: 'app.start' },
         { name: 'app.stop', value: 'app.stop' },
         { name: 'app.restart', value: 'app.restart' },
-        { name: 'Apptask Crash', value: 'app.task.crash' },
         { name: 'backup.cleanup', value: 'backup.cleanup.start' },
         { name: 'backup.cleanup.finish', value: 'backup.cleanup.finish' },
         { name: 'backup.finish', value: 'backup.finish' },
@@ -74,7 +73,6 @@ angular.module('Application').controller('EventLogController', ['$scope', '$loca
         { name: 'volume.add', value: 'volume.add' },
         { name: 'volume.update', value: 'volume.update' },
         { name: 'volume.remove', value: 'volume.update' },
-        { name: 'System Crash', value: 'system.crash' }
     ];
 
     $scope.pageItemCount = [

dashboard/src/views/network.html

@@ -71,6 +71,32 @@
   </div>
 </div>
 
+<!-- Modal Trusted IPs -->
+<div class="modal fade" id="trustedIpsModal" tabindex="-1" role="dialog">
+  <div class="modal-dialog">
+    <div class="modal-content">
+      <div class="modal-header">
+        <h4 class="modal-title">{{ 'network.trustedIps.title' | tr }}</h4>
+      </div>
+      <div class="modal-body">
+        <form name="trustedIpsChangeForm" role="form" novalidate ng-submit="trustedIps.submit()" autocomplete="off">
+          <div class="form-group">
+            <label class="control-label">{{ 'network.trustedIpRanges' | tr }}</label>
+            <p class="small">{{ 'network.trustedIps.description' | tr }}</p>
+            <div class="has-error" ng-show="trustedIps.error.trustedIps">{{ trustedIps.error.trustedIps }}</div>
+            <textarea ng-model="trustedIps.trustedIps" placeholder="{{ 'network.firewall.configure.blocklistPlaceholder' | tr }}" name="trustedIps" class="form-control" ng-class="{ 'has-error': !trustedIpsChangeForm.trustedIps.$dirty && trustedIps.error.trustedIps }" rows="4"></textarea>
+          </div>
+          <input class="ng-hide" type="submit"/>
+        </form>
+      </div>
+      <div class="modal-footer">
+        <button type="button" class="btn btn-default" data-dismiss="modal">{{ 'main.dialog.cancel' | tr }}</button>
+        <button type="button" class="btn btn-success" ng-click="trustedIps.submit()"><i class="fa fa-circle-notch fa-spin" ng-show="trustedIps.busy"></i> {{ 'main.dialog.save' | tr }}</button>
+      </div>
+    </div>
+  </div>
+</div>
+
 <!-- Modal IPv6 -->
 <div class="modal fade" id="ipv6ConfigureModal" tabindex="-1" role="dialog">
   <div class="modal-dialog">
@@ -173,8 +199,59 @@
     </div>
   </div>
 
+    <!-- IPv6 -->
+    <div class="text-left section-header">
+      <h3>{{ 'network.ipv6.title' | tr }}</h3>
+    </div>
+
+    <div class="card">
+      <div class="row">
+        <div class="col-xs-12">
+          {{ 'network.ipv6.description' | tr }}
+        </div>
+      </div>
+
+      <br/>
+      <div class="row">
+        <div class="col-xs-2">
+          <span class="text-muted">{{ 'network.ip.provider' | tr }}</span>
+        </div>
+        <div class="col-xs-10 text-right">
+          <span>{{ prettyIpProviderName(ipv6Configure.provider) }}</span>
+        </div>
+      </div>
+
+      <div class="row" ng-show="ipv6Configure.provider !== 'noop'">
+        <div class="col-xs-2">
+          <span class="text-muted">{{ 'network.ip.address' | tr }}</span>
+        </div>
+        <div class="col-xs-10 text-right">
+          <span ng-show="ipv6Configure.ipv6">{{ ipv6Configure.ipv6 }}</span>
+          <span ng-show="!ipv6Configure.ipv6 && ipv6Configure.serverIPv6">{{ ipv6Configure.serverIPv6 }} ({{ 'network.ip.detected' | tr }})</span>
+          <span ng-show="ipv6Configure.displayError" class="text-danger">{{ ipv6Configure.displayError }}</span>
+        </div>
+      </div>
+
+      <div class="row" ng-show="ipv6Configure.ifname">
+        <div class="col-xs-6">
+          <span class="text-muted">{{ 'network.ip.interface' | tr }}</span>
+        </div>
+        <div class="col-xs-6 text-right">
+          <span>{{ ipv6Configure.ifname }}</span>
+        </div>
+      </div>
+
+      <br/>
+
+      <div class="row">
+        <div class="col-md-6 col-md-offset-6 text-right">
+          <button class="btn btn-outline btn-primary pull-right" ng-click="ipv6Configure.show()">{{ 'network.ip.configure' | tr }}</button>
+        </div>
+      </div>
+    </div>
+
   <!-- Firewall -->
-  <div class="text-left" ng-show="user.isAtLeastOwner">
+  <div class="text-left section-header" ng-show="user.isAtLeastOwner">
     <h3>{{ 'network.firewall.title' | tr }}</h3>
   </div>
 
@@ -187,61 +264,34 @@
         <span>{{ 'network.firewall.blocklist' | tr:{ blockCount: blocklist.currentBlocklistLength } }} <a href="" ng-click="blocklist.show()"><i class="fa fa-edit text-small"></i></a></span>
       </div>
     </div>
-  </div>
 
-  <!-- IPv6 -->
-  <div class="text-left">
-    <h3>{{ 'network.ipv6.title' | tr }}</h3>
-  </div>
-
-  <div class="card">
     <div class="row">
-      <div class="col-xs-12">
-        {{ 'network.ipv6.description' | tr }}
-      </div>
-    </div>
-
-    <br/>
-    <div class="row">
-      <div class="col-xs-2">
-        <span class="text-muted">{{ 'network.ip.provider' | tr }}</span>
-      </div>
-      <div class="col-xs-10 text-right">
-        <span>{{ prettyIpProviderName(ipv6Configure.provider) }}</span>
-      </div>
-    </div>
-
-    <div class="row" ng-show="ipv6Configure.provider !== 'noop'">
-      <div class="col-xs-2">
-        <span class="text-muted">{{ 'network.ip.address' | tr }}</span>
-      </div>
-      <div class="col-xs-10 text-right">
-        <span ng-show="ipv6Configure.ipv6">{{ ipv6Configure.ipv6 }}</span>
-        <span ng-show="!ipv6Configure.ipv6 && ipv6Configure.serverIPv6">{{ ipv6Configure.serverIPv6 }} ({{ 'network.ip.detected' | tr }})</span>
-        <span ng-show="ipv6Configure.displayError" class="text-danger">{{ ipv6Configure.displayError }}</span>
-      </div>
-    </div>
-
-    <div class="row" ng-show="ipv6Configure.ifname">
       <div class="col-xs-6">
-        <span class="text-muted">{{ 'network.ip.interface' | tr }}</span>
+        <span class="text-muted">{{ 'network.trustedIpRanges' | tr }}</span>
       </div>
       <div class="col-xs-6 text-right">
-        <span>{{ ipv6Configure.ifname }}</span>
-      </div>
-    </div>
-
-    <br/>
-
-    <div class="row">
-      <div class="col-md-6 col-md-offset-6 text-right">
-        <button class="btn btn-outline btn-primary pull-right" ng-click="ipv6Configure.show()">{{ 'network.ip.configure' | tr }}</button>
+        <span>{{ 'network.trustedIps.summary' | tr:{ trustCount: trustedIps.currentTrustedIpsLength } }} <a href="" ng-click="trustedIps.show()"><i class="fa fa-edit text-small"></i></a></span>
       </div>
     </div>
   </div>
 
-  <div class="text-left">
-    <h3>{{ 'network.dyndns.title' | tr }}</h3>
+  <!-- Dynamic DNS -->
+  <div class="text-left section-header">
+    <h3>
+      {{ 'network.dyndns.title' | tr }}
+      <div class="btn-group btn-group-sm pull-right">
+        <button type="button" class="btn btn-small btn-default dropdown-toggle" ng-show="dyndnsConfigure.tasks.length" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" uib-tooltip="{{ 'network.dyndns.showLogsAction' | tr }}">
+          <i class="fas fa-align-left"></i> <span class="caret"></span>
+        </button>
+        <ul class="dropdown-menu">
+          <li ng-repeat="task in dyndnsConfigure.tasks">
+            <a ng-href="/frontend/logs.html?taskId={{task.id}}" target="_blank" class="text-right">
+            {{ task.ts | prettyLongDate }} <i class="fa" style="margin-left: 20px" ng-class="{ 'status-active fa-check-circle': !task.active && task.success, 'fa-circle-notch fa-spin': task.active, 'status-error fa-times-circle': !task.active && !task.success }"></i>
+            </a>
+          </li>
+        </ul>
+      </div>
+    </h3>
   </div>
 
   <div class="card">

dashboard/src/views/network.js

@@ -1,9 +1,9 @@
 'use strict';
 
 /* global angular */
-/* global $ */
+/* global $, TASK_TYPES */
 
-angular.module('Application').controller('NetworkController', ['$scope', '$location', 'Client', function ($scope, $location, Client) {
+angular.module('Application').controller('NetworkController', ['$scope', '$location', '$timeout', 'Client', function ($scope, $location, $timeout, Client) {
     Client.onReady(function () { if (!Client.getUserInfo().isAtLeastAdmin) $location.path('/'); });
 
     $scope.user = Client.getUserInfo();
@@ -37,12 +37,25 @@ angular.module('Application').controller('NetworkController', ['$scope', '$locat
         busy: false,
         error: '',
         isEnabled: false,
+        tasks: [],
+
+        refreshTasks: function () {
+            Client.getTasksByType(TASK_TYPES.TASK_SYNC_DYNDNS, function (error, tasks) {
+                if (error) return console.error(error);
+                $scope.dyndnsConfigure.tasks = tasks.slice(0, 10);
+                if ($scope.dyndnsConfigure.tasks.length && $scope.dyndnsConfigure.tasks[0].active) {
+                    $timeout($scope.renewCerts.refreshTasks, 5000);
+                }
+            });
+        },
 
         refresh: function () {
             Client.getDynamicDnsConfig(function (error, enabled) {
                 if (error) return console.error(error);
 
                 $scope.dyndnsConfigure.isEnabled = enabled;
+
+                $scope.dyndnsConfigure.refreshTasks();
             });
         },
 
@@ -192,6 +205,50 @@ angular.module('Application').controller('NetworkController', ['$scope', '$locat
         }
     };
 
+    $scope.trustedIps  = {
+        busy: false,
+        error: {},
+        trustedIps: '',
+        currentTrustedIps: '',
+        currentTrustedIpsLength: 0,
+
+        refresh: function () {
+            Client.getTrustedIps(function (error, result) {
+                if (error) return console.error(error);
+
+                $scope.trustedIps.currentTrustedIps = result;
+                $scope.trustedIps.currentTrustedIpsLength = result.split('\n').filter(function (l) { return l.length !== 0 && l[0] !== '#'; }).length;
+            });
+        },
+
+        show: function () {
+            $scope.trustedIps.error = {};
+            $scope.trustedIps.trustedIps = $scope.trustedIps.currentTrustedIps;
+
+            $('#trustedIpsModal').modal('show');
+        },
+
+        submit: function () {
+            $scope.trustedIps.error = {};
+            $scope.trustedIps.busy = true;
+
+            Client.setTrustedIps($scope.trustedIps.trustedIps, function (error) {
+                $scope.trustedIps.busy = false;
+                if (error) {
+                    $scope.trustedIps.error.trustedIps = error.message;
+                    $scope.trustedIps.error.ip = error.message;
+                    $scope.trustedIpsChangeForm.$setPristine();
+                    $scope.trustedIpsChangeForm.$setUntouched();
+                    return;
+                }
+
+                $scope.trustedIps.refresh();
+
+                $('#trustedIpsModal').modal('hide');
+            });
+        }
+    };
+
     $scope.sysinfo = {
         busy: false,
         error: {},
@@ -208,7 +265,7 @@ angular.module('Application').controller('NetworkController', ['$scope', '$locat
         newIfname: '',
 
         refresh: function () {
-            Client.getSysinfoConfig(function (error, result) {
+            Client.getIPv4Config(function (error, result) {
                 if (error) return console.error(error);
 
                 $scope.sysinfo.provider = result.provider;
@@ -246,7 +303,7 @@ angular.module('Application').controller('NetworkController', ['$scope', '$locat
                 config.ifname = $scope.sysinfo.newIfname;
             }
 
-            Client.setSysinfoConfig(config, function (error) {
+            Client.setIPv4Config(config, function (error) {
                 $scope.sysinfo.busy = false;
                 if (error && error.message.indexOf('ipv') !== -1) {
                     $scope.sysinfo.error.ipv4 = error.message;
@@ -276,6 +333,7 @@ angular.module('Application').controller('NetworkController', ['$scope', '$locat
 
         $scope.dyndnsConfigure.refresh();
         $scope.ipv6Configure.refresh();
+        $scope.trustedIps.refresh();
         if ($scope.user.isAtLeastOwner) $scope.blocklist.refresh();
     });
 

dashboard/src/views/oidc.html

@@ -1,209 +0,0 @@
-
-<!-- Modal client add -->
-<div class="modal fade" id="clientAddModal" tabindex="-1" role="dialog">
-  <div class="modal-dialog">
-      <div class="modal-content">
-        <div class="modal-header">
-          <h4 class="modal-title">Add client</h4>
-        </div>
-        <div class="modal-body">
-          Add new OpenID connect client settings.
-          <br/>
-          <br/>
-          <form name="clientAddForm" role="form" novalidate ng-submit="clientAdd.submit()" autocomplete="off">
-            <div class="form-group">
-              <label class="control-label" for="clientName">Name</label>
-              <input type="text" id="clientName" class="form-control" name="clientName" ng-model="clientAdd.name" autofocus required/>
-            </div>
-            <div class="form-group" ng-class="{ 'has-error': clientAdd.error.id }">
-              <label class="control-label" for="clientId">Client ID</label>
-              <input type="text" id="clientId" class="form-control" name="clientId" ng-model="clientAdd.id" required/>
-              <div class="control-label" ng-show="clientAdd.error.id">
-                <small>{{ clientAdd.error.id }}</small>
-              </div>
-            </div>
-            <div class="form-group">
-              <label class="control-label" for="clientSecret">Client Secret</label>
-              <input type="text" id="clientSecret" class="form-control" name="clientSecret" ng-model="clientAdd.secret" required/>
-            </div>
-            <div class="form-group">
-              <label class="control-label" for="loginRedirectUri">Login callback Url (comma separated if more than one)</label>
-              <input type="text" id="loginRedirectUri" class="form-control" name="loginRedirectUri" ng-model="clientAdd.loginRedirectUri" required/>
-            </div>
-            <div class="form-group">
-              <label class="control-label" for="logoutRedirectUri">Logout callback Url (optional)</label>
-              <input type="url" id="logoutRedirectUri" class="form-control" name="logoutRedirectUri" ng-model="clientAdd.logoutRedirectUri"/>
-            </div>
-            <div class="form-group">
-              <label class="control-label">Token Signature Algorithm</label>
-              <div class="control-label">
-                <select class="form-control" ng-model="clientAdd.tokenSignatureAlgorithm">
-                  <option value="RS256">RS256</option>
-                  <option value="EdDSA">EdDSA</option>
-                </select>
-              </div>
-            </div>
-            <input class="ng-hide" type="submit" ng-disabled="clientAddForm.$invalid"/>
-          </form>
-        </div>
-        <div class="modal-footer">
-          <button type="button" class="btn btn-default" data-dismiss="modal">{{ 'main.dialog.close' | tr }}</button>
-          <button type="button" class="btn btn-success" ng-click="clientAdd.submit()" ng-disabled="clientAddForm.$invalid || clientAdd.busy">
-            <i class="fa fa-circle-notch fa-spin" ng-show="clientAdd.busy"></i> Create
-          </button>
-        </div>
-      </div>
-  </div>
-</div>
-
-<!-- Modal client edit -->
-<div class="modal fade" id="clientEditModal" tabindex="-1" role="dialog">
-  <div class="modal-dialog">
-      <div class="modal-content">
-        <div class="modal-header">
-          <h4 class="modal-title">Edit client {{ clientEdit.id }}</h4>
-        </div>
-        <div class="modal-body">
-          <form name="clientEditForm" role="form" novalidate ng-submit="clientEdit.submit()" autocomplete="off">
-            <div class="form-group">
-              <label class="control-label" for="inputEditClientName">Name</label>
-              <input type="text" id="inputEditClientName" class="form-control" name="clientName" ng-model="clientEdit.name" autofocus required/>
-            </div>
-            <div class="form-group">
-              <label class="control-label" for="inputEditClientSecret">Client Secret</label>
-              <input type="text" id="inputEditClientSecret" class="form-control" name="clientSecret" ng-model="clientEdit.secret" required/>
-            </div>
-            <div class="form-group">
-              <label class="control-label" for="inputEditLoginRedirectUri">Login callback Url (comma separated if more than one)</label>
-              <input type="text" id="inputEditLoginRedirectUri" class="form-control" name="loginRedirectUri" ng-model="clientEdit.loginRedirectUri" required/>
-            </div>
-            <div class="form-group">
-              <label class="control-label" for="inputEditLogoutRedirectUri">Logout callback Url (optional)</label>
-              <input type="url" id="inputEditLogoutRedirectUri" class="form-control" name="logoutRedirectUri" ng-model="clientEdit.logoutRedirectUri"/>
-            </div>
-            <div class="form-group">
-              <label class="control-label">Token Signature Algorithm</label>
-              <div class="control-label">
-                <select class="form-control" ng-model="clientEdit.tokenSignatureAlgorithm">
-                  <option value="RS256">RS256</option>
-                  <option value="EdDSA">EdDSA</option>
-                </select>
-              </div>
-            </div>
-            <input class="ng-hide" type="submit" ng-disabled="clientEditForm.$invalid"/>
-          </form>
-        </div>
-        <div class="modal-footer">
-          <button type="button" class="btn btn-default" data-dismiss="modal">{{ 'main.dialog.close' | tr }}</button>
-          <button type="button" class="btn btn-success" ng-click="clientEdit.submit()" ng-disabled="clientEditForm.$invalid || clientEdit.busy">
-            <i class="fa fa-circle-notch fa-spin" ng-show="clientEdit.busy"></i> {{ 'main.dialog.save' | tr }}
-          </button>
-        </div>
-      </div>
-  </div>
-</div>
-
-<!-- Modal client delete -->
-<div class="modal fade" id="clientDeleteModal" tabindex="-1" role="dialog">
-  <div class="modal-dialog">
-    <div class="modal-content">
-      <div class="modal-header">
-        <h4 class="modal-title">Really delete client {{ deleteClient.id }}?</h4>
-      </div>
-      <div class="modal-body">
-        <p>This will disconnect all external OpenID apps from this Cloudron using this client ID.</p>
-      </div>
-      <div class="modal-footer">
-        <button type="button" class="btn btn-default" data-dismiss="modal">{{ 'main.dialog.cancel' | tr }}</button>
-        <button type="button" class="btn btn-danger" ng-click="deleteClient.submit()" ng-disabled="deleteClient.busy"><i class="fa fa-circle-notch fa-spin" ng-show="deleteClient.busy"></i> Delete</button>
-      </div>
-    </div>
-  </div>
-</div>
-
-<div class="content">
-
-  <div class="text-left">
-    <h1>OpenID Connect Provider (beta)</h1>
-  </div>
-
-  <div class="card">
-    <div class="grid-item-top">
-      <div class="row">
-        <div class="col-md-12">
-          <table width="100%">
-            <tr>
-              <td class="text-muted" style="vertical-align: top;">Discovery URL</td>
-              <td class="text-right" style="vertical-align: top;" ng-click-select>https://{{ config.adminFqdn }}/.well-known/openid-configuration</td>
-            </tr>
-            <tr>
-              <td class="text-muted" style="vertical-align: top;">Auth Endpoint</td>
-              <td class="text-right" style="vertical-align: top;" ng-click-select>https://{{ config.adminFqdn }}/openid/auth</td>
-            </tr>
-            <tr>
-              <td class="text-muted" style="vertical-align: top;">Token Endpoint</td>
-              <td class="text-right" style="vertical-align: top;" ng-click-select>https://{{ config.adminFqdn }}/openid/token</td>
-            </tr>
-            <tr>
-              <td class="text-muted" style="vertical-align: top;">Keys Endpoint</td>
-              <td class="text-right" style="vertical-align: top;" ng-click-select>https://{{ config.adminFqdn }}/openid/jwks</td>
-            </tr>
-            <tr>
-              <td class="text-muted" style="vertical-align: top;">Profile Endpoint</td>
-              <td class="text-right" style="vertical-align: top;" ng-click-select>https://{{ config.adminFqdn }}/openid/me</td>
-            </tr>
-            <tr>
-              <td class="text-muted" style="vertical-align: top;">Logout URL</td>
-              <td class="text-right" style="vertical-align: top;" ng-click-select>https://{{ config.adminFqdn }}/openid/session/end</td>
-            </tr>
-          </table>
-        </div>
-      </div>
-    </div>
-  </div>
-
-  <br>
-
-  <div class="text-left">
-    <h3>Clients <button class="btn btn-primary btn-sm pull-right" ng-click="clientAdd.show()"><i class="fa fa-plus"></i> New client</button></h3>
-  </div>
-
-  <div class="card">
-    <div class="grid-item-top">
-      <div class="row">
-        <div class="col-xs-12">
-          <table class="table table-hover">
-            <thead>
-              <tr>
-                <th style="width: 33%">Name</th>
-                <th style="width: 33%">Client ID</th>
-                <th style="width: 33%">Signing Algorithm</th>
-                <th style="width: 10%" class="text-right">{{ 'main.actions' | tr }}</th>
-              </tr>
-            </thead>
-            <tbody>
-              <tr ng-show="clients.length === 0">
-                <td colspan="3" class="text-center">No clients yet</td>
-              </tr>
-              <tr ng-repeat="client in clients">
-                <td class="text-left elide-table-cell hand" ng-click="clientEdit.show(client)">
-                  {{ client.name }}
-                </td>
-                <td class="text-left elide-table-cell hand" ng-click="clientEdit.show(client)">
-                  {{ client.id }}
-                </td>
-                <td class="text-left elide-table-cell hand" ng-click="clientEdit.show(client)">
-                  {{ client.tokenSignatureAlgorithm }}
-                </td>
-                <td class="text-right no-wrap" style="vertical-align: bottom">
-                  <button class="btn btn-xs btn-danger" ng-click="deleteClient.show(client)" uib-tooltip="Delete"><i class="far fa-trash-alt"></i></button>
-                  <button class="btn btn-xs btn-default" ng-click="clientEdit.show(client)" uib-tooltip="Edit"><i class="far fa fa-pencil-alt"></i></button>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </div>
-      </div>
-    </div>
-  </div>
-</div>

dashboard/src/views/oidc.js

@@ -1,153 +0,0 @@
-'use strict';
-
-/* global angular */
-/* global $ */
-
-angular.module('Application').controller('OidcController', ['$scope', '$location', 'Client', function ($scope, $location, Client) {
-    Client.onReady(function () { if (!Client.getUserInfo().isAtLeastAdmin) $location.path('/'); });
-
-    $scope.user = Client.getUserInfo();
-    $scope.config = Client.getConfig();
-    $scope.clients = [];
-
-    $scope.refreshClients = function () {
-        Client.getOidcClients(function (error, result) {
-            if (error) return console.error('Failed to load oidc clients', error);
-
-            $scope.clients = result;
-        });
-    };
-
-    $scope.clientAdd = {
-        busy: false,
-        error: {},
-        id: '',
-        name: '',
-        secret: '',
-        loginRedirectUri: '',
-        logoutRedirectUri: '',
-        tokenSignatureAlgorithm: '',
-
-        show: function () {
-            $scope.clientAdd.id = '';
-            $scope.clientAdd.secret = '';
-            $scope.clientAdd.name = '';
-            $scope.clientAdd.loginRedirectUri = '';
-            $scope.clientAdd.logoutRedirectUri = '';
-            $scope.clientAdd.tokenSignatureAlgorithm = 'RS256';
-            $scope.clientAdd.busy = false;
-            $scope.clientAdd.error = null;
-            $scope.clientAddForm.$setPristine();
-
-            $('#clientAddModal').modal('show');
-        },
-
-        submit: function () {
-            $scope.clientAdd.busy = true;
-            $scope.clientAdd.error = {};
-
-            Client.addOidcClient($scope.clientAdd.id, $scope.clientAdd.name, $scope.clientAdd.secret, $scope.clientAdd.loginRedirectUri, $scope.clientAdd.logoutRedirectUri, $scope.clientAdd.tokenSignatureAlgorithm, function (error) {
-                if (error) {
-                    if (error.statusCode === 409) {
-                        $scope.clientAdd.error.id = 'Client ID already exists';
-                        $('#clientId').focus();
-                    } else {
-                        console.error('Unable to add openid client.', error);
-                    }
-
-                    $scope.clientAdd.busy = false;
-
-                    return;
-                }
-
-                $scope.refreshClients();
-                $scope.clientAdd.busy = false;
-
-                $('#clientAddModal').modal('hide');
-            });
-        }
-    };
-
-    $scope.clientEdit = {
-        busy: false,
-        error: {},
-        id: '',
-        name: '',
-        secret: '',
-        loginRedirectUri: '',
-        logoutRedirectUri: '',
-        tokenSignatureAlgorithm: '',
-
-        show: function (client) {
-            $scope.clientEdit.id = client.id;
-            $scope.clientEdit.name = client.name;
-            $scope.clientEdit.secret = client.secret;
-            $scope.clientEdit.loginRedirectUri = client.loginRedirectUri;
-            $scope.clientEdit.logoutRedirectUri = client.logoutRedirectUri;
-            $scope.clientEdit.tokenSignatureAlgorithm = client.tokenSignatureAlgorithm;
-            $scope.clientEdit.busy = false;
-            $scope.clientEdit.error = null;
-            $scope.clientEditForm.$setPristine();
-
-            $('#clientEditModal').modal('show');
-        },
-
-        submit: function () {
-            $scope.clientEdit.busy = true;
-            $scope.clientEdit.error = {};
-
-            Client.updateOidcClient($scope.clientEdit.id, $scope.clientEdit.name, $scope.clientEdit.secret, $scope.clientEdit.loginRedirectUri, $scope.clientEdit.logoutRedirectUri, $scope.clientEdit.tokenSignatureAlgorithm, function (error) {
-                if (error) {
-                    console.error('Unable to edit openid client.', error);
-
-                    $scope.clientEdit.busy = false;
-
-                    return;
-                }
-
-                $scope.refreshClients();
-                $scope.clientEdit.busy = false;
-
-                $('#clientEditModal').modal('hide');
-            });
-        }
-    };
-
-    $scope.deleteClient = {
-        busy: false,
-        error: {},
-        id: '',
-
-        show: function (client) {
-            $scope.deleteClient.busy = false;
-            $scope.deleteClient.id = client.id;
-
-            $('#clientDeleteModal').modal('show');
-        },
-
-        submit: function () {
-            Client.delOidcClient($scope.deleteClient.id, function (error) {
-                $scope.deleteClient.busy = false;
-
-                if (error) return console.error('Failed to delete openid client', error);
-
-                $scope.refreshClients();
-
-                $('#clientDeleteModal').modal('hide');
-            });
-        }
-    };
-
-    Client.onReady(function () {
-        $scope.refreshClients();
-    });
-
-    // setup all the dialog focus handling
-    ['clientAddModal', 'clientEditmodal'].forEach(function (id) {
-        $('#' + id).on('shown.bs.modal', function () {
-            $(this).find('[autofocus]:first').focus();
-        });
-    });
-
-    $('.modal-backdrop').remove();
-}]);

dashboard/src/views/profile.html

@@ -437,8 +437,7 @@
           <br/>
           <button class="btn btn-default" ng-click="backgroundImageChange.show()">Set Background Image</button>
           <button class="btn btn-primary pull-right" ng-click="passwordchange.show()" ng-hide="user.source">{{ 'profile.changePasswordAction' | tr }}</button>
-          <button class="btn pull-right" ng-class="user.twoFactorAuthenticationEnabled ? 'btn-danger' : 'btn-success'" ng-click="twoFactorAuthentication.show()">{{ user.twoFactorAuthenticationEnabled ? 'profile.disable2FAAction' : 'profile.enable2FAAction' | tr }}</button>
-        </div>
+          <button class="btn pull-right" uib-tooltip="{{ user.source ? ('profile.enable2FANotAvailable' | tr) : '' }}" ng-disabled="user.source" ng-class="user.twoFactorAuthenticationEnabled ? 'btn-danger' : 'btn-success'" ng-click="twoFactorAuthentication.show()">{{ user.twoFactorAuthenticationEnabled ? 'profile.disable2FAAction' : 'profile.enable2FAAction' | tr }}</button>        </div>
       </div>
     </div>
   </div>
@@ -541,8 +540,8 @@
     <div class="grid-item-top">
       <div class="row">
         <div class="col-xs-12">
-          <p>{{ 'profile.loginTokens.description' | tr:{ webadminTokenCount: tokens.webadminTokens.length, cliTokenCount: cliTokens.length } }}</p>
-          <button class="btn btn-outline btn-danger pull-right" ng-click="logoutFromAll()" ng-disabled="tokens.busy"><i class="fa fa-circle-notch fa-spin" ng-show="tokens.busy"></i> {{ 'profile.loginTokens.logoutAll' | tr }}</button>
+          <p>{{ 'profile.loginTokens.description' | tr:{ webadminTokenCount: tokens.webadminTokens.length, cliTokenCount: tokens.cliTokens.length } }}</p>
+          <button class="btn btn-outline btn-danger pull-right" ng-click="tokens.revokeAllWebAndCliTokens()" ng-disabled="tokens.busy"><i class="fa fa-circle-notch fa-spin" ng-show="tokens.busy"></i> {{ 'profile.loginTokens.logoutAll' | tr }}</button>
         </div>
       </div>
     </div>

dashboard/src/views/profile.js

@@ -3,6 +3,7 @@
 /* global async, Clipboard */
 /* global angular */
 /* global $ */
+/* global TOKEN_TYPES */
 
 angular.module('Application').controller('ProfileController', ['$scope', '$translate', '$location', 'Client', '$timeout', function ($scope, $translate, $location, Client, $timeout) {
     $scope.user = Client.getUserInfo();
@@ -636,9 +637,10 @@ angular.module('Application').controller('ProfileController', ['$scope', '$trans
                 $scope.tokens.busy = false;
                 $scope.tokens.allTokens = result;
 
-                $scope.tokens.webadminTokens = result.filter(function (c) { return c.clientId === 'cid-webadmin'; });
-                $scope.tokens.cliTokens = result.filter(function (c) { return c.clientId === 'cid-cli'; });
-                $scope.tokens.apiTokens = result.filter(function (c) { return c.clientId === 'cid-sdk'; });
+                // dashboard and development clientIds were issued with 7.5.0
+                $scope.tokens.webadminTokens = result.filter(function (c) { return c.clientId === TOKEN_TYPES.ID_WEBADMIN || c.clientId === TOKEN_TYPES.ID_DEVELOPMENT || c.clientId === 'dashboard' || c.clientId === 'development'; });
+                $scope.tokens.cliTokens = result.filter(function (c) { return c.clientId === TOKEN_TYPES.ID_CLI; });
+                $scope.tokens.apiTokens = result.filter(function (c) { return c.clientId === TOKEN_TYPES.ID_SDK; });
             });
         },
 
@@ -709,14 +711,6 @@ angular.module('Application').controller('ProfileController', ['$scope', '$trans
         }
     };
 
-    $scope.logoutFromAll = function () {
-        Client.destroyOidcSession(function (error) {
-            if (error) console.error('Failed to destroy oidc session', error);
-
-            $scope.tokens.revokeAllWebAndCliTokens();
-        });
-    };
-
     Client.onReady(function () {
         $scope.appPassword.refresh();
         $scope.tokens.refresh();

dashboard/src/views/services.html

@@ -81,7 +81,7 @@
                   <td class="elide-table-cell"></td>
                   <td class="elide-table-cell text-center"></td>
                   <td class="text-right no-wrap" style="vertical-align: bottom">
-                    <a class="btn btn-xs btn-default" href="/logs.html?id=box" target="_blank" uib-tooltip="{{ 'logs.title' | tr }}"><i class="fa fa-file-alt"></i></a>
+                    <a class="btn btn-xs btn-default" href="/frontend/logs.html?id=box" target="_blank" uib-tooltip="{{ 'logs.title' | tr }}"><i class="fa fa-file-alt"></i></a>
                   </td>
                 </tr>
                 <tr ng-repeat="service in services | filter:{ isRedis: false } | orderBy:'name'">
@@ -105,7 +105,7 @@
                   </td>
                   <td class="elide-table-cell">
                     <div class="progress progress-striped" ng-show="service.config.memoryLimit">
-                      <div class="progress-bar progress-bar-success" role="progressbar" style="width: {{ service.memoryPercent }}%"></div>
+                      <div class="progress-bar progress-bar-success" role="progressbar" style="width: {{ service.memoryPercent }}%">{{ service.memoryPercent }}%</div>
                     </div>
                   </td>
                   <td class="elide-table-cell text-center">
@@ -114,7 +114,7 @@
                   <td class="text-right no-wrap" style="vertical-align: bottom">
                     <button class="btn btn-xs btn-default" ng-click="serviceConfigure.show(service)" uib-tooltip="{{ 'services.configureActionTooltip' | tr }}" ng-disabled="!service.config.memoryLimit"><i class="fa fa-pencil-alt"></i></button>
                     <button class="btn btn-xs btn-default" ng-click="restartService(service.name)" uib-tooltip="{{ 'services.restartActionTooltip' | tr }}"><i class="fa fa-sync-alt" ng-class="{ 'fa-spin': service.status === 'starting' && !service.config.recoveryMode }"></i></button>
-                    <a class="btn btn-xs btn-default" ng-href="{{ '/logs.html?id=' + service.name }}" target="_blank" uib-tooltip="{{ 'logs.title' | tr }}"><i class="fa fa-file-alt"></i></a>
+                    <a class="btn btn-xs btn-default" ng-href="{{ '/frontend/logs.html?id=' + service.name }}" target="_blank" uib-tooltip="{{ 'logs.title' | tr }}"><i class="fa fa-file-alt"></i></a>
                   </td>
                 </tr>
                 <tr ng-show="hasRedisServices" ng-click="redisServicesExpanded = !redisServicesExpanded" class="hand">
@@ -142,7 +142,7 @@
                   <td class="text-right no-wrap" style="vertical-align: bottom">
                     <button class="btn btn-xs btn-default" ng-click="serviceConfigure.show(service)" uib-tooltip="{{ 'services.configureActionTooltip' | tr }}" ng-show="service.config.memoryLimit"><i class="fa fa-pencil-alt"></i></button>
                     <button class="btn btn-xs btn-default" ng-click="restartService(service.name)" uib-tooltip="{{ 'services.restartActionTooltip' | tr }}"><i class="fa fa-sync-alt" ng-class="{ 'fa-spin': service.status === 'starting' && !service.config.recoveryMode }"></i></button>
-                    <a class="btn btn-xs btn-default" ng-href="{{ '/logs.html?id=' + service.name }}" target="_blank" uib-tooltip="{{ 'logs.title' | tr }}"><i class="fa fa-file-alt"></i></a>
+                    <a class="btn btn-xs btn-default" ng-href="{{ '/frontend/logs.html?id=' + service.name }}" target="_blank" uib-tooltip="{{ 'logs.title' | tr }}"><i class="fa fa-file-alt"></i></a>
                   </td>
                 </tr>
               </tbody>

dashboard/src/views/settings.html

@@ -204,7 +204,7 @@
     </div>
   </div>
 
-  <div class="text-left">
+  <div class="text-left section-header">
     <h3>{{ 'settings.timezone.title' | tr }}</h3>
   </div>
 
@@ -228,7 +228,7 @@
     </div>
   </div>
 
-  <div class="text-left">
+  <div class="text-left section-header">
     <h3>{{ 'settings.language.title' | tr }}</h3>
   </div>
 
@@ -251,8 +251,22 @@
     </div>
   </div>
 
-  <div class="text-left">
-    <h3>{{ 'settings.updates.title' | tr }}</h3>
+  <div class="text-left section-header">
+    <h3>
+      {{ 'settings.updates.title' | tr }}
+      <div class="btn-group btn-group-sm pull-right">
+        <button type="button" class="btn btn-small btn-default dropdown-toggle" ng-show="update.tasks.length" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" uib-tooltip="{{ 'settings.updates.showLogsAction' | tr }}">
+          <i class="fas fa-align-left"></i> <span class="caret"></span>
+        </button>
+        <ul class="dropdown-menu">
+          <li ng-repeat="task in update.tasks">
+            <a ng-href="/frontend/logs.html?taskId={{task.id}}" target="_blank" class="text-right">
+            {{ task.ts | prettyLongDate }} <i class="fa" style="margin-left: 20px" ng-class="{ 'status-active fa-check-circle': !task.active && task.success, 'fa-circle-notch fa-spin': task.active, 'status-error fa-times-circle': !task.active && !task.success }"></i>
+            </a>
+          </li>
+        </ul>
+      </div>
+    </h3>
   </div>
 
   <div class="card" style="margin-bottom: 15px;">
@@ -286,7 +300,6 @@
     <div class="row" ng-show="update.busy">
       <div class="col-md-12">
         <p >{{ update.message }}</p>
-        <p class="has-error" ng-show="update.errorMessage">{{ update.errorMessage }}. <a ng-class="warning" ng-href="/logs.html?taskId={{update.taskId}}" target="_blank">{{ 'settings.updates.showLogsAction' | tr }}</a></p>
       </div>
     </div>
 
@@ -300,7 +313,7 @@
     </div>
   </div>
 
-  <div class="text-left">
+  <div class="text-left section-header">
     <h3>{{ 'settings.privateDockerRegistry.title' | tr }}</h3>
   </div>
 

dashboard/src/views/settings.js

@@ -1,7 +1,7 @@
 'use strict';
 
 /* global angular:false */
-/* global $:false */
+/* global $:false, TASK_TYPES */
 
 angular.module('Application').controller('SettingsController', ['$scope', '$location', '$translate', '$rootScope', '$timeout', 'Client', function ($scope, $location, $translate, $rootScope, $timeout, Client) {
     Client.onReady(function () { if (!Client.getUserInfo().isAtLeastAdmin) $location.path('/'); });
@@ -87,8 +87,16 @@ angular.module('Application').controller('SettingsController', ['$scope', '$loca
         percent: 0,
         message: 'Downloading',
         errorMessage: '', // this shows inline
-        taskId: '',
         skipBackup: false,
+        tasks: [],
+
+        refreshTasks: function () {
+            Client.getTasksByType(TASK_TYPES.TASK_UPDATE, function (error, tasks) {
+                if (error) return console.error(error);
+                $scope.update.tasks = tasks.slice(0, 10);
+                if ($scope.update.tasks.length && $scope.update.tasks[0].active) $scope.update.updateStatus();
+            });
+        },
 
         checkNow: function () {
             $scope.update.checking = true;
@@ -108,7 +116,9 @@ angular.module('Application').controller('SettingsController', ['$scope', '$loca
         },
 
         stopUpdate: function () {
-            Client.stopTask($scope.update.taskId, function (error) {
+            var taskId = $scope.update.tasks[0].id;
+
+            Client.stopTask(taskId, function (error) {
                 if (error) {
                     if (error.statusCode === 409) {
                         $scope.update.errorMessage = 'No update is currently in progress';
@@ -124,18 +134,8 @@ angular.module('Application').controller('SettingsController', ['$scope', '$loca
             });
         },
 
-        checkStatus: function () {
-            Client.getLatestTaskByType('update', function (error, task) {
-                if (error) return console.error(error);
-                if (!task) return;
-
-                $scope.update.taskId = task.id;
-                $scope.update.updateStatus();
-            });
-        },
-
         reloadIfNeeded: function () {
-            Client.getStatus(function (error, status) {
+            Client.getProvisionStatus(function (error, status) {
                 if (error) return $scope.error(error);
 
                 if (window.localStorage.version !== status.version) window.location.reload(true);
@@ -143,7 +143,9 @@ angular.module('Application').controller('SettingsController', ['$scope', '$loca
         },
 
         updateStatus: function () {
-            Client.getTask($scope.update.taskId, function (error, data) {
+            var taskId = $scope.update.tasks[0].id;
+
+            Client.getTask(taskId, function (error, data) {
                 if (error) return window.setTimeout($scope.update.updateStatus, 5000);
 
                 if (!data.active) {
@@ -154,6 +156,8 @@ angular.module('Application').controller('SettingsController', ['$scope', '$loca
 
                     if (!data.errorMessage) $scope.update.reloadIfNeeded(); // assume success
 
+                    $scope.update.refreshTasks(); // redundant... update the tasks list dropdown
+
                     return;
                 }
 
@@ -172,7 +176,7 @@ angular.module('Application').controller('SettingsController', ['$scope', '$loca
             $scope.update.message = '';
             $scope.update.errorMessage = '';
 
-            Client.update({ skipBackup: $scope.update.skipBackup }, function (error, taskId) {
+            Client.update({ skipBackup: $scope.update.skipBackup }, function (error /*, taskId */) {
                 if (error) {
                     $scope.update.error.generic = error.message;
                     $scope.update.busy = false;
@@ -181,8 +185,7 @@ angular.module('Application').controller('SettingsController', ['$scope', '$loca
 
                 $('#updateModal').modal('hide');
 
-                $scope.update.taskId = taskId;
-                $scope.update.updateStatus();
+                $scope.update.refreshTasks();
             });
         }
     };
@@ -430,7 +433,7 @@ angular.module('Application').controller('SettingsController', ['$scope', '$loca
             });
         });
 
-        $scope.update.checkStatus();
+        $scope.update.refreshTasks();
 
         if ($scope.user.isAtLeastOwner) getSubscription();
     });

dashboard/src/views/support.html

@@ -33,6 +33,7 @@
               <select class="form-control" name="type" style="width: 50%;" ng-model="feedback.type" required ng-disabled="!subscription.emailVerified">
                 <option value="app_error">{{ 'support.ticket.typeApp' | tr }}</option>
                 <option value="ticket">{{ 'support.ticket.typeBug' | tr }}</option>
+                <option value="billing">{{ 'support.ticket.typeBilling' | tr }}</option>
                 <option value="email_error">{{ 'support.ticket.typeEmail' | tr }}</option>
               </select>
             </div>
@@ -69,7 +70,7 @@
     </div>
   </div>
 
-  <div class="text-left">
+  <div class="text-left section-header">
     <h3>{{ 'support.remoteSupport.title' | tr }}</h3>
   </div>
 

dashboard/src/views/system.html

@@ -4,7 +4,7 @@
     <div class="col-md-12">
       <h1>
         {{ 'system.title' | tr }}
-        <a class="btn btn-default pull-right" href="/logs.html?id=box" target="_blank">{{ 'main.action.logs' | tr }}</a>
+        <a class="btn btn-default pull-right" href="/frontend/logs.html?id=box" target="_blank">{{ 'main.action.logs' | tr }}</a>
         <button class="btn btn-default pull-right" ng-click="$parent.reboot.show()">{{ 'main.action.reboot' | tr }}</button>
       </h1>
     </div>
@@ -68,6 +68,7 @@
         </div>
         <div ng-hide="disks.busy" class="ng-hide">
           <div class="row" ng-repeat="disk in disks.disks" style="margin-bottom: 20px;">
+            <hr style="margin: 5px 0px;" ng-show="$index !== 0"/>
             <div class="col-md-12">
               <div style="display: flex; align-items: baseline; justify-content: space-between;">
                 <h3 class="no-wrap" style="font-size: 20px;" ng-bind-html="'system.diskUsage.mountedAt' | tr:{ filesystem: disk.filesystem, mountpoint: disk.mountpoint }"></h3>
@@ -78,11 +79,12 @@
                 <div class="progress-bar" ng-repeat="content in disk.contents" style="width: {{ content.usage / disk.size * 100 }}%; background-color: {{ content.color }};" uib-tooltip="{{ content.label + ' ' + (content.usage | prettyDiskSize) }}"></div>
                 <div class="text-center text-muted" style="font-size: 12px; line-height: 20px;">{{ disk.available | prettyDiskSize }}</div>
               </div>
-              <div class="text-right text-muted" style="margin-top: 10px;">{{ 'system.diskUsage.diskSpeed' | tr:{ speed: disk.speed } }}</div>
+              <div class="text-right text-muted" style="margin-top: 10px;" ng-show="disk.speed !== -1">{{ 'system.diskUsage.diskSpeed' | tr:{ speed: disk.speed } }}</div>
               <p ng-hide="disk.volume">{{ 'system.diskUsage.diskContent' | tr }}:</p>
               <p ng-show="disk.volume" ng-bind-html="'system.diskUsage.volumeContent' | tr:{ name: disk.volume.name }"></p>
               <div ng-repeat="content in disk.contents" class="disk-content">
                 <span class="color-indicator" style="background-color: {{ content.color }};">&nbsp;</span>
+                <span ng-show="content.type === 'cloudron-backup-default'">{{ content.path }} (Old Backups)</span>
                 <span ng-show="content.type === 'standard'">{{ content.label || content.id }}</span>
                 <span ng-show="content.type === 'swap'">{{ content.id }}</span>
                 <span ng-show="content.type === 'app'">

dashboard/src/views/system.js

@@ -85,14 +85,18 @@ angular.module('Application').controller('SystemController', ['$scope', '$locati
                     disk.contents.forEach(function (content) { if (content.path === disk.mountpoint) disk.volume = $scope.volumesById[content.id]; });
                     disk.contents = disk.contents.filter(function (content) { return content.path !== disk.mountpoint; });
 
+                    // only show old backups if the size is significant
+                    disk.contents = disk.contents.filter(function (content) { return content.id !== 'cloudron-backup-default' || content.usage > 1024*1024*1024; });
+
                     disk.contents.forEach(function (content) {
                         content.color = getNextColor();
 
                         if (content.type === 'app') {
                             content.app = Client.getInstalledAppsByAppId()[content.id];
                             if (!content.app) content.uninstalled = true;
+                        } else if (content.type === 'volume') {
+                            content.volume = $scope.volumesById[content.id];
                         }
-                        if (content.type === 'volume') content.volume = $scope.volumesById[content.id];
 
                         usageOther -= content.usage;
                     });

dashboard/src/views/user-settings.html

@@ -0,0 +1,531 @@
+<!-- Modal external ldap -->
+<div class="modal fade" id="externalLdapModal" tabindex="-1" role="dialog">
+  <div class="modal-dialog">
+    <div class="modal-content">
+      <div class="modal-header">
+        <h4 class="modal-title">{{ 'users.externalLdapDialog.title' | tr }}</h4>
+      </div>
+      <div class="modal-body">
+        <p class="has-error text-center" ng-show="externalLdap.error.generic">{{ externalLdap.error.generic }}</p>
+
+        <div class="form-group">
+          <label class="control-label" for="ldapProvider">{{ 'users.externalLdap.provider' | tr }} <sup><a ng-href="https://docs.cloudron.io/user-management/#external-directory" class="help" target="_blank"><i class="fa fa-question-circle"></i></a></sup></label>
+          <select class="form-control" id="ldapProvider" ng-model="externalLdap.provider" ng-options="a.value as a.name for a in ldapProvider"></select>
+        </div>
+
+        <div uib-collapse="externalLdap.provider === 'noop'">
+          <form name="externalLdapConfigForm" role="form" novalidate ng-submit="externalLdap.submit()" autocomplete="off">
+            <fieldset>
+              <div class="form-group" ng-class="{ 'has-error': externalLdap.error.url }">
+                <label class="control-label" for="inputExternalLdapConfigUrl">{{ 'users.externalLdap.server' | tr }}</label>
+                <input type="text" class="form-control" ng-model="externalLdap.url" id="inputExternalLdapConfigUrl" name="url" ng-disabled="externalLdap.busy" placeholder="ldaps://example.com:636" required>
+              </div>
+
+              <div class="form-group">
+                <div class="checkbox">
+                  <label>
+                    <input type="checkbox" ng-model="externalLdap.acceptSelfSignedCerts"> {{ 'users.externalLdap.acceptSelfSignedCert' | tr }}
+                  </label>
+                </div>
+                <p class="has-error" ng-show="externalLdap.error.acceptSelfSignedCerts">{{ 'users.externalLdap.errorSelfSignedCert' | tr }}</p>
+              </div>
+
+              <div class="form-group" ng-class="{ 'has-error': externalLdap.error.baseDn }" ng-show="externalLdap.provider !== 'cloudron'">
+                <label class="control-label" for="inputExternalLdapConfigBaseDn">{{ 'users.externalLdap.baseDn' | tr }}</label>
+                <input type="text" class="form-control" ng-model="externalLdap.baseDn" id="inputExternalLdapConfigBaseDn" name="baseDn" ng-disabled="externalLdap.busy" placeholder="ou=users,dc=example,dc=com" ng-required="externalLdap.provider !== 'cloudron'">
+              </div>
+
+              <div class="form-group" ng-class="{ 'has-error': externalLdap.error.filter }" ng-show="externalLdap.provider !== 'cloudron'">
+                <label class="control-label" for="inputExternalLdapConfigFilter">{{ 'users.externalLdap.filter' | tr }}</label>
+                <input type="text" class="form-control" ng-model="externalLdap.filter" id="inputExternalLdapConfigFilter" name="filter" ng-disabled="externalLdap.busy" placeholder="(objectClass=inetOrgPerson)"  ng-required="externalLdap.provider !== 'cloudron'">
+              </div>
+
+              <div class="form-group" ng-class="{ 'has-error': externalLdap.error.usernameField }" ng-show="externalLdap.provider !== 'cloudron'">
+                <label class="control-label" for="inputExternalLdapConfigUsernameField">{{ 'users.externalLdap.usernameField' | tr }}</label>
+                <input type="text" class="form-control" ng-model="externalLdap.usernameField" id="inputExternalLdapConfigUsernameField" name="usernameField" ng-disabled="externalLdap.busy" placeholder="uid or sAMAcountName">
+              </div>
+
+              <div class="form-group">
+                <div class="checkbox">
+                  <label>
+                    <input type="checkbox" ng-model="externalLdap.syncGroups"> {{ 'users.externalLdap.syncGroups' | tr }}</sup>
+                  </label>
+                </div>
+              </div>
+
+              <div class="form-group" ng-class="{ 'has-error': externalLdap.error.groupBaseDn }" ng-show="externalLdap.syncGroups && externalLdap.provider !== 'cloudron'">
+                <label class="control-label" for="inputExternalLdapConfigGroupBaseDn">{{ 'users.externalLdap.groupBaseDn' | tr }}</label>
+                <input type="text" class="form-control" ng-model="externalLdap.groupBaseDn" id="inputExternalLdapConfigGroupBaseDn" name="groupBaseDn" ng-disabled="externalLdap.busy" placeholder="ou=groups,dc=example,dc=com" ng-required="externalLdap.syncGroups && externalLdap.provider !== 'cloudron'">
+              </div>
+
+              <div class="form-group" ng-class="{ 'has-error': externalLdap.error.groupFilter }" ng-show="externalLdap.syncGroups && externalLdap.provider !== 'cloudron'">
+                <label class="control-label" for="inputExternalLdapConfigGroupFilter">{{ 'users.externalLdap.groupFilter' | tr }}</label>
+                <input type="text" class="form-control" ng-model="externalLdap.groupFilter" id="inputExternalLdapConfigGroupFilter" name="groupFilter" ng-disabled="externalLdap.busy" placeholder="(objectClass=groupOfNames)" ng-required="externalLdap.syncGroups && externalLdap.provider !== 'cloudron'">
+              </div>
+
+              <div class="form-group" ng-class="{ 'has-error': externalLdap.error.groupnameField }" ng-show="externalLdap.syncGroups && externalLdap.provider !== 'cloudron'">
+                <label class="control-label" for="inputExternalLdapConfigGroupnameField">{{ 'users.externalLdap.groupnameField' | tr }}</label>
+                <input type="text" class="form-control" ng-model="externalLdap.groupnameField" id="inputExternalLdapConfigGroupnameField" name="groupnameField" ng-disabled="externalLdap.busy" placeholder="cn" ng-required="externalLdap.syncGroups && externalLdap.provider !== 'cloudron'">
+              </div>
+
+              <div class="form-group" ng-class="{ 'has-error': externalLdap.error.credentials }" ng-show="externalLdap.provider !== 'cloudron'">
+                <label class="control-label" for="inputExternalLdapConfigBindDn">{{ 'users.externalLdap.bindUsername' | tr }}</label>
+                <input type="text" class="form-control" ng-model="externalLdap.bindDn" id="inputExternalLdapConfigBindDn" name="bindDn" ng-disabled="externalLdap.busy" placeholder="uid=admin,ou=Users,dc=example,dc=com">
+              </div>
+
+              <div class="form-group" ng-class="{ 'has-error': externalLdap.error.credentials }">
+                <label class="control-label" for="inputExternalLdapConfigBindPassword">{{ 'users.externalLdap.bindPassword' | tr }}</label>
+                <input type="password" class="form-control" ng-model="externalLdap.bindPassword" id="inputExternalLdapConfigBindPassword" name="bindPassword" ng-disabled="externalLdap.busy" placeholder="" password-reveal>
+              </div>
+
+              <div class="form-group">
+                <div class="checkbox">
+                  <label>
+                    <input type="checkbox" ng-model="externalLdap.autoCreate"> {{ 'users.externalLdap.autocreateUsersOnLogin' | tr }}
+                  </label>
+                </div>
+              </div>
+
+              <input class="ng-hide" type="submit" ng-disabled="externalLdapConfigForm.$invalid"/>
+            </fieldset>
+          </form>
+        </div>
+      </div>
+      <div class="modal-footer">
+        <button type="button" class="btn btn-default" data-dismiss="modal">{{ 'main.dialog.cancel' | tr }}</button>
+        <button type="button" class="btn btn-primary" ng-click="externalLdap.submit()" ng-disabled="externalLdapConfigForm.$invalid || externalLdap.busy"><i class="fa fa-circle-notch fa-spin" ng-show="externalLdap.busy"></i> {{ 'main.dialog.save' | tr }}</button>
+      </div>
+    </div>
+  </div>
+</div>
+
+
+<!-- Modal client add -->
+<div class="modal fade" id="oidcClientAddModal" tabindex="-1" role="dialog">
+  <div class="modal-dialog">
+      <div class="modal-content">
+        <div class="modal-header">
+          <h4 class="modal-title">{{ 'oidc.newClientDialog.title' | tr }}</h4>
+        </div>
+        <div class="modal-body">
+          {{ 'oidc.newClientDialog.description' | tr }}
+          <br/>
+          <br/>
+          <form name="clientAddForm" role="form" novalidate ng-submit="clientAdd.submit()" autocomplete="off">
+            <div class="form-group">
+              <label class="control-label" for="clientName">{{ 'oidc.client.name' | tr }}</label>
+              <input type="text" id="clientName" class="form-control" name="clientName" ng-model="clientAdd.name" autofocus required/>
+            </div>
+            <div class="form-group" ng-class="{ 'has-error': clientAdd.error.id }">
+              <label class="control-label" for="clientId">{{ 'oidc.client.id' | tr }}</label>
+              <input type="text" id="clientId" class="form-control" name="clientId" ng-model="clientAdd.id" required/>
+              <div class="control-label" ng-show="clientAdd.error.id">
+                <small>{{ clientAdd.error.id }}</small>
+              </div>
+            </div>
+            <div class="form-group">
+              <label class="control-label" for="clientSecret">{{ 'oidc.client.secret' | tr }}</label>
+              <input type="text" id="clientSecret" class="form-control" name="clientSecret" ng-model="clientAdd.secret" required/>
+            </div>
+            <div class="form-group">
+              <label class="control-label" for="loginRedirectUri">{{ 'oidc.client.loginRedirectUri' | tr }}</label>
+              <input type="text" id="loginRedirectUri" class="form-control" name="loginRedirectUri" ng-model="clientAdd.loginRedirectUri" required/>
+            </div>
+            <div class="form-group">
+              <label class="control-label">{{ 'oidc.client.signingAlgorithm' | tr }}</label>
+              <div class="control-label">
+                <select class="form-control" ng-model="clientAdd.tokenSignatureAlgorithm">
+                  <option value="RS256">RS256</option>
+                  <option value="EdDSA">EdDSA</option>
+                </select>
+              </div>
+            </div>
+            <input class="ng-hide" type="submit" ng-disabled="clientAddForm.$invalid"/>
+          </form>
+        </div>
+        <div class="modal-footer">
+          <button type="button" class="btn btn-default" data-dismiss="modal">{{ 'main.dialog.close' | tr }}</button>
+          <button type="button" class="btn btn-success" ng-click="clientAdd.submit()" ng-disabled="clientAddForm.$invalid || clientAdd.busy">
+            <i class="fa fa-circle-notch fa-spin" ng-show="clientAdd.busy"></i> {{ 'oidc.newClientDialog.createAction' | tr }}
+          </button>
+        </div>
+      </div>
+  </div>
+</div>
+
+<!-- Modal client edit -->
+<div class="modal fade" id="oidcClientEditModal" tabindex="-1" role="dialog">
+  <div class="modal-dialog">
+      <div class="modal-content">
+        <div class="modal-header">
+          <h4 class="modal-title">{{ 'oidc.editClientDialog.title' | tr:{ client: clientEdit.id } }}</h4>
+        </div>
+        <div class="modal-body">
+          <form name="clientEditForm" role="form" novalidate ng-submit="clientEdit.submit()" autocomplete="off">
+            <div class="form-group">
+              <label class="control-label" for="inputEditClientName">{{ 'oidc.client.name' | tr }}</label>
+              <input type="text" id="inputEditClientName" class="form-control" name="clientName" ng-model="clientEdit.name" autofocus required/>
+            </div>
+            <div class="form-group">
+              <label class="control-label" for="inputEditClientSecret">{{ 'oidc.client.secret' | tr }}</label>
+              <input type="text" id="inputEditClientSecret" class="form-control" name="clientSecret" ng-model="clientEdit.secret" required/>
+            </div>
+            <div class="form-group">
+              <label class="control-label" for="inputEditLoginRedirectUri">{{ 'oidc.client.loginRedirectUri' | tr }}</label>
+              <input type="text" id="inputEditLoginRedirectUri" class="form-control" name="loginRedirectUri" ng-model="clientEdit.loginRedirectUri" required/>
+            </div>
+
+            <div class="form-group">
+              <label class="control-label">{{ 'oidc.client.signingAlgorithm' | tr }}</label>
+              <div class="control-label">
+                <select class="form-control" ng-model="clientEdit.tokenSignatureAlgorithm">
+                  <option value="RS256">RS256</option>
+                  <option value="EdDSA">EdDSA</option>
+                </select>
+              </div>
+            </div>
+            <input class="ng-hide" type="submit" ng-disabled="clientEditForm.$invalid"/>
+          </form>
+        </div>
+        <div class="modal-footer">
+          <button type="button" class="btn btn-default" data-dismiss="modal">{{ 'main.dialog.close' | tr }}</button>
+          <button type="button" class="btn btn-success" ng-click="clientEdit.submit()" ng-disabled="clientEditForm.$invalid || clientEdit.busy">
+            <i class="fa fa-circle-notch fa-spin" ng-show="clientEdit.busy"></i> {{ 'main.dialog.save' | tr }}
+          </button>
+        </div>
+      </div>
+  </div>
+</div>
+
+<!-- Modal client delete -->
+<div class="modal fade" id="oidcClientDeleteModal" tabindex="-1" role="dialog">
+  <div class="modal-dialog">
+    <div class="modal-content">
+      <div class="modal-header">
+        <h4 class="modal-title">{{ 'oidc.deleteClientDialog.title' | tr:{ client: deleteClient.id } }}</h4>
+      </div>
+      <div class="modal-body">
+        <p>{{ 'oidc.deleteClientDialog.description' | tr }}</p>
+      </div>
+      <div class="modal-footer">
+        <button type="button" class="btn btn-default" data-dismiss="modal">{{ 'main.dialog.cancel' | tr }}</button>
+        <button type="button" class="btn btn-danger" ng-click="deleteClient.submit()" ng-disabled="deleteClient.busy"><i class="fa fa-circle-notch fa-spin" ng-show="deleteClient.busy"></i> {{ 'main.dialog.delete' | tr }}</button>
+      </div>
+    </div>
+  </div>
+</div>
+
+<div class="content content-large">
+
+  <div class="text-left">
+    <h1>
+      {{ 'users.title' | tr }}
+    </h1>
+  </div>
+
+  <div class="card card-large">
+    <form name="profileConfigForm" role="form" novalidate ng-submit="profileConfig.submit()" autocomplete="off">
+      <fieldset ng-disabled="profileConfig.busy">
+        <div class="checkbox">
+          <label>
+            <input type="checkbox" ng-model="profileConfig.editableUserProfiles"> {{ 'users.settings.allowProfileEditCheckbox' | tr }} <sup><a ng-href="https://docs.cloudron.io/user-management/#lock-profile" class="help" target="_blank"><i class="fa fa-question-circle"></i></a></sup>
+          </label>
+        </div>
+        <div class="checkbox">
+          <label>
+            <input type="checkbox" ng-model="profileConfig.mandatory2FA"> {{ 'users.settings.require2FACheckbox' | tr }}
+          </label>
+        </div>
+      </fieldset>
+    </form>
+
+    <br/>
+
+    <div class="row">
+      <div class="col-md-12">
+        <span class="has-error" ng-show="profileConfig.errorMessage">{{ profileConfig.errorMessage }}</span>
+
+        <button class="btn btn-outline btn-primary pull-right" ng-click="profileConfig.submit()" ng-disabled="!profileConfigForm.$dirty || profileConfig.busy">
+          <i class="fa fa-circle-notch fa-spin" ng-show="profileConfig.busy"></i> {{ 'users.settings.saveAction' | tr }}
+        </button>
+      </div>
+    </div>
+
+  </div>
+
+  <div class="text-left section-header">
+    <h3>{{ 'users.externalLdap.title' | tr }}</h3>
+  </div>
+
+  <div class="card card-large">
+    <div class="row">
+      <div class="col-md-12">{{ 'users.externalLdap.description' | tr }}</div>
+    </div>
+
+    <br/>
+
+    <div class="row" ng-hide="config.features.externalLdap">
+      <div class="col-md-12">
+        {{ 'users.externalLdap.subscriptionRequired' | tr }} <a href="" class="pull-right" ng-click="openSubscriptionSetup()">{{ 'users.externalLdap.subscriptionRequiredAction' | tr }}</a>
+      </div>
+    </div>
+
+    <div ng-show="config.features.externalLdap">
+
+      <div class="row" ng-show="externalLdap.currentConfig.provider === 'noop'">
+        <div class="col-xs-12">
+          <span class="text-muted">{{ 'users.externalLdap.noopInfo' | tr }}</span>
+        </div>
+      </div>
+
+      <div class="row" ng-show="externalLdap.currentConfig.provider !== 'noop'">
+        <div class="col-xs-6">
+          <span class="text-muted">{{ 'users.externalLdap.provider' | tr }}</span>
+        </div>
+        <div class="col-xs-6 text-right">
+          <span>{{ externalLdap.currentConfig.provider }}</span>
+        </div>
+      </div>
+
+      <div class="row" ng-show="externalLdap.currentConfig.provider !== 'noop'">
+        <div class="col-xs-6">
+          <span class="text-muted">{{ 'users.externalLdap.server' | tr }}</span>
+        </div>
+        <div class="col-xs-6 text-right">
+          <span>{{ externalLdap.currentConfig.url }}</span>
+        </div>
+      </div>
+
+      <div class="row" ng-show="externalLdap.currentConfig.provider !== 'noop'">
+        <div class="col-xs-6">
+          <span class="text-muted">{{ 'users.externalLdap.acceptSelfSignedCert' | tr }}</span>
+        </div>
+        <div class="col-xs-6 text-right">
+          <span>{{ externalLdap.currentConfig.acceptSelfSignedCerts ? 'Yes' : 'No' }}</span>
+        </div>
+      </div>
+
+      <div class="row" ng-show="externalLdap.currentConfig.provider !== 'noop' && externalLdap.currentConfig.provider !== 'cloudron'">
+        <div class="col-xs-6">
+          <span class="text-muted">{{ 'users.externalLdap.baseDn' | tr }}</span>
+        </div>
+        <div class="col-xs-6 text-right">
+          <span>{{ externalLdap.currentConfig.baseDn }}</span>
+        </div>
+      </div>
+
+      <div class="row" ng-show="externalLdap.currentConfig.provider !== 'noop' && externalLdap.currentConfig.provider !== 'cloudron'">
+        <div class="col-xs-6">
+          <span class="text-muted">{{ 'users.externalLdap.filter' | tr }}</span>
+        </div>
+        <div class="col-xs-6 text-right">
+          <span>{{ externalLdap.currentConfig.filter }}</span>
+        </div>
+      </div>
+
+      <div class="row" ng-show="externalLdap.currentConfig.provider !== 'noop' && externalLdap.currentConfig.provider !== 'cloudron'">
+        <div class="col-xs-6">
+          <span class="text-muted">{{ 'users.externalLdap.usernameField' | tr }}</span>
+        </div>
+        <div class="col-xs-6 text-right">
+          <span>{{ externalLdap.currentConfig.usernameField || 'uid' }}</span>
+        </div>
+      </div>
+
+      <div class="row" ng-show="externalLdap.currentConfig.provider !== 'noop'">
+        <div class="col-xs-6">
+          <span class="text-muted">{{ 'users.externalLdap.syncGroups' | tr }}</span>
+        </div>
+        <div class="col-xs-6 text-right">
+          <span>{{ externalLdap.currentConfig.syncGroups ? 'Yes' : 'No' }}</span>
+        </div>
+      </div>
+
+      <div class="row" ng-show="externalLdap.currentConfig.provider !== 'noop' && externalLdap.currentConfig.provider !== 'cloudron' && externalLdap.currentConfig.syncGroups">
+        <div class="col-xs-6">
+          <span class="text-muted">{{ 'users.externalLdap.groupBaseDn' | tr }}</span>
+        </div>
+        <div class="col-xs-6 text-right">
+          <span>{{ externalLdap.currentConfig.groupBaseDn }}</span>
+        </div>
+      </div>
+
+      <div class="row" ng-show="externalLdap.currentConfig.provider !== 'noop' && externalLdap.currentConfig.provider !== 'cloudron' && externalLdap.currentConfig.syncGroups">
+        <div class="col-xs-6">
+          <span class="text-muted">{{ 'users.externalLdap.groupFilter' | tr }}</span>
+        </div>
+        <div class="col-xs-6 text-right">
+          <span>{{ externalLdap.currentConfig.groupFilter }}</span>
+        </div>
+      </div>
+
+      <div class="row" ng-show="externalLdap.currentConfig.provider !== 'noop' && externalLdap.currentConfig.provider !== 'cloudron' && externalLdap.currentConfig.syncGroups">
+        <div class="col-xs-6">
+          <span class="text-muted">{{ 'users.externalLdap.groupnameField' | tr }}</span>
+        </div>
+        <div class="col-xs-6 text-right">
+          <span>{{ externalLdap.currentConfig.groupnameField }}</span>
+        </div>
+      </div>
+
+      <div class="row" ng-show="externalLdap.currentConfig.provider !== 'noop' && externalLdap.currentConfig.provider !== 'cloudron'">
+        <div class="col-xs-6">
+          <span class="text-muted">{{ 'users.externalLdap.auth' | tr }}</span>
+        </div>
+        <div class="col-xs-6 text-right">
+          <span>{{ externalLdap.currentConfig.bindDn ? 'Yes' : 'No' }}</span>
+        </div>
+      </div>
+
+      <div class="row" ng-show="externalLdap.currentConfig.provider !== 'noop'">
+        <div class="col-xs-6">
+          <span class="text-muted">{{ 'users.externalLdap.autocreateUsersOnLogin' | tr }}</span>
+        </div>
+        <div class="col-xs-6 text-right">
+          <span>{{ externalLdap.currentConfig.autoCreate ? 'Yes' : 'No' }}</span>
+        </div>
+      </div>
+
+      <div class="row">
+        <br/>
+        <div class="col-md-12" style="margin-bottom: 10px;">
+          <div ng-show="externalLdap.syncBusy" class="progress progress-striped active animateMe">
+            <div class="progress-bar progress-bar-success" role="progressbar" style="width: {{ externalLdap.percent }}%"></div>
+          </div>
+        </div>
+      </div>
+
+      <div class="row">
+        <div class="col-md-6">
+          <p ng-show="externalLdap.syncBusy">{{ externalLdap.message }}</p>
+          <p ng-hide="externalLdap.syncBusy">
+            <div class="has-error" ng-show="!externalLdap.active">{{ externalLdap.errorMessage }}</div>
+          </p>
+        </div>
+
+        <div class="col-md-6 text-right">
+          <button class="btn btn-primary pull-right" ng-click="externalLdap.show()">{{ 'users.externalLdap.configureAction' | tr }}</button>
+          <button class="btn btn-success pull-right" ng-disabled="externalLdap.currentConfig.provider === 'noop'" ng-click="externalLdap.sync()"><i class="fa fa-circle-notch fa-spin" ng-show="externalLdap.syncBusy"></i> {{ 'users.externalLdap.syncAction' | tr }}</button>
+          <a class="btn btn-primary pull-right" ng-show="externalLdap.taskId" ng-href="/frontend/logs.html?taskId={{ externalLdap.taskId }}" target="_blank">{{ 'users.externalLdap.showLogsAction' | tr }}</a>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <div class="text-left section-header">
+    <h3>{{ 'users.exposedLdap.title' | tr }}</h3>
+  </div>
+
+  <div class="card card-large">
+    <div class="row">
+      <div class="col-md-12">
+        <div>{{ 'users.exposedLdap.description' | tr }}</div>
+
+        <br/>
+
+        <form name="userDirectoryConfigForm" role="form" novalidate ng-submit="userDirectoryConfig.submit()" autocomplete="off">
+          <fieldset>
+            <div class="checkbox">
+              <label>
+                <input type="checkbox" ng-model="userDirectoryConfig.enabled" ng-disabled="userDirectoryConfig.busy"> {{ 'users.exposedLdap.enabled' | tr }} <sup><a ng-href="https://docs.cloudron.io/user-management/#directory-server" class="help" target="_blank"><i class="fa fa-question-circle"></i></a></sup>
+              </label>
+            </div>
+            <div class="form-group">
+              <label class="control-label">{{ 'users.exposedLdap.secret.url' | tr }}</label>
+              <div class="input-group">
+                <input type="text" id="userDirectoryUrlInput" ng-value="'ldaps://' + config.adminFqdn + ':636'" readonly name="userDirectoryUrl" class="form-control"/>
+                <span class="input-group-btn">
+                  <button class="btn btn-default" type="button" id="userDirectoryUrlClipboardButton" data-clipboard-target="#userDirectoryUrlInput"><i class="fa fa-clipboard"></i></button>
+                </span>
+              </div>
+            </div>
+            <div class="form-group">
+              <label class="control-label">{{ 'users.exposedLdap.secret.label' | tr }}</label>
+              <p class="small" ng-bind-html=" 'users.exposedLdap.secret.description' | tr:{ userDN: 'cn=admin,ou=system,dc=cloudron' }"></p>
+              <input type="password" ng-model="userDirectoryConfig.secret" ng-disabled="!userDirectoryConfig.enabled || userDirectoryConfig.busy" name="userDirectorySecret" class="form-control" ng-class="{ 'has-error': !userDirectoryConfigForm.secret.$dirty && userDirectoryConfig.error.secret }" password-reveal/>
+              <div class="has-error" ng-show="userDirectoryConfig.error.secret">{{ userDirectoryConfig.error.secret }}</div>
+            </div>
+            <div class="form-group">
+              <label class="control-label">{{ 'users.exposedLdap.ipRestriction.label' | tr }}</label>
+              <p class="small">{{ 'users.exposedLdap.ipRestriction.description' | tr }}</p>
+              <textarea ng-model="userDirectoryConfig.allowlist" ng-disabled="!userDirectoryConfig.enabled || userDirectoryConfig.busy" placeholder="{{ 'users.exposedLdap.ipRestriction.placeholder' | tr }}" name="allowlist" class="form-control" ng-class="{ 'has-error': !userDirectoryConfigForm.allowlist.$dirty && userDirectoryConfig.error.allowlist }" rows="4"></textarea>
+              <div class="has-error" ng-show="userDirectoryConfig.error.allowlist">{{ userDirectoryConfig.error.allowlist }}</div>
+            </div>
+          </fieldset>
+        </form>
+
+        <br/>
+
+        <div>
+          <span class="has-error" ng-show="userDirectoryConfig.error.generic">{{ userDirectoryConfig.error.generic }}</span>
+
+          <button class="btn btn-outline btn-primary pull-right" ng-click="userDirectoryConfig.submit()" ng-disabled="!userDirectoryConfigForm.$dirty || userDirectoryConfig.busy">
+            <i class="fa fa-circle-notch fa-spin" ng-show="userDirectoryConfig.busy"></i> {{ 'users.settings.saveAction' | tr }}
+          </button>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <div class="text-left section-header">
+    <h3>{{ 'oidc.title' | tr }}</h3>
+  </div>
+
+  <div class="card card-large">
+    <div class="grid-item-top">
+      <div class="row">
+        <div class="col-md-12">
+          <table width="100%">
+            <tr>
+              <td class="text-muted" style="vertical-align: top;">{{ 'oidc.env.discoveryUrl' | tr }}</td>
+              <td class="text-right" style="vertical-align: top;" ng-click-select>https://{{ config.adminFqdn }}/.well-known/openid-configuration</td>
+            </tr>
+          </table>
+        </div>
+      </div>
+    </div>
+
+    <hr/>
+
+    <div>
+      <h4>{{ 'oidc.clients.title' | tr }} <button class="btn btn-primary btn-sm pull-right" ng-click="clientAdd.show()"><i class="fa fa-plus"></i> {{ 'oidc.clients.newClient' | tr }}</button></h4>
+      <div class="grid-item-top">
+        <div class="row">
+          <div class="col-xs-12">
+            <table class="table table-hover">
+              <thead>
+                <tr>
+                  <th style="width: 33%">{{ 'oidc.client.name' | tr }}</th>
+                  <th style="width: 33%">{{ 'oidc.client.id' | tr }}</th>
+                  <th style="width: 33%">{{ 'oidc.client.signingAlgorithm' | tr }}</th>
+                  <th style="width: 10%" class="text-right">{{ 'main.actions' | tr }}</th>
+                </tr>
+              </thead>
+              <tbody>
+                <tr ng-show="oidcClients.length === 0">
+                  <td colspan="3" class="text-center">{{ 'oidc.clients.empty' | tr }}</td>
+                </tr>
+                <tr ng-repeat="client in oidcClients">
+                  <td class="text-left elide-table-cell hand" ng-click="clientEdit.show(client)">
+                    {{ client.name }}
+                  </td>
+                  <td class="text-left elide-table-cell hand" ng-click="clientEdit.show(client)">
+                    {{ client.id }}
+                  </td>
+                  <td class="text-left elide-table-cell hand" ng-click="clientEdit.show(client)">
+                    {{ client.tokenSignatureAlgorithm }}
+                  </td>
+                  <td class="text-right no-wrap" style="vertical-align: bottom">
+                    <button class="btn btn-xs btn-danger" ng-click="deleteClient.show(client)" uib-tooltip="Delete"><i class="far fa-trash-alt"></i></button>
+                    <button class="btn btn-xs btn-default" ng-click="clientEdit.show(client)" uib-tooltip="Edit"><i class="fa fa-pencil-alt"></i></button>
+                  </td>
+                </tr>
+              </tbody>
+            </table>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+
+</div>

dashboard/src/views/user-settings.js

@@ -0,0 +1,448 @@
+'use strict';
+
+/* global angular */
+/* global Clipboard */
+/* global $ */
+
+angular.module('Application').controller('UserSettingsController', ['$scope', '$location', '$translate', '$timeout', 'Client', function ($scope, $location, $translate, $timeout, Client) {
+    Client.onReady(function () { if (!Client.getUserInfo().isAtLeastAdmin) $location.path('/'); });
+
+    $scope.ldapProvider = [
+        { name: 'Active Directory', value: 'ad' },
+        { name: 'Cloudron', value: 'cloudron' },
+        { name: 'Jumpcloud', value: 'jumpcloud' },
+        { name: 'Okta', value: 'okta' },
+        { name: 'Univention Corporate Server (UCS)', value: 'univention' },
+        { name: 'Other', value: 'other' },
+        { name: 'Disabled', value: 'noop' }
+    ];
+
+    $translate(['users.externalLdap.providerOther', 'users.externalLdap.providerDisabled']).then(function (tr) {
+        if (tr['users.externalLdap.providerOther']) $scope.ldapProvider.find(function (p) { return p.value === 'other'; }).name = tr['users.externalLdap.providerOther'];
+        if (tr['users.externalLdap.providerDisabled']) $scope.ldapProvider.find(function (p) { return p.value === 'noop'; }).name = tr['users.externalLdap.providerDisabled'];
+    });
+
+    $scope.ready = false;
+    $scope.config = Client.getConfig();
+    $scope.userInfo = Client.getUserInfo();
+    $scope.oidcClients = [];
+
+    $scope.profileConfig = {
+        editableUserProfiles: true,
+        mandatory2FA: false,
+        errorMessage: '',
+
+        refresh: function () {
+            Client.getProfileConfig(function (error, result) {
+                if (error) return console.error('Unable to get directory config.', error);
+
+                $scope.profileConfig.editableUserProfiles = !result.lockUserProfiles;
+                $scope.profileConfig.mandatory2FA = !!result.mandatory2FA;
+            });
+        },
+
+        submit: function () {
+            // prevent the current user from getting locked out
+            if ($scope.profileConfig.mandatory2FA && !$scope.userInfo.twoFactorAuthenticationEnabled) return Client.notify('', $translate.instant('users.settings.require2FAWarning'), true, 'error', '#/profile');
+
+            $scope.profileConfig.error = '';
+            $scope.profileConfig.busy = true;
+            $scope.profileConfig.success = false;
+
+            var data = {
+                lockUserProfiles: !$scope.profileConfig.editableUserProfiles,
+                mandatory2FA: $scope.profileConfig.mandatory2FA
+            };
+
+            Client.setProfileConfig(data, function (error) {
+                if (error) $scope.profileConfig.errorMessage = error.message;
+
+                $scope.profileConfig.success = true;
+
+                $scope.profileConfigForm.$setUntouched();
+                $scope.profileConfigForm.$setPristine();
+
+                Client.refreshConfig(); // refresh the $scope.config
+
+                $timeout(function () {
+                    $scope.profileConfig.busy = false;
+                }, 500);
+            });
+        }
+    };
+
+    $scope.userDirectoryConfig = {
+        enabled: false,
+        secret: '',
+        allowlist: '',
+        error: null,
+
+        refresh: function () {
+            Client.getUserDirectoryConfig(function (error, result) {
+                if (error) return console.error('Unable to get exposed ldap config.', error);
+
+                $scope.userDirectoryConfig.enabled = !!result.enabled;
+                $scope.userDirectoryConfig.allowlist = result.allowlist;
+                $scope.userDirectoryConfig.secret = result.secret;
+            });
+        },
+
+        submit: function () {
+            $scope.userDirectoryConfig.error = null;
+            $scope.userDirectoryConfig.busy = true;
+            $scope.userDirectoryConfig.success = false;
+
+            var data = {
+                enabled: $scope.userDirectoryConfig.enabled,
+                secret: $scope.userDirectoryConfig.secret,
+                allowlist: $scope.userDirectoryConfig.allowlist
+            };
+
+            Client.setUserDirectoryConfig(data, function (error) {
+                $scope.userDirectoryConfig.busy = false;
+
+                if (error && error.statusCode === 400) {
+                    if (error.message.indexOf('secret') !== -1) return $scope.userDirectoryConfig.error = { secret: error.message };
+                    else return $scope.userDirectoryConfig.error = { allowlist: error.message };
+                }
+                if (error) return $scope.userDirectoryConfig.error = { generic: error.message };
+
+                $scope.userDirectoryConfigForm.$setUntouched();
+                $scope.userDirectoryConfigForm.$setPristine();
+
+                $scope.userDirectoryConfig.success = true;
+            });
+        }
+    };
+
+    $scope.externalLdap = {
+        busy: false,
+        percent: 0,
+        message: '',
+        errorMessage: '',
+        error: {},
+        taskId: 0,
+
+        syncBusy: false,
+
+        // fields
+        provider: 'noop',
+        autoCreate: false,
+        url: '',
+        acceptSelfSignedCerts: false,
+        baseDn: '',
+        filter: '',
+        groupBaseDn: '',
+        bindDn: '',
+        bindPassword: '',
+        usernameField: '',
+
+        currentConfig: {},
+
+        checkStatus: function () {
+            Client.getLatestTaskByType('syncExternalLdap', function (error, task) {
+                if (error) return console.error(error);
+
+                if (!task) return;
+
+                $scope.externalLdap.taskId = task.id;
+                $scope.externalLdap.updateStatus();
+            });
+        },
+
+        sync: function () {
+            $scope.externalLdap.syncBusy = true;
+
+            Client.startExternalLdapSync(function (error, taskId) {
+                if (error) {
+                    $scope.externalLdap.syncBusy = false;
+                    console.error('Unable to start ldap syncer task.', error);
+                    return;
+                }
+
+                $scope.externalLdap.taskId = taskId;
+                $scope.externalLdap.updateStatus();
+            });
+        },
+
+        refresh: function() {
+            Client.getExternalLdapConfig(function (error, result) {
+                if (error) return console.error('Unable to get external ldap config.', error);
+
+                $scope.externalLdap.currentConfig = result;
+                $scope.externalLdap.checkStatus();
+            });
+        },
+
+        updateStatus: function () {
+            Client.getTask($scope.externalLdap.taskId, function (error, data) {
+                if (error) return window.setTimeout($scope.externalLdap.updateStatus, 5000);
+
+                if (!data.active) {
+                    $scope.externalLdap.syncBusy = false;
+                    $scope.externalLdap.message = '';
+                    $scope.externalLdap.percent = 100; // indicates that 'result' is valid
+                    $scope.externalLdap.errorMessage = data.success ? '' : data.error.message;
+                    return;
+                }
+
+                $scope.externalLdap.syncBusy = true;
+                $scope.externalLdap.percent = data.percent;
+                $scope.externalLdap.message = data.message;
+                window.setTimeout($scope.externalLdap.updateStatus, 3000);
+            });
+        },
+
+        show: function () {
+            $scope.externalLdap.busy = false;
+            $scope.externalLdap.error = {};
+
+            $scope.externalLdap.provider = $scope.externalLdap.currentConfig.provider;
+            $scope.externalLdap.url = $scope.externalLdap.currentConfig.url;
+            $scope.externalLdap.acceptSelfSignedCerts = $scope.externalLdap.currentConfig.acceptSelfSignedCerts;
+            $scope.externalLdap.baseDn = $scope.externalLdap.currentConfig.baseDn;
+            $scope.externalLdap.filter = $scope.externalLdap.currentConfig.filter;
+            $scope.externalLdap.syncGroups = $scope.externalLdap.currentConfig.syncGroups;
+            $scope.externalLdap.groupBaseDn = $scope.externalLdap.currentConfig.groupBaseDn;
+            $scope.externalLdap.groupFilter = $scope.externalLdap.currentConfig.groupFilter;
+            $scope.externalLdap.groupnameField = $scope.externalLdap.currentConfig.groupnameField;
+            $scope.externalLdap.bindDn = $scope.externalLdap.currentConfig.bindDn;
+            $scope.externalLdap.bindPassword = $scope.externalLdap.currentConfig.bindPassword;
+            $scope.externalLdap.usernameField = $scope.externalLdap.currentConfig.usernameField;
+            $scope.externalLdap.autoCreate = $scope.externalLdap.currentConfig.autoCreate;
+
+            $('#externalLdapModal').modal('show');
+        },
+
+        submit: function () {
+            $scope.externalLdap.busy = true;
+            $scope.externalLdap.error = {};
+
+            var config = {
+                provider: $scope.externalLdap.provider
+            };
+
+            if ($scope.externalLdap.provider === 'cloudron') {
+                config.url = $scope.externalLdap.url;
+                config.acceptSelfSignedCerts = $scope.externalLdap.acceptSelfSignedCerts;
+                config.autoCreate = $scope.externalLdap.autoCreate;
+                config.syncGroups = $scope.externalLdap.syncGroups;
+                config.bindPassword = $scope.externalLdap.bindPassword;
+
+                // those values are known and thus overwritten
+                config.baseDn = 'ou=users,dc=cloudron';
+                config.filter = '(objectClass=inetOrgPerson)';
+                config.usernameField = 'username';
+                config.groupBaseDn = 'ou=groups,dc=cloudron';
+                config.groupFilter = '(objectClass=group)';
+                config.groupnameField = 'cn';
+                config.bindDn = 'cn=admin,ou=system,dc=cloudron';
+            } else if ($scope.externalLdap.provider !== 'noop') {
+                config.url = $scope.externalLdap.url;
+                config.acceptSelfSignedCerts = $scope.externalLdap.acceptSelfSignedCerts;
+                config.baseDn = $scope.externalLdap.baseDn;
+                config.filter = $scope.externalLdap.filter;
+                config.usernameField = $scope.externalLdap.usernameField;
+                config.syncGroups = $scope.externalLdap.syncGroups;
+                config.groupBaseDn = $scope.externalLdap.groupBaseDn;
+                config.groupFilter = $scope.externalLdap.groupFilter;
+                config.groupnameField = $scope.externalLdap.groupnameField;
+                config.autoCreate = $scope.externalLdap.autoCreate;
+
+                if ($scope.externalLdap.bindDn) {
+                    config.bindDn = $scope.externalLdap.bindDn;
+                    config.bindPassword = $scope.externalLdap.bindPassword;
+                }
+            }
+
+            Client.setExternalLdapConfig(config, function (error) {
+                $scope.externalLdap.busy = false;
+
+                if (error) {
+                    if (error.statusCode === 424) {
+                        if (error.code === 'SELF_SIGNED_CERT_IN_CHAIN') $scope.externalLdap.error.acceptSelfSignedCerts = true;
+                        else $scope.externalLdap.error.url = true;
+                    } else if (error.statusCode === 400 && error.message === 'invalid baseDn') {
+                        $scope.externalLdap.error.baseDn = true;
+                    } else if (error.statusCode === 400 && error.message === 'invalid filter') {
+                        $scope.externalLdap.error.filter = true;
+                    } else if (error.statusCode === 400 && error.message === 'invalid groupBaseDn') {
+                        $scope.externalLdap.error.groupBaseDn = true;
+                    } else if (error.statusCode === 400 && error.message === 'invalid groupFilter') {
+                        $scope.externalLdap.error.groupFilter = true;
+                    } else if (error.statusCode === 400 && error.message === 'invalid groupnameField') {
+                        $scope.externalLdap.error.groupnameField = true;
+                    } else if (error.statusCode === 400 && error.message === 'invalid bind credentials') {
+                        $scope.externalLdap.error.credentials = true;
+                    }  else if (error.statusCode === 400 && error.message === 'invalid usernameField') {
+                        $scope.externalLdap.error.usernameField = true;
+                    } else {
+                        console.error('Failed to set external LDAP config:', error);
+                        $scope.externalLdap.error.generic = error.message;
+                    }
+                } else {
+                    $('#externalLdapModal').modal('hide');
+                    $scope.externalLdap.refresh();
+                }
+            });
+        }
+    };
+
+    $scope.refreshOIDCClients = function () {
+        Client.getOidcClients(function (error, result) {
+            if (error) return console.error('Failed to load oidc clients', error);
+
+            $scope.oidcClients = result;
+        });
+    };
+
+    $scope.clientAdd = {
+        busy: false,
+        error: {},
+        id: '',
+        name: '',
+        secret: '',
+        loginRedirectUri: '',
+        tokenSignatureAlgorithm: '',
+
+        show: function () {
+            $scope.clientAdd.id = '';
+            $scope.clientAdd.secret = '';
+            $scope.clientAdd.name = '';
+            $scope.clientAdd.loginRedirectUri = '';
+            $scope.clientAdd.tokenSignatureAlgorithm = 'RS256';
+            $scope.clientAdd.busy = false;
+            $scope.clientAdd.error = null;
+            $scope.clientAddForm.$setPristine();
+
+            $('#oidcClientAddModal').modal('show');
+        },
+
+        submit: function () {
+            $scope.clientAdd.busy = true;
+            $scope.clientAdd.error = {};
+
+            Client.addOidcClient($scope.clientAdd.id, $scope.clientAdd.name, $scope.clientAdd.secret, $scope.clientAdd.loginRedirectUri, $scope.clientAdd.tokenSignatureAlgorithm, function (error) {
+                if (error) {
+                    if (error.statusCode === 409) {
+                        $scope.clientAdd.error.id = 'Client ID already exists';
+                        $('#clientId').focus();
+                    } else {
+                        console.error('Unable to add openid client.', error);
+                    }
+
+                    $scope.clientAdd.busy = false;
+
+                    return;
+                }
+
+                $scope.refreshOIDCClients();
+                $scope.clientAdd.busy = false;
+
+                $('#oidcClientAddModal').modal('hide');
+            });
+        }
+    };
+
+    $scope.clientEdit = {
+        busy: false,
+        error: {},
+        id: '',
+        name: '',
+        secret: '',
+        loginRedirectUri: '',
+        tokenSignatureAlgorithm: '',
+
+        show: function (client) {
+            $scope.clientEdit.id = client.id;
+            $scope.clientEdit.name = client.name;
+            $scope.clientEdit.secret = client.secret;
+            $scope.clientEdit.loginRedirectUri = client.loginRedirectUri;
+            $scope.clientEdit.tokenSignatureAlgorithm = client.tokenSignatureAlgorithm;
+            $scope.clientEdit.busy = false;
+            $scope.clientEdit.error = null;
+            $scope.clientEditForm.$setPristine();
+
+            $('#oidcClientEditModal').modal('show');
+        },
+
+        submit: function () {
+            $scope.clientEdit.busy = true;
+            $scope.clientEdit.error = {};
+
+            Client.updateOidcClient($scope.clientEdit.id, $scope.clientEdit.name, $scope.clientEdit.secret, $scope.clientEdit.loginRedirectUri, $scope.clientEdit.tokenSignatureAlgorithm, function (error) {
+                if (error) {
+                    console.error('Unable to edit openid client.', error);
+
+                    $scope.clientEdit.busy = false;
+
+                    return;
+                }
+
+                $scope.refreshOIDCClients();
+                $scope.clientEdit.busy = false;
+
+                $('#oidcClientEditModal').modal('hide');
+            });
+        }
+    };
+
+    $scope.deleteClient = {
+        busy: false,
+        error: {},
+        id: '',
+
+        show: function (client) {
+            $scope.deleteClient.busy = false;
+            $scope.deleteClient.id = client.id;
+
+            $('#oidcClientDeleteModal').modal('show');
+        },
+
+        submit: function () {
+            Client.delOidcClient($scope.deleteClient.id, function (error) {
+                $scope.deleteClient.busy = false;
+
+                if (error) return console.error('Failed to delete openid client', error);
+
+                $scope.refreshOIDCClients();
+
+                $('#oidcClientDeleteModal').modal('hide');
+            });
+        }
+    };
+
+    Client.onReady(function () {
+        $scope.externalLdap.refresh();
+        $scope.profileConfig.refresh();
+        $scope.userDirectoryConfig.refresh();
+        $scope.refreshOIDCClients();
+    });
+
+    // setup all the dialog focus handling
+    ['oidcClientAddModal', 'oidcClientEditModal'].forEach(function (id) {
+        $('#' + id).on('shown.bs.modal', function () {
+            $(this).find('[autofocus]:first').focus();
+        });
+    });
+
+    new Clipboard('#userDirectoryUrlClipboardButton').on('success', function(e) {
+        $('#userDirectoryUrlClipboardButton').tooltip({
+            title: 'Copied!',
+            trigger: 'manual'
+        }).tooltip('show');
+
+        $timeout(function () {  $('#userDirectoryUrlClipboardButton').tooltip('hide'); }, 2000);
+
+        e.clearSelection();
+    }).on('error', function(/*e*/) {
+        $('#userDirectoryUrlClipboardButton').tooltip({
+            title: 'Press Ctrl+C to copy',
+            trigger: 'manual'
+        }).tooltip('show');
+
+        $timeout(function () {  $('#userDirectoryUrlClipboardButton').tooltip('hide'); }, 2000);
+    });
+
+    $('.modal-backdrop').remove();
+}]);

dashboard/src/views/users.html

@@ -1,39 +1,3 @@
-<!-- Modal subscription -->
-<div class="modal fade" id="subscriptionRequiredModal" tabindex="-1" role="dialog">
-  <div class="modal-dialog">
-    <div class="modal-content">
-      <div class="modal-header">
-        <h4 class="modal-title">{{ 'users.subscriptionDialog.title' | tr }}</h4>
-      </div>
-      <div class="modal-body">
-        <p>To add more users, please setup a paid plain.</p>
-      </div>
-      <div class="modal-footer">
-        <button type="button" class="btn btn-default" data-dismiss="modal">{{ 'main.dialog.cancel' | tr }}</button>
-        <button type="button" class="btn btn-success" ng-click="openSubscriptionSetup()">{{ 'users.subscriptionDialog.setupAction' | tr }}</button>
-      </div>
-    </div>
-  </div>
-</div>
-
-<!-- Modal subscription group -->
-<div class="modal fade" id="subscriptionRequiredGroupModal" tabindex="-1" role="dialog">
-  <div class="modal-dialog">
-    <div class="modal-content">
-      <div class="modal-header">
-        <h4 class="modal-title">{{ 'users.subscriptionDialog.title' | tr }}</h4>
-      </div>
-      <div class="modal-body">
-        <p>User groups are part of the business plan.</p>
-      </div>
-      <div class="modal-footer">
-        <button type="button" class="btn btn-default" data-dismiss="modal">{{ 'main.dialog.cancel' | tr }}</button>
-        <button type="button" class="btn btn-success" ng-click="openSubscriptionSetup()">{{ 'users.subscriptionDialog.setupAction' | tr }}</button>
-      </div>
-    </div>
-  </div>
-</div>
-
 <!-- Modal make user local -->
 <div class="modal fade" id="makeLocalModal" tabindex="-1" role="dialog">
   <div class="modal-dialog">
@@ -483,112 +447,11 @@
   </div>
 </div>
 
-<!-- Modal external ldap -->
-<div class="modal fade" id="externalLdapModal" tabindex="-1" role="dialog">
-  <div class="modal-dialog">
-    <div class="modal-content">
-      <div class="modal-header">
-        <h4 class="modal-title">{{ 'users.externalLdapDialog.title' | tr }}</h4>
-      </div>
-      <div class="modal-body">
-        <p class="has-error text-center" ng-show="externalLdap.error.generic">{{ externalLdap.error.generic }}</p>
-
-        <div class="form-group">
-          <label class="control-label" for="ldapProvider">{{ 'users.externalLdap.provider' | tr }} <sup><a ng-href="https://docs.cloudron.io/user-management/#external-directory" class="help" target="_blank"><i class="fa fa-question-circle"></i></a></sup></label>
-          <select class="form-control" id="ldapProvider" ng-model="externalLdap.provider" ng-options="a.value as a.name for a in ldapProvider"></select>
-        </div>
-
-        <div uib-collapse="externalLdap.provider === 'noop'">
-          <form name="externalLdapConfigForm" role="form" novalidate ng-submit="externalLdap.submit()" autocomplete="off">
-            <fieldset>
-              <div class="form-group" ng-class="{ 'has-error': externalLdap.error.url }">
-                <label class="control-label" for="inputExternalLdapConfigUrl">{{ 'users.externalLdap.server' | tr }}</label>
-                <input type="text" class="form-control" ng-model="externalLdap.url" id="inputExternalLdapConfigUrl" name="url" ng-disabled="externalLdap.busy" placeholder="ldaps://example.com:636" required>
-              </div>
-
-              <div class="form-group">
-                <div class="checkbox">
-                  <label>
-                    <input type="checkbox" ng-model="externalLdap.acceptSelfSignedCerts"> {{ 'users.externalLdap.acceptSelfSignedCert' | tr }}
-                  </label>
-                </div>
-                <p class="has-error" ng-show="externalLdap.error.acceptSelfSignedCerts">{{ 'users.externalLdap.errorSelfSignedCert' | tr }}</p>
-              </div>
-
-              <div class="form-group" ng-class="{ 'has-error': externalLdap.error.baseDn }" ng-show="externalLdap.provider !== 'cloudron'">
-                <label class="control-label" for="inputExternalLdapConfigBaseDn">{{ 'users.externalLdap.baseDn' | tr }}</label>
-                <input type="text" class="form-control" ng-model="externalLdap.baseDn" id="inputExternalLdapConfigBaseDn" name="baseDn" ng-disabled="externalLdap.busy" placeholder="ou=users,dc=example,dc=com" ng-required="externalLdap.provider !== 'cloudron'">
-              </div>
-
-              <div class="form-group" ng-class="{ 'has-error': externalLdap.error.filter }" ng-show="externalLdap.provider !== 'cloudron'">
-                <label class="control-label" for="inputExternalLdapConfigFilter">{{ 'users.externalLdap.filter' | tr }}</label>
-                <input type="text" class="form-control" ng-model="externalLdap.filter" id="inputExternalLdapConfigFilter" name="filter" ng-disabled="externalLdap.busy" placeholder="(objectClass=inetOrgPerson)"  ng-required="externalLdap.provider !== 'cloudron'">
-              </div>
-
-              <div class="form-group" ng-class="{ 'has-error': externalLdap.error.usernameField }" ng-show="externalLdap.provider !== 'cloudron'">
-                <label class="control-label" for="inputExternalLdapConfigUsernameField">{{ 'users.externalLdap.usernameField' | tr }}</label>
-                <input type="text" class="form-control" ng-model="externalLdap.usernameField" id="inputExternalLdapConfigUsernameField" name="usernameField" ng-disabled="externalLdap.busy" placeholder="uid or sAMAcountName">
-              </div>
-
-              <div class="form-group">
-                <div class="checkbox">
-                  <label>
-                    <input type="checkbox" ng-model="externalLdap.syncGroups"> {{ 'users.externalLdap.syncGroups' | tr }}</sup>
-                  </label>
-                </div>
-              </div>
-
-              <div class="form-group" ng-class="{ 'has-error': externalLdap.error.groupBaseDn }" ng-show="externalLdap.syncGroups && externalLdap.provider !== 'cloudron'">
-                <label class="control-label" for="inputExternalLdapConfigGroupBaseDn">{{ 'users.externalLdap.groupBaseDn' | tr }}</label>
-                <input type="text" class="form-control" ng-model="externalLdap.groupBaseDn" id="inputExternalLdapConfigGroupBaseDn" name="groupBaseDn" ng-disabled="externalLdap.busy" placeholder="ou=groups,dc=example,dc=com" ng-required="externalLdap.syncGroups && externalLdap.provider !== 'cloudron'">
-              </div>
-
-              <div class="form-group" ng-class="{ 'has-error': externalLdap.error.groupFilter }" ng-show="externalLdap.syncGroups && externalLdap.provider !== 'cloudron'">
-                <label class="control-label" for="inputExternalLdapConfigGroupFilter">{{ 'users.externalLdap.groupFilter' | tr }}</label>
-                <input type="text" class="form-control" ng-model="externalLdap.groupFilter" id="inputExternalLdapConfigGroupFilter" name="groupFilter" ng-disabled="externalLdap.busy" placeholder="(objectClass=groupOfNames)" ng-required="externalLdap.syncGroups && externalLdap.provider !== 'cloudron'">
-              </div>
-
-              <div class="form-group" ng-class="{ 'has-error': externalLdap.error.groupnameField }" ng-show="externalLdap.syncGroups && externalLdap.provider !== 'cloudron'">
-                <label class="control-label" for="inputExternalLdapConfigGroupnameField">{{ 'users.externalLdap.groupnameField' | tr }}</label>
-                <input type="text" class="form-control" ng-model="externalLdap.groupnameField" id="inputExternalLdapConfigGroupnameField" name="groupnameField" ng-disabled="externalLdap.busy" placeholder="cn" ng-required="externalLdap.syncGroups && externalLdap.provider !== 'cloudron'">
-              </div>
-
-              <div class="form-group" ng-class="{ 'has-error': externalLdap.error.credentials }" ng-show="externalLdap.provider !== 'cloudron'">
-                <label class="control-label" for="inputExternalLdapConfigBindDn">{{ 'users.externalLdap.bindUsername' | tr }}</label>
-                <input type="text" class="form-control" ng-model="externalLdap.bindDn" id="inputExternalLdapConfigBindDn" name="bindDn" ng-disabled="externalLdap.busy" placeholder="uid=admin,ou=Users,dc=example,dc=com">
-              </div>
-
-              <div class="form-group" ng-class="{ 'has-error': externalLdap.error.credentials }">
-                <label class="control-label" for="inputExternalLdapConfigBindPassword">{{ 'users.externalLdap.bindPassword' | tr }}</label>
-                <input type="password" class="form-control" ng-model="externalLdap.bindPassword" id="inputExternalLdapConfigBindPassword" name="bindPassword" ng-disabled="externalLdap.busy" placeholder="" password-reveal>
-              </div>
-
-              <div class="form-group">
-                <div class="checkbox">
-                  <label>
-                    <input type="checkbox" ng-model="externalLdap.autoCreate"> {{ 'users.externalLdap.autocreateUsersOnLogin' | tr }}
-                  </label>
-                </div>
-              </div>
-
-              <input class="ng-hide" type="submit" ng-disabled="externalLdapConfigForm.$invalid"/>
-            </fieldset>
-          </form>
-        </div>
-      </div>
-      <div class="modal-footer">
-        <button type="button" class="btn btn-default" data-dismiss="modal">{{ 'main.dialog.cancel' | tr }}</button>
-        <button type="button" class="btn btn-primary" ng-click="externalLdap.submit()" ng-disabled="externalLdapConfigForm.$invalid || externalLdap.busy"><i class="fa fa-circle-notch fa-spin" ng-show="externalLdap.busy"></i> {{ 'main.dialog.save' | tr }}</button>
-      </div>
-    </div>
-  </div>
-</div>
-
 <div class="content content-large">
 
   <div class="text-left">
     <h1>
-      {{ 'users.title' | tr }}
+      {{ 'main.navbar.users' | tr }}
     </h1>
   </div>
 
@@ -672,6 +535,7 @@
             </div>
             <div class="pull-right">
               <button class="btn btn-default btn-outline btn-xs" ng-click="showPrevPage()" ng-class="{ 'btn-primary': currentPage > 1 }" ng-disabled="userRefreshBusy || currentPage <= 1"><i class="fa fa-angle-double-left"></i> {{ 'main.pagination.prev' | tr }}</button>
+                <span style="margin: 0 5px; line-height: 1.5; font-size: 12px;">{{ currentPage }}</span>
               <button class="btn btn-default btn-outline btn-xs" ng-click="showNextPage()" ng-class="{ 'btn-primary': users.length > pageItems }" ng-disabled="userRefreshBusy || users.length < pageItems">{{ 'main.pagination.next' | tr }} <i class="fa fa-angle-double-right"></i></button>
             </div>
           </div>
@@ -727,265 +591,4 @@
       </div>
     </div>
   </div>
-
-  <div class="text-left" style="margin-top: 50px;" ng-show="user.isAtLeastAdmin">
-    <h3>{{ 'users.settings.title' | tr }}</h3>
-  </div>
-
-  <div class="card card-large" ng-show="user.isAtLeastAdmin">
-    <form name="profileConfigForm" role="form" novalidate ng-submit="profileConfig.submit()" autocomplete="off">
-      <fieldset ng-disabled="profileConfig.busy">
-        <div class="checkbox">
-          <label>
-            <input type="checkbox" ng-model="profileConfig.editableUserProfiles"> {{ 'users.settings.allowProfileEditCheckbox' | tr }} <sup><a ng-href="https://docs.cloudron.io/user-management/#lock-profile" class="help" target="_blank"><i class="fa fa-question-circle"></i></a></sup>
-          </label>
-        </div>
-        <div class="checkbox">
-          <label>
-            <input type="checkbox" ng-model="profileConfig.mandatory2FA"> {{ 'users.settings.require2FACheckbox' | tr }}
-          </label>
-        </div>
-      </fieldset>
-    </form>
-
-    <br/>
-
-    <div class="row">
-      <div class="col-md-12">
-        <span class="has-error" ng-show="profileConfig.errorMessage">{{ profileConfig.errorMessage }}</span>
-
-        <button class="btn btn-outline btn-primary pull-right" ng-click="profileConfig.submit()" ng-disabled="!profileConfigForm.$dirty || profileConfig.busy">
-          <i class="fa fa-circle-notch fa-spin" ng-show="profileConfig.busy"></i> {{ 'users.settings.saveAction' | tr }}
-        </button>
-      </div>
-    </div>
-
-  </div>
-
-  <div class="text-left" style="margin-top: 50px;" ng-show="user.isAtLeastAdmin">
-    <h3>{{ 'users.externalLdap.title' | tr }}</h3>
-  </div>
-
-  <div class="card card-large" ng-show="user.isAtLeastAdmin">
-    <div class="row">
-      <div class="col-md-12">{{ 'users.externalLdap.description' | tr }}</div>
-    </div>
-
-    <br/>
-
-    <div class="row" ng-hide="config.features.externalLdap">
-      <div class="col-md-12">
-        {{ 'users.externalLdap.subscriptionRequired' | tr }} <a href="" class="pull-right" ng-click="openSubscriptionSetup()">{{ 'users.externalLdap.subscriptionRequiredAction' | tr }}</a>
-      </div>
-    </div>
-
-    <div ng-show="config.features.externalLdap">
-
-      <div class="row" ng-show="externalLdap.currentConfig.provider === 'noop'">
-        <div class="col-xs-12">
-          <span class="text-muted">{{ 'users.externalLdap.noopInfo' | tr }}</span>
-        </div>
-      </div>
-
-      <div class="row" ng-show="externalLdap.currentConfig.provider !== 'noop'">
-        <div class="col-xs-6">
-          <span class="text-muted">{{ 'users.externalLdap.provider' | tr }}</span>
-        </div>
-        <div class="col-xs-6 text-right">
-          <span>{{ externalLdap.currentConfig.provider }}</span>
-        </div>
-      </div>
-
-      <div class="row" ng-show="externalLdap.currentConfig.provider !== 'noop'">
-        <div class="col-xs-6">
-          <span class="text-muted">{{ 'users.externalLdap.server' | tr }}</span>
-        </div>
-        <div class="col-xs-6 text-right">
-          <span>{{ externalLdap.currentConfig.url }}</span>
-        </div>
-      </div>
-
-      <div class="row" ng-show="externalLdap.currentConfig.provider !== 'noop'">
-        <div class="col-xs-6">
-          <span class="text-muted">{{ 'users.externalLdap.acceptSelfSignedCert' | tr }}</span>
-        </div>
-        <div class="col-xs-6 text-right">
-          <span>{{ externalLdap.currentConfig.acceptSelfSignedCerts ? 'Yes' : 'No' }}</span>
-        </div>
-      </div>
-
-      <div class="row" ng-show="externalLdap.currentConfig.provider !== 'noop' && externalLdap.currentConfig.provider !== 'cloudron'">
-        <div class="col-xs-6">
-          <span class="text-muted">{{ 'users.externalLdap.baseDn' | tr }}</span>
-        </div>
-        <div class="col-xs-6 text-right">
-          <span>{{ externalLdap.currentConfig.baseDn }}</span>
-        </div>
-      </div>
-
-      <div class="row" ng-show="externalLdap.currentConfig.provider !== 'noop' && externalLdap.currentConfig.provider !== 'cloudron'">
-        <div class="col-xs-6">
-          <span class="text-muted">{{ 'users.externalLdap.filter' | tr }}</span>
-        </div>
-        <div class="col-xs-6 text-right">
-          <span>{{ externalLdap.currentConfig.filter }}</span>
-        </div>
-      </div>
-
-      <div class="row" ng-show="externalLdap.currentConfig.provider !== 'noop' && externalLdap.currentConfig.provider !== 'cloudron'">
-        <div class="col-xs-6">
-          <span class="text-muted">{{ 'users.externalLdap.usernameField' | tr }}</span>
-        </div>
-        <div class="col-xs-6 text-right">
-          <span>{{ externalLdap.currentConfig.usernameField || 'uid' }}</span>
-        </div>
-      </div>
-
-      <div class="row" ng-show="externalLdap.currentConfig.provider !== 'noop'">
-        <div class="col-xs-6">
-          <span class="text-muted">{{ 'users.externalLdap.syncGroups' | tr }}</span>
-        </div>
-        <div class="col-xs-6 text-right">
-          <span>{{ externalLdap.currentConfig.syncGroups ? 'Yes' : 'No' }}</span>
-        </div>
-      </div>
-
-      <div class="row" ng-show="externalLdap.currentConfig.provider !== 'noop' && externalLdap.currentConfig.provider !== 'cloudron' && externalLdap.currentConfig.syncGroups">
-        <div class="col-xs-6">
-          <span class="text-muted">{{ 'users.externalLdap.groupBaseDn' | tr }}</span>
-        </div>
-        <div class="col-xs-6 text-right">
-          <span>{{ externalLdap.currentConfig.groupBaseDn }}</span>
-        </div>
-      </div>
-
-      <div class="row" ng-show="externalLdap.currentConfig.provider !== 'noop' && externalLdap.currentConfig.provider !== 'cloudron' && externalLdap.currentConfig.syncGroups">
-        <div class="col-xs-6">
-          <span class="text-muted">{{ 'users.externalLdap.groupFilter' | tr }}</span>
-        </div>
-        <div class="col-xs-6 text-right">
-          <span>{{ externalLdap.currentConfig.groupFilter }}</span>
-        </div>
-      </div>
-
-      <div class="row" ng-show="externalLdap.currentConfig.provider !== 'noop' && externalLdap.currentConfig.provider !== 'cloudron' && externalLdap.currentConfig.syncGroups">
-        <div class="col-xs-6">
-          <span class="text-muted">{{ 'users.externalLdap.groupnameField' | tr }}</span>
-        </div>
-        <div class="col-xs-6 text-right">
-          <span>{{ externalLdap.currentConfig.groupnameField }}</span>
-        </div>
-      </div>
-
-      <div class="row" ng-show="externalLdap.currentConfig.provider !== 'noop' && externalLdap.currentConfig.provider !== 'cloudron'">
-        <div class="col-xs-6">
-          <span class="text-muted">{{ 'users.externalLdap.auth' | tr }}</span>
-        </div>
-        <div class="col-xs-6 text-right">
-          <span>{{ externalLdap.currentConfig.bindDn ? 'Yes' : 'No' }}</span>
-        </div>
-      </div>
-
-      <div class="row" ng-show="externalLdap.currentConfig.provider !== 'noop'">
-        <div class="col-xs-6">
-          <span class="text-muted">{{ 'users.externalLdap.autocreateUsersOnLogin' | tr }}</span>
-        </div>
-        <div class="col-xs-6 text-right">
-          <span>{{ externalLdap.currentConfig.autoCreate ? 'Yes' : 'No' }}</span>
-        </div>
-      </div>
-
-      <div class="row">
-        <br/>
-        <div class="col-md-12" style="margin-bottom: 10px;">
-          <div ng-show="externalLdap.syncBusy" class="progress progress-striped active animateMe">
-            <div class="progress-bar progress-bar-success" role="progressbar" style="width: {{ externalLdap.percent }}%"></div>
-          </div>
-        </div>
-      </div>
-
-      <div class="row">
-        <div class="col-md-6">
-          <p ng-show="externalLdap.syncBusy">{{ externalLdap.message }}</p>
-          <p ng-hide="externalLdap.syncBusy">
-            <div class="has-error" ng-show="!externalLdap.active">{{ externalLdap.errorMessage }}</div>
-          </p>
-        </div>
-
-        <div class="col-md-6 text-right">
-          <button class="btn btn-primary pull-right" ng-click="externalLdap.show()">{{ 'users.externalLdap.configureAction' | tr }}</button>
-          <button class="btn btn-success pull-right" ng-disabled="externalLdap.currentConfig.provider === 'noop'" ng-click="externalLdap.sync()"><i class="fa fa-circle-notch fa-spin" ng-show="externalLdap.syncBusy"></i> {{ 'users.externalLdap.syncAction' | tr }}</button>
-          <a class="btn btn-primary pull-right" ng-show="externalLdap.taskId" ng-href="/logs.html?taskId={{ externalLdap.taskId }}" target="_blank">{{ 'users.externalLdap.showLogsAction' | tr }}</a>
-        </div>
-      </div>
-    </div>
-  </div>
-
-  <div class="text-left" style="margin-top: 50px;" ng-show="user.isAtLeastAdmin">
-    <h3>{{ 'users.exposedLdap.title' | tr }}</h3>
-  </div>
-
-  <div class="card card-large" ng-show="user.isAtLeastAdmin">
-    <div class="row">
-      <div class="col-md-12">
-        <div>{{ 'users.exposedLdap.description' | tr }}</div>
-
-        <br/>
-
-        <form name="userDirectoryConfigForm" role="form" novalidate ng-submit="userDirectoryConfig.submit()" autocomplete="off">
-          <fieldset>
-            <div class="checkbox">
-              <label>
-                <input type="checkbox" ng-model="userDirectoryConfig.enabled" ng-disabled="userDirectoryConfig.busy"> {{ 'users.exposedLdap.enabled' | tr }} <sup><a ng-href="https://docs.cloudron.io/user-management/#directory-server" class="help" target="_blank"><i class="fa fa-question-circle"></i></a></sup>
-              </label>
-            </div>
-            <div class="form-group">
-              <label class="control-label">{{ 'users.exposedLdap.secret.url' | tr }}</label>
-              <div class="input-group">
-                <input type="text" id="userDirectoryUrlInput" ng-value="'ldaps://' + config.adminFqdn + ':636'" readonly name="userDirectoryUrl" class="form-control"/>
-                <span class="input-group-btn">
-                  <button class="btn btn-default" type="button" id="userDirectoryUrlClipboardButton" data-clipboard-target="#userDirectoryUrlInput"><i class="fa fa-clipboard"></i></button>
-                </span>
-              </div>
-            </div>
-            <div class="form-group">
-              <label class="control-label">{{ 'users.exposedLdap.secret.label' | tr }}</label>
-              <p class="small" ng-bind-html=" 'users.exposedLdap.secret.description' | tr:{ userDN: 'cn=admin,ou=system,dc=cloudron' }"></p>
-              <input type="password" ng-model="userDirectoryConfig.secret" ng-disabled="!userDirectoryConfig.enabled || userDirectoryConfig.busy" name="userDirectorySecret" class="form-control" ng-class="{ 'has-error': !userDirectoryConfigForm.secret.$dirty && userDirectoryConfig.error.secret }" password-reveal/>
-              <div class="has-error" ng-show="userDirectoryConfig.error.secret">{{ userDirectoryConfig.error.secret }}</div>
-            </div>
-            <div class="form-group">
-              <label class="control-label">{{ 'users.exposedLdap.ipRestriction.label' | tr }}</label>
-              <p class="small">{{ 'users.exposedLdap.ipRestriction.description' | tr }}</p>
-              <textarea ng-model="userDirectoryConfig.allowlist" ng-disabled="!userDirectoryConfig.enabled || userDirectoryConfig.busy" placeholder="{{ 'users.exposedLdap.ipRestriction.placeholder' | tr }}" name="allowlist" class="form-control" ng-class="{ 'has-error': !userDirectoryConfigForm.allowlist.$dirty && userDirectoryConfig.error.allowlist }" rows="4"></textarea>
-              <div class="has-error" ng-show="userDirectoryConfig.error.allowlist">{{ userDirectoryConfig.error.allowlist }}</div>
-            </div>
-          </fieldset>
-        </form>
-
-        <br/>
-
-        <div>
-          <span class="has-error" ng-show="userDirectoryConfig.error.generic">{{ userDirectoryConfig.error.generic }}</span>
-
-          <button class="btn btn-outline btn-primary pull-right" ng-click="userDirectoryConfig.submit()" ng-disabled="!userDirectoryConfigForm.$dirty || userDirectoryConfig.busy">
-            <i class="fa fa-circle-notch fa-spin" ng-show="userDirectoryConfig.busy"></i> {{ 'users.settings.saveAction' | tr }}
-          </button>
-        </div>
-      </div>
-    </div>
-  </div>
-
-  <div class="text-left" style="margin-top: 50px;" ng-show="user.isAtLeastAdmin">
-    <h3>OpenID Connect Provider (beta)</h3>
-  </div>
-
-  <div class="card card-large" ng-show="user.isAtLeastAdmin">
-    <div class="row">
-      <div class="col-md-12" style="line-height: 34px;">
-        Cloudron can act as an OpenID Connect provider for internal apps and external services.
-        <a href="/#/oidc" class="btn btn-outline btn-primary pull-right">Settings</a>
-      </div>
-    </div>
-  </div>
 </div>

dashboard/src/views/users.js

@@ -9,21 +9,6 @@
 angular.module('Application').controller('UsersController', ['$scope', '$location', '$translate', '$timeout', 'Client', function ($scope, $location, $translate, $timeout, Client) {
     Client.onReady(function () { if (!Client.getUserInfo().isAtLeastUserManager) $location.path('/'); });
 
-    $scope.ldapProvider = [
-        { name: 'Active Directory', value: 'ad' },
-        { name: 'Cloudron', value: 'cloudron' },
-        { name: 'Jumpcloud', value: 'jumpcloud' },
-        { name: 'Okta', value: 'okta' },
-        { name: 'Univention Corporate Server (UCS)', value: 'univention' },
-        { name: 'Other', value: 'other' },
-        { name: 'Disabled', value: 'noop' }
-    ];
-
-    $translate(['users.externalLdap.providerOther', 'users.externalLdap.providerDisabled']).then(function (tr) {
-        if (tr['users.externalLdap.providerOther']) $scope.ldapProvider.find(function (p) { return p.value === 'other'; }).name = tr['users.externalLdap.providerOther'];
-        if (tr['users.externalLdap.providerDisabled']) $scope.ldapProvider.find(function (p) { return p.value === 'noop'; }).name = tr['users.externalLdap.providerDisabled'];
-    });
-
     $scope.ready = false;
     $scope.users = []; // users of current page
     $scope.allUsersById = [];
@@ -31,18 +16,13 @@ angular.module('Application').controller('UsersController', ['$scope', '$locatio
     $scope.groupsById = { };
     $scope.config = Client.getConfig();
     $scope.userInfo = Client.getUserInfo();
-    $scope.domains = [];
-
-    $scope.openSubscriptionSetup = function () {
-        Client.openSubscriptionSetup($scope.$parent.subscription);
-    };
 
     $scope.roles = [];
     $scope.allUsers = []; // all the users and not just current page, have to load this for group assignment
 
     $scope.userSearchString = '';
     $scope.currentPage = 1;
-    $scope.pageItems = 15;
+    $scope.pageItems = localStorage.cloudronPageSize || 15;
     $scope.userRefreshBusy = true;
 
     $scope.userStates = [
@@ -845,263 +825,6 @@ angular.module('Application').controller('UsersController', ['$scope', '$locatio
         }
     };
 
-    $scope.profileConfig = {
-        editableUserProfiles: true,
-        mandatory2FA: false,
-        errorMessage: '',
-
-        refresh: function () {
-            Client.getProfileConfig(function (error, result) {
-                if (error) return console.error('Unable to get directory config.', error);
-
-                $scope.profileConfig.editableUserProfiles = !result.lockUserProfiles;
-                $scope.profileConfig.mandatory2FA = !!result.mandatory2FA;
-            });
-        },
-
-        submit: function () {
-            // prevent the current user from getting locked out
-            if ($scope.profileConfig.mandatory2FA && !$scope.userInfo.twoFactorAuthenticationEnabled) return Client.notify('', $translate.instant('users.settings.require2FAWarning'), true, 'error', '#/profile');
-
-            $scope.profileConfig.error = '';
-            $scope.profileConfig.busy = true;
-            $scope.profileConfig.success = false;
-
-            var data = {
-                lockUserProfiles: !$scope.profileConfig.editableUserProfiles,
-                mandatory2FA: $scope.profileConfig.mandatory2FA
-            };
-
-            Client.setProfileConfig(data, function (error) {
-                if (error) $scope.profileConfig.errorMessage = error.message;
-
-                $scope.profileConfig.success = true;
-
-                $scope.profileConfigForm.$setUntouched();
-                $scope.profileConfigForm.$setPristine();
-
-                Client.refreshConfig(); // refresh the $scope.config
-
-                $timeout(function () {
-                    $scope.profileConfig.busy = false;
-                }, 500);
-            });
-        }
-    };
-
-    $scope.userDirectoryConfig = {
-        enabled: false,
-        secret: '',
-        allowlist: '',
-        error: null,
-
-        refresh: function () {
-            Client.getUserDirectoryConfig(function (error, result) {
-                if (error) return console.error('Unable to get exposed ldap config.', error);
-
-                $scope.userDirectoryConfig.enabled = !!result.enabled;
-                $scope.userDirectoryConfig.allowlist = result.allowlist;
-                $scope.userDirectoryConfig.secret = result.secret;
-            });
-        },
-
-        submit: function () {
-            $scope.userDirectoryConfig.error = null;
-            $scope.userDirectoryConfig.busy = true;
-            $scope.userDirectoryConfig.success = false;
-
-            var data = {
-                enabled: $scope.userDirectoryConfig.enabled,
-                secret: $scope.userDirectoryConfig.secret,
-                allowlist: $scope.userDirectoryConfig.allowlist
-            };
-
-            Client.setUserDirectoryConfig(data, function (error) {
-                $scope.userDirectoryConfig.busy = false;
-
-                if (error && error.statusCode === 400) {
-                    if (error.message.indexOf('secret') !== -1) return $scope.userDirectoryConfig.error = { secret: error.message };
-                    else return $scope.userDirectoryConfig.error = { allowlist: error.message };
-                }
-                if (error) return $scope.userDirectoryConfig.error = { generic: error.message };
-
-                $scope.userDirectoryConfigForm.$setUntouched();
-                $scope.userDirectoryConfigForm.$setPristine();
-
-                $scope.userDirectoryConfig.success = true;
-            });
-        }
-    };
-
-    $scope.externalLdap = {
-        busy: false,
-        percent: 0,
-        message: '',
-        errorMessage: '',
-        error: {},
-        taskId: 0,
-
-        syncBusy: false,
-
-        // fields
-        provider: 'noop',
-        autoCreate: false,
-        url: '',
-        acceptSelfSignedCerts: false,
-        baseDn: '',
-        filter: '',
-        groupBaseDn: '',
-        bindDn: '',
-        bindPassword: '',
-        usernameField: '',
-
-        currentConfig: {},
-
-        checkStatus: function () {
-            Client.getLatestTaskByType('syncExternalLdap', function (error, task) {
-                if (error) return console.error(error);
-
-                if (!task) return;
-
-                $scope.externalLdap.taskId = task.id;
-                $scope.externalLdap.updateStatus();
-            });
-        },
-
-        sync: function () {
-            $scope.externalLdap.syncBusy = true;
-
-            Client.startExternalLdapSync(function (error, taskId) {
-                if (error) {
-                    $scope.externalLdap.syncBusy = false;
-                    console.error('Unable to start ldap syncer task.', error);
-                    return;
-                }
-
-                $scope.externalLdap.taskId = taskId;
-                $scope.externalLdap.updateStatus();
-            });
-        },
-
-        updateStatus: function () {
-            Client.getTask($scope.externalLdap.taskId, function (error, data) {
-                if (error) return window.setTimeout($scope.externalLdap.updateStatus, 5000);
-
-                if (!data.active) {
-                    $scope.externalLdap.syncBusy = false;
-                    $scope.externalLdap.message = '';
-                    $scope.externalLdap.percent = 100; // indicates that 'result' is valid
-                    $scope.externalLdap.errorMessage = data.success ? '' : data.error.message;
-
-                    refreshGroups();
-                    refreshUsers();
-
-                    return;
-                }
-
-                $scope.externalLdap.syncBusy = true;
-                $scope.externalLdap.percent = data.percent;
-                $scope.externalLdap.message = data.message;
-                window.setTimeout($scope.externalLdap.updateStatus, 3000);
-            });
-        },
-
-        show: function () {
-            $scope.externalLdap.busy = false;
-            $scope.externalLdap.error = {};
-
-            $scope.externalLdap.provider = $scope.externalLdap.currentConfig.provider;
-            $scope.externalLdap.url = $scope.externalLdap.currentConfig.url;
-            $scope.externalLdap.acceptSelfSignedCerts = $scope.externalLdap.currentConfig.acceptSelfSignedCerts;
-            $scope.externalLdap.baseDn = $scope.externalLdap.currentConfig.baseDn;
-            $scope.externalLdap.filter = $scope.externalLdap.currentConfig.filter;
-            $scope.externalLdap.syncGroups = $scope.externalLdap.currentConfig.syncGroups;
-            $scope.externalLdap.groupBaseDn = $scope.externalLdap.currentConfig.groupBaseDn;
-            $scope.externalLdap.groupFilter = $scope.externalLdap.currentConfig.groupFilter;
-            $scope.externalLdap.groupnameField = $scope.externalLdap.currentConfig.groupnameField;
-            $scope.externalLdap.bindDn = $scope.externalLdap.currentConfig.bindDn;
-            $scope.externalLdap.bindPassword = $scope.externalLdap.currentConfig.bindPassword;
-            $scope.externalLdap.usernameField = $scope.externalLdap.currentConfig.usernameField;
-            $scope.externalLdap.autoCreate = $scope.externalLdap.currentConfig.autoCreate;
-
-            $('#externalLdapModal').modal('show');
-        },
-
-        submit: function () {
-            $scope.externalLdap.busy = true;
-            $scope.externalLdap.error = {};
-
-            var config = {
-                provider: $scope.externalLdap.provider
-            };
-
-            if ($scope.externalLdap.provider === 'cloudron') {
-                config.url = $scope.externalLdap.url;
-                config.acceptSelfSignedCerts = $scope.externalLdap.acceptSelfSignedCerts;
-                config.autoCreate = $scope.externalLdap.autoCreate;
-                config.syncGroups = $scope.externalLdap.syncGroups;
-                config.bindPassword = $scope.externalLdap.bindPassword;
-
-                // those values are known and thus overwritten
-                config.baseDn = 'ou=users,dc=cloudron';
-                config.filter = '(objectClass=inetOrgPerson)';
-                config.usernameField = 'username';
-                config.groupBaseDn = 'ou=groups,dc=cloudron';
-                config.groupFilter = '(objectClass=group)';
-                config.groupnameField = 'cn';
-                config.bindDn = 'cn=admin,ou=system,dc=cloudron';
-            } else if ($scope.externalLdap.provider !== 'noop') {
-                config.url = $scope.externalLdap.url;
-                config.acceptSelfSignedCerts = $scope.externalLdap.acceptSelfSignedCerts;
-                config.baseDn = $scope.externalLdap.baseDn;
-                config.filter = $scope.externalLdap.filter;
-                config.usernameField = $scope.externalLdap.usernameField;
-                config.syncGroups = $scope.externalLdap.syncGroups;
-                config.groupBaseDn = $scope.externalLdap.groupBaseDn;
-                config.groupFilter = $scope.externalLdap.groupFilter;
-                config.groupnameField = $scope.externalLdap.groupnameField;
-                config.autoCreate = $scope.externalLdap.autoCreate;
-
-                if ($scope.externalLdap.bindDn) {
-                    config.bindDn = $scope.externalLdap.bindDn;
-                    config.bindPassword = $scope.externalLdap.bindPassword;
-                }
-            }
-
-            Client.setExternalLdapConfig(config, function (error) {
-                $scope.externalLdap.busy = false;
-
-                if (error) {
-                    if (error.statusCode === 424) {
-                        if (error.code === 'SELF_SIGNED_CERT_IN_CHAIN') $scope.externalLdap.error.acceptSelfSignedCerts = true;
-                        else $scope.externalLdap.error.url = true;
-                    } else if (error.statusCode === 400 && error.message === 'invalid baseDn') {
-                        $scope.externalLdap.error.baseDn = true;
-                    } else if (error.statusCode === 400 && error.message === 'invalid filter') {
-                        $scope.externalLdap.error.filter = true;
-                    } else if (error.statusCode === 400 && error.message === 'invalid groupBaseDn') {
-                        $scope.externalLdap.error.groupBaseDn = true;
-                    } else if (error.statusCode === 400 && error.message === 'invalid groupFilter') {
-                        $scope.externalLdap.error.groupFilter = true;
-                    } else if (error.statusCode === 400 && error.message === 'invalid groupnameField') {
-                        $scope.externalLdap.error.groupnameField = true;
-                    } else if (error.statusCode === 400 && error.message === 'invalid bind credentials') {
-                        $scope.externalLdap.error.credentials = true;
-                    }  else if (error.statusCode === 400 && error.message === 'invalid usernameField') {
-                        $scope.externalLdap.error.usernameField = true;
-                    } else {
-                        console.error('Failed to set external LDAP config:', error);
-                        $scope.externalLdap.error.generic = error.message;
-                    }
-                } else {
-                    $('#externalLdapModal').modal('hide');
-
-                    loadExternalLdapConfig();
-                }
-            });
-        }
-    };
-
     function getUsers(callback) {
         var users = [];
 
@@ -1159,15 +882,6 @@ angular.module('Application').controller('UsersController', ['$scope', '$locatio
         });
     }
 
-    function loadExternalLdapConfig() {
-        Client.getExternalLdapConfig(function (error, result) {
-            if (error) return console.error('Unable to get external ldap config.', error);
-
-            $scope.externalLdap.currentConfig = result;
-            $scope.externalLdap.checkStatus();
-        });
-    }
-
     $scope.showNextPage = function () {
         $scope.currentPage++;
         refreshUsers();
@@ -1196,20 +910,8 @@ angular.module('Application').controller('UsersController', ['$scope', '$locatio
         });
     }
 
-    function getAllDomains() {
-        Client.getDomains(function (error, domains) {
-            if (error) return console.error('Unable to get domains:', error);
-
-            $scope.domains = domains;
-        });
-    }
-
     Client.onReady(function () {
         refresh();
-        if ($scope.user.isAtLeastAdmin) loadExternalLdapConfig();
-        if ($scope.user.isAtLeastAdmin) $scope.profileConfig.refresh();
-        if ($scope.user.isAtLeastAdmin) $scope.userDirectoryConfig.refresh();
-        if ($scope.user.isAtLeastAdmin) getAllDomains();
         refreshAllUsers();
 
         // Order matters for permissions used in canEdit
@@ -1228,7 +930,7 @@ angular.module('Application').controller('UsersController', ['$scope', '$locatio
     // setup all the dialog focus handling
     ['userAddModal', 'userRemoveModal', 'userEditModal', 'groupAddModal', 'groupEditModal', 'groupRemoveModal'].forEach(function (id) {
         $('#' + id).on('shown.bs.modal', function () {
-            $(this).find("[autofocus]:first").focus();
+            $(this).find('[autofocus]:first').focus();
         });
     });
 
@@ -1286,23 +988,5 @@ angular.module('Application').controller('UsersController', ['$scope', '$locatio
         $timeout(function () {  $('#setGhostClipboardButton').tooltip('hide'); }, 2000);
     });
 
-    new Clipboard('#userDirectoryUrlClipboardButton').on('success', function(e) {
-        $('#userDirectoryUrlClipboardButton').tooltip({
-            title: 'Copied!',
-            trigger: 'manual'
-        }).tooltip('show');
-
-        $timeout(function () {  $('#userDirectoryUrlClipboardButton').tooltip('hide'); }, 2000);
-
-        e.clearSelection();
-    }).on('error', function(/*e*/) {
-        $('#userDirectoryUrlClipboardButton').tooltip({
-            title: 'Press Ctrl+C to copy',
-            trigger: 'manual'
-        }).tooltip('show');
-
-        $timeout(function () {  $('#userDirectoryUrlClipboardButton').tooltip('hide'); }, 2000);
-    });
-
     $('.modal-backdrop').remove();
 }]);

dashboard/src/views/volumes.html

@@ -34,10 +34,14 @@
               <input type="text" class="form-control" ng-model="volumeAdd.hostPath" name="hostPath" ng-disabled="volumeAdd.busy" placeholder="/mnt/data" ng-required="volumeAdd.mountType === 'mountpoint'" autofocus>
             </div>
 
-            <div class="form-group" ng-show="volumeAdd.mountType === 'ext4' || volumeAdd.mountType === 'xfs'">
+            <div class="form-group" ng-show="volumeAdd.mountType === 'ext4'">
               <label class="control-label">{{ 'volumes.addVolumeDialog.diskPath' | tr }}</label>
-              <select class="form-control" ng-model="volumeAdd.diskPath" ng-options="item.path as item.label for item in blockDevices track by item.path"></select>
-              <input type="text" class="form-control" style="margin-top: 5px;" ng-show="volumeAdd.diskPath.path === 'custom'" ng-model="volumeAdd.customDiskPath" ng-disabled="volumeAdd.busy" placeholder="/dev/disk/by-uuid/uuid" ng-required="(volumeAdd.mountType === 'ext4' || volumeAdd.mountType === 'xfs') && volumeAdd.diskPath.path === 'custom'">
+              <select class="form-control" ng-model="volumeAdd.ext4Disk" ng-options="item as item.label for item in ext4BlockDevices track by item.path" ng-required="volumeAdd.mountType === 'ext4'"></select>
+            </div>
+
+            <div class="form-group" ng-show="volumeAdd.mountType === 'xfs'">
+              <label class="control-label">{{ 'volumes.addVolumeDialog.diskPath' | tr }}</label>
+              <select class="form-control" ng-model="volumeAdd.xfsDisk" ng-options="item as item.label for item in xfsBlockDevices track by item.path" ng-required="volumeAdd.mountType === 'xfs'"></select>
             </div>
 
             <div class="form-group" ng-show="volumeAdd.mountType === 'cifs' || volumeAdd.mountType === 'nfs' || volumeAdd.mountType === 'sshfs'">
@@ -153,7 +157,7 @@
               <td class="text-left wrap-table-cell hidden-xs hidden-sm" ng-show="volume.mountType === 'mountpoint' || volume.mountType === 'filesystem'">{{ volume.hostPath }}</td>
               <td class="text-right no-wrap" style="vertical-align: bottom">
                 <button class="btn btn-xs btn-default" ng-click="remount(volume)" ng-show="isMountProvider(volume.mountType)" ng-disabled="volume.remounting" uib-tooltip="{{ 'volumes.remountActionTooltip' | tr }}"><i class="fa fa-sync-alt" ng-class="{ 'fa-spin': volume.remounting }"></i></button>
-                <a class="btn btn-xs btn-default" ng-href="{{ '/filemanager.html?type=volume&id=' + volume.id }}" target="_blank" uib-tooltip="{{ 'volumes.openFileManagerActionTooltip' | tr }}"><i class="fas fa-folder"></i></a>
+                <a class="btn btn-xs btn-default" ng-href="{{ '/frontend/filemanager.html#/home/volume/' + volume.id }}" target="_blank" uib-tooltip="{{ 'volumes.openFileManagerActionTooltip' | tr }}"><i class="fas fa-folder"></i></a>
                 <button class="btn btn-xs btn-danger" ng-click="volumeRemove.show(volume)" uib-tooltip="{{ 'volumes.removeVolumeActionTooltip' | tr }}"><i class="far fa-trash-alt"></i></button>
               </td>
             </tr>

dashboard/src/views/volumes.js

@@ -5,7 +5,7 @@
 /* global async */
 
 angular.module('Application').controller('VolumesController', ['$scope', '$location', '$timeout', 'Client', function ($scope, $location, $timeout, Client) {
-    Client.onReady(function () { if (!Client.getUserInfo().isAtLeastUserManager) $location.path('/'); });
+    Client.onReady(function () { if (!Client.getUserInfo().isAtLeastAdmin) $location.path('/'); });
 
     var refreshVolumesTimerId = null;
 
@@ -88,8 +88,8 @@ angular.module('Application').controller('VolumesController', ['$scope', '$locat
         remoteDir: '',
         username: '',
         password: '',
-        diskPath: {}, // { path, type }
-        customDiskPath: '',
+        ext4Disk: null, // { path, type }
+        xfsDisk: null, // { path, type }
         user: '',
         seal: false,
         port: 22,
@@ -105,8 +105,8 @@ angular.module('Application').controller('VolumesController', ['$scope', '$locat
             $scope.volumeAdd.remoteDir = '';
             $scope.volumeAdd.username = '';
             $scope.volumeAdd.password = '';
-            $scope.volumeAdd.diskPath = {};
-            $scope.volumeAdd.customDiskPath = '';
+            $scope.volumeAdd.ext4Disk = null;
+            $scope.volumeAdd.xfsDisk = null;
             $scope.volumeAdd.user = '';
             $scope.volumeAdd.seal = false;
             $scope.volumeAdd.port = 22;
@@ -119,7 +119,8 @@ angular.module('Application').controller('VolumesController', ['$scope', '$locat
         show: function () {
             $scope.volumeAdd.reset();
 
-            $scope.blockDevices = [];
+            $scope.ext4BlockDevices = [];
+            $scope.xfsBlockDevices = [];
 
             Client.getBlockDevices(function (error, result) {
                 if (error) console.error('Failed to list blockdevices:', error);
@@ -130,11 +131,8 @@ angular.module('Application').controller('VolumesController', ['$scope', '$locat
                 // amend label for UI
                 result.forEach(function (d) { d.label = d.path; });
 
-                // add custom fake option
-                result.push({ path: 'custom', label: 'Custom Path' });
-
-                $scope.blockDevices = result;
-                $scope.volumeAdd.diskPath = $scope.blockDevices[0];
+                $scope.ext4BlockDevices = result.filter(function (d) { return d.type === 'ext4'; });
+                $scope.xfsBlockDevices = result.filter(function (d) { return d.type === 'xfs'; });
 
                 $('#volumeAddModal').modal('show');
             });
@@ -167,9 +165,13 @@ angular.module('Application').controller('VolumesController', ['$scope', '$locat
                     user: $scope.volumeAdd.user,
                     privateKey: $scope.volumeAdd.privateKey,
                 };
-            } else if ($scope.volumeAdd.mountType === 'ext4' || $scope.volumeAdd.mountType === 'xfs') {
+            } else if ($scope.volumeAdd.mountType === 'ext4') {
                 mountOptions = {
-                    diskPath: $scope.volumeAdd.diskPath === 'custom' ? $scope.volumeAdd.customDiskPath : $scope.volumeAdd.diskPath
+                    diskPath: $scope.volumeAdd.ext4Disk.path
+                };
+            } else if ($scope.volumeAdd.mountType === 'xfs') {
+                mountOptions = {
+                    diskPath: $scope.volumeAdd.xfsDisk.path
                 };
             } else if ($scope.volumeAdd.mountType === 'mountpoint' || $scope.volumeAdd.mountType === 'filesystem') {
                 mountOptions = {

frontend/.gitignore

@@ -0,0 +1,24 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?

frontend/.vscode/extensions.json

@@ -0,0 +1,3 @@
+{
+  "recommendations": ["Vue.volar", "Vue.vscode-typescript-vue-plugin"]
+}

frontend/README.md

@@ -0,0 +1,15 @@
+# Dashboard Filemanager
+
+Local development via:
+
+```
+VITE_API_ORIGIN=my.example.com npm run dev
+```
+
+It requires an access token in `localStorage.token`.
+
+The default local urls look like:
+
+FileManager: `http://localhost:5173/filemanager.html#/home/app/<appId>`
+Terminal:    `http://localhost:5173/terminal.html?id=<appId>`
+LogViewer:   `http://localhost:5173/logs.html?appId=<appId>`

frontend/buildForDashboard.sh

@@ -0,0 +1,3 @@
+#!/bin/bash
+
+./node_modules/.bin/vite build --base=/frontend/

frontend/develop.sh

@@ -0,0 +1,9 @@
+#!/bin/bash
+
+set -eu
+
+echo "=> Set API origin"
+export VITE_API_ORIGIN="my.nebulon.space"
+
+echo "=> Run vite locally"
+npm run dev

frontend/filemanager.html

@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" href="/api/v1/cloudron/avatar" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>File Manager</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="/src/filemanager.js"></script>
+  </body>
+</html>

frontend/logs.html

@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" href="/api/v1/cloudron/avatar" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Logs</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="/src/logs.js"></script>
+  </body>
+</html>

frontend/package.json

@@ -0,0 +1,33 @@
+{
+  "name": "my-vue-app",
+  "private": true,
+  "version": "0.0.0",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "@fontsource/noto-sans": "^5.0.9",
+    "anser": "^2.1.1",
+    "combokeys": "^3.0.1",
+    "filesize": "^10.0.12",
+    "marked": "^7.0.4",
+    "moment": "^2.29.4",
+    "pankow": "^0.6.1",
+    "primeicons": "^6.0.1",
+    "primevue": "^3.32.1",
+    "superagent": "^8.1.2",
+    "vue": "^3.3.4",
+    "vue-i18n": "^9.2.2",
+    "vue-router": "^4.2.4",
+    "xterm": "^5.2.1",
+    "xterm-addon-attach": "^0.8.0",
+    "xterm-addon-fit": "^0.7.0"
+  },
+  "devDependencies": {
+    "@vitejs/plugin-vue": "^4.3.2",
+    "vite": "^4.4.9"
+  }
+}

frontend/public/mime-types/android-package-archive.svg

@@ -0,0 +1,139 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:xlink="http://www.w3.org/1999/xlink"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="64"
+   version="1.1"
+   viewBox="0 0 64 64"
+   height="64"
+   id="svg2"
+   inkscape:version="0.91 r13725"
+   sodipodi:docname="android-package-archive.svg">
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1360"
+     inkscape:window-height="708"
+     id="namedview33"
+     showgrid="true"
+     inkscape:object-nodes="true"
+     inkscape:zoom="5.6568542"
+     inkscape:cx="50.861875"
+     inkscape:cy="21.2677"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg2"
+     inkscape:snap-bbox="true"
+     inkscape:bbox-nodes="true">
+    <inkscape:grid
+       type="xygrid"
+       id="grid4162" />
+  </sodipodi:namedview>
+  <defs
+     id="defs4">
+    <linearGradient
+       id="linearGradient4300-2">
+      <stop
+         id="stop4302-4"
+         style="stop-color:#3a539b" />
+      <stop
+         id="stop4304-1"
+         style="stop-color:#3f5aa9"
+         offset="1" />
+    </linearGradient>
+    <linearGradient
+       inkscape:collect="always"
+       id="linearGradient6251">
+      <stop
+         style="stop-color:#ffffff;stop-opacity:0"
+         offset="0"
+         id="stop6253" />
+      <stop
+         style="stop-color:#ffffff;stop-opacity:0.2"
+         offset="1"
+         id="stop6255" />
+    </linearGradient>
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient6251"
+       id="linearGradient7145-0"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="translate(-58,-335.3622)"
+       x1="58"
+       y1="392.36221"
+       x2="58"
+       y2="336.36221" />
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient6251"
+       id="linearGradient5849"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="matrix(1,0,0,0.84587337,-47,-272.73372)"
+       x1="58"
+       y1="403.41098"
+       x2="58"
+       y2="323.82297" />
+  </defs>
+  <metadata
+     id="metadata84">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <rect
+     y="11.000853"
+     x="7"
+     height="49.999977"
+     width="49.999977"
+     id="rect5837"
+     style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#9bd916;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate" />
+  <rect
+     width="50"
+     x="7"
+     y="60.000854"
+     height="1.0000085"
+     style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:0.25;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+     id="rect5839" />
+  <rect
+     width="50"
+     x="7"
+     y="11.000853"
+     height="1.0000085"
+     style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:0.5;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+     id="rect5841" />
+  <path
+     style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:0.75;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke-width:2;stroke-linecap:square;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+     d="m 22,39 c -2.98896,7.5e-4 -5.84891,1.21778 -7.92188,3.37109 l -2.7246,-2.72461 c -0.0942,-0.0974 -0.2239,-0.15234 -0.35938,-0.15234 -0.4494,9e-5 -0.67059,0.54683 -0.34766,0.85937 l 2.76954,2.76954 C 11.85252,45.07416 11.00038,47.49972 11,50 l 0,7 22,0 0,-7 c -0.004,-2.4983 -0.85795,-4.92089 -2.42188,-6.86914 l 2.77735,-2.77735 c 0.32293,-0.31254 0.10175,-0.85928 -0.34766,-0.85937 -0.13548,0 -0.26516,0.055 -0.35937,0.15234 L 29.91602,42.3789 C 27.8458,40.22417 24.98808,39.00438 22,39 Z m 0,1 c 5.52285,0 10,4.47715 10,10 l 0,6 -20,0 0,-6 c 0,-5.52285 4.47715,-10 10,-10 z m -4.5,5 C 16.67157,45 16,45.67157 16,46.5 16,47.32843 16.67157,48 17.5,48 18.32843,48 19,47.32843 19,46.5 19,45.67157 18.32843,45 17.5,45 Z m 9,0 C 25.67157,45 25,45.67157 25,46.5 25,47.32843 25.67157,48 26.5,48 27.32843,48 28,47.32843 28,46.5 28,45.67157 27.32843,45 26.5,45 Z"
+     id="path5845"
+     inkscape:connector-curvature="0"
+     sodipodi:nodetypes="ccccccccccccccccsccccsssssssssss" />
+  <rect
+     style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:0.55199998;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:url(#linearGradient5849);fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+     id="rect5847"
+     width="49.999977"
+     height="49.999977"
+     x="7"
+     y="11.000853" />
+  <path
+     style="opacity:0.75;fill:#ffffff;fill-opacity:1"
+     d="M 40 12 L 40 14 L 42 14 L 42 12 L 40 12 z M 42 14 L 42 16 L 44 16 L 44 14 L 42 14 z M 42 16 L 40 16 L 40 18 L 42 18 L 42 16 z M 42 18 L 42 20 L 44 20 L 44 18 L 42 18 z M 42 20 L 40 20 L 40 22 L 42 22 L 42 20 z M 42 22 L 42 24 L 44 24 L 44 22 L 42 22 z M 42 24 L 40 24 L 40 26 L 42 26 L 42 24 z M 40 27 L 40 31 L 41 31 L 41 35 L 43 35 L 43 31 L 44 31 L 44 27 L 40 27 z M 41 28 L 43 28 L 43 30 L 41 30 L 41 28 z "
+     id="rect4173-3" />
+</svg>

frontend/public/mime-types/application-atom+xml.svg

@@ -0,0 +1,28 @@
+<svg width="64" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" height="64" xmlns:xlink="http://www.w3.org/1999/xlink">
+ <defs>
+  <linearGradient id="a" y1="17" y2="31" x1="40" x2="54" gradientUnits="userSpaceOnUse" gradientTransform="translate(302 78.36)">
+   <stop stop-color="#060606"/>
+   <stop offset="1" stop-opacity="0"/>
+  </linearGradient>
+  <linearGradient id="b" y1="392.36" y2="336.36" x2="0" gradientUnits="userSpaceOnUse" gradientTransform="translate(254-254)">
+   <stop stop-color="#ffffff" stop-opacity="0"/>
+   <stop offset="1" stop-color="#ffffff" stop-opacity=".2"/>
+  </linearGradient>
+  <path id="c" d="m312 139.36v-58h30l14 14v44h-14z"/>
+ </defs>
+ <g transform="translate(-302-78.36)">
+  <g color-rendering="auto" color-interpolation-filters="linearRGB" shape-rendering="auto" image-rendering="auto" text-rendering="auto" color-interpolation="sRGB" color="#000000">
+   <use fill="#fc963a" xlink:href="#c"/>
+   <g transform="scale(1-1)">
+    <rect opacity=".5" x="312" y="-82.36" width="30" fill="#ffffff" height="1"/>
+    <rect opacity=".25" x="312" y="-139.36" width="44" height="1"/>
+   </g>
+  </g>
+  <g fill-rule="evenodd">
+   <path opacity=".5" fill="#ffffff" d="m356 95.36l-14-14v14z"/>
+   <path opacity=".1" fill="url(#a)" d="m342 95.36l14 14v-14z"/>
+  </g>
+  <use fill="url(#b)" xlink:href="#c"/>
+  <path opacity=".75" color-interpolation-filters="linearRGB" color="#000000" image-rendering="auto" color-rendering="auto" d="m324.04 100.33v3a18.999996 18.999996 0 0 1 19 19h3a21.999996 21.999996 0 0 0 -22 -22m0 7v3a11.999996 11.999996 0 0 1 12 12h3a14.999996 14.999996 0 0 0 -15 -15m3.5 8c-1.939 0-3.5 1.561-3.5 3.5 0 1.939 1.561 3.5 3.5 3.5 1.939 0 3.5-1.561 3.5-3.5 0-1.939-1.561-3.5-3.5-3.5" color-interpolation="sRGB" text-rendering="auto" fill="#ffffff" shape-rendering="auto"/>
+ </g>
+</svg>

frontend/public/mime-types/application-certificate.svg

@@ -0,0 +1,28 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" inkscape:version="1.1-dev (d80adc983d, 2020-06-15)" sodipodi:docname="application-certificate.svg" id="svg35" version="1.1" height="64" viewBox="0 0 64 64" width="64">
+    <sodipodi:namedview inkscape:current-layer="svg35" showgrid="false" id="namedview37" inkscape:window-height="480" inkscape:window-width="640" inkscape:pageshadow="2" inkscape:pageopacity="0" guidetolerance="10" gridtolerance="10" objecttolerance="10" borderopacity="1" bordercolor="#666666" pagecolor="#ffffff" />
+    <defs id="defs17">
+        <linearGradient gradientTransform="matrix(1 0 0-1 0 64)" gradientUnits="userSpaceOnUse" x2="0" y2="61" y1="3" id="a">
+            <stop id="stop2" stop-color="#cf000f" />
+            <stop id="stop4" stop-color="#d91e18" offset="1" />
+        </linearGradient>
+        <linearGradient gradientTransform="matrix(1 0 0-1 0 64)" gradientUnits="userSpaceOnUse" x2="0" y2="47" y1="61" id="b">
+            <stop offset="0" stop-color="#fb9fa2" id="stop9" />
+            <stop offset="1" stop-color="#fb7d80" id="stop7" />
+        </linearGradient>
+        <linearGradient gradientUnits="userSpaceOnUse" x2="54" y2="31" x1="40" y1="17" id="c">
+            <stop id="stop12" stop-color="#383e51" />
+            <stop id="stop14" stop-opacity="0" stop-color="#655c6f" offset="1" />
+        </linearGradient>
+    </defs>
+    <path id="path19" d="m10 61v-58h30l14 14v44h-14z" fill="url(#a)" />
+    <g id="g25" transform="scale(1-1)">
+        <rect id="rect21" fill-opacity=".412" height="1" fill="#ffffff" y="-4" x="10" width="30" />
+        <rect id="rect23" fill-opacity=".294" height="1" fill="#2e3132" y="-61" x="10" width="44" />
+    </g>
+    <g id="g31" fill-rule="evenodd">
+        <path id="path27" d="m54 17l-14-14v14z" fill="url(#b)" />
+        <path id="path29" d="m40 17l14 14v-14z" fill="url(#c)" opacity=".2" />
+    </g>
+    <path id="path33" d="m32 19.333c-4.432 0-8 3.568-8 8 0 2.585 1.22 4.869 3.111 6.33v12.337l4.889-3.556 4.889 3.556v-12.337c1.891-1.461 3.111-3.745 3.111-6.33 0-4.432-3.568-8-8-8" fill="#fcbcbe" />
+</svg>

frontend/public/mime-types/application-dicom.svg

@@ -0,0 +1,26 @@
+<svg width="64" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" height="64">
+ <defs>
+  <linearGradient id="a" y1="3" y2="61" x2="0" gradientUnits="userSpaceOnUse" gradientTransform="matrix(1 0 0-1 0 64)">
+   <stop stop-color="#5e6b78"/>
+   <stop offset="1" stop-color="#768492"/>
+  </linearGradient>
+  <linearGradient id="b" y1="61" y2="47" x2="0" gradientUnits="userSpaceOnUse" gradientTransform="matrix(1 0 0-1 0 64)">
+   <stop stop-color="#dedede"/>
+   <stop offset="1" stop-color="#fbfbfb"/>
+  </linearGradient>
+  <linearGradient id="c" y1="17" x1="40" y2="31" x2="54" gradientUnits="userSpaceOnUse">
+   <stop stop-color="#383e51"/>
+   <stop offset="1" stop-color="#655c6f" stop-opacity="0"/>
+  </linearGradient>
+ </defs>
+ <path fill="url(#a)" d="m10 61v-58h30l14 14v44h-14z"/>
+ <g transform="scale(1-1)">
+  <rect width="30" x="10" y="-4" fill="#ffffff" height="1" fill-opacity=".412"/>
+  <rect width="44" x="10" y="-61" fill="#2e3132" height="1" fill-opacity=".294"/>
+ </g>
+ <g fill-rule="evenodd">
+  <path fill="url(#b)" d="m54 17l-14-14v14z"/>
+  <path opacity=".2" fill="url(#c)" d="m40 17l14 14v-14z"/>
+ </g>
+ <path opacity=".75" fill="#fbfbfb" d="m30.3 20c-1.254 0-2.889.693-4.384 1.857-.897.377-1.527 1.249-1.527 2.263 0 .318.061.628.179.917-1.55.294-2.724 1.629-2.724 3.23 0 .333.051.661.152.978-.639.617-1 1.454-1 2.339 0 .692.22 1.334.595 1.865-.389.55-.595 1.193-.595 1.868 0 1.197.667 2.293 1.724 2.871-.018.148-.027.297-.027.446 0 1.614 1.078 3.041 2.64 3.527.68 1.137 1.916 1.838 3.27 1.838 1.484 0 2.771-.839 3.393-2.057.622 1.218 1.909 2.057 3.393 2.057 1.354 0 2.592-.701 3.272-1.838 1.563-.486 2.638-1.913 2.638-3.527 0-.149-.009-.298-.027-.446 1.057-.578 1.724-1.675 1.724-2.871 0-.676-.204-1.318-.593-1.868.374-.53.593-1.173.593-1.865 0-.885-.361-1.723-1-2.339.101-.317.152-.645.152-.978 0-1.6-1.174-2.936-2.724-3.23.118-.289.179-.599.179-.917 0-1.014-.63-1.886-1.527-2.263-1.495-1.164-3.129-1.857-4.384-1.857-.697 0-1.316.336-1.697.85-.381-.514-.999-.85-1.697-.85m0 .778c.716 0 1.299.57 1.299 1.27v5.03c-.357-.277-.808-.444-1.299-.444-.22 0-.398.174-.398.389 0 .215.178.389.398.389.716 0 1.299.57 1.299 1.27v9.344c-.494-.624-1.191-1.094-2.01-1.31-.212-.056-.431.067-.488.275-.057.207.069.421.281.477 1.306.343 2.217 1.505 2.217 2.826 0 1.615-1.344 2.929-2.995 2.929-1.115 0-2.13-.602-2.65-1.569-.052-.096-.143-.166-.25-.194-1.305-.343-2.215-1.504-2.215-2.824 0-.197.02-.396.06-.589.037-.179-.058-.359-.228-.433-.929-.404-1.529-1.304-1.529-2.296 0-.451.119-.882.347-1.264.594.512 1.371.824 2.223.824.22 0 .398-.174.398-.389 0-.215-.178-.389-.398-.389-1.418 0-2.57-1.129-2.57-2.515 0-.746.337-1.45.924-1.929.133-.108.178-.288.113-.444-.126-.302-.189-.62-.189-.944 0-1.386 1.152-2.513 2.57-2.513 1.418 0 2.572 1.127 2.572 2.513 0 .215.178.389.398.389.22 0 .398-.174.398-.389 0-1.744-1.395-3.174-3.151-3.283-.159-.26-.242-.557-.242-.864 0-.693.43-1.288 1.043-1.546.024-.007.046-.017.068-.029.19-.071.395-.109.61-.109.666 0 1.261.364 1.552.949.096.193.333.273.53.179.198-.094.279-.325.183-.519-.332-.669-.961-1.149-1.685-1.319 1.015-.605 2.01-.949 2.812-.949m3.393 0c.798 0 1.797.344 2.812.949-.724.17-1.353.651-1.685 1.319-.096.193-.014.425.183.519.198.094.436.014.532-.179.291-.586.885-.949 1.55-.949.215 0 .421.038.61.109.022.011.047.022.07.029.613.258 1.043.853 1.043 1.546 0 .307-.085.604-.244.864-1.756.109-3.149 1.539-3.149 3.283 0 .215.178.389.398.389.22 0 .398-.174.398-.389 0-1.386 1.152-2.513 2.57-2.513 1.418 0 2.572 1.127 2.572 2.513 0 .324-.064.641-.189.944-.065.157-.019.336.113.444.587.48.924 1.183.924 1.929 0 1.386-1.154 2.515-2.572 2.515-.22 0-.398.174-.398.389 0 .215.178.389.398.389.852 0 1.629-.312 2.223-.824.228.382.349.813.349 1.264 0 .991-.6 1.892-1.529 2.296-.17.074-.265.254-.228.433.04.193.06.392.06.589 0 1.32-.912 2.48-2.217 2.824-.107.028-.196.099-.248.194-.52.967-1.537 1.569-2.652 1.569-1.652 0-2.995-1.314-2.995-2.929 0-.109-.006-.219-.016-.326.01-.033.016-.067.016-.103v-12.841c0-.7.583-1.27 1.299-1.27.22 0 .398-.174.398-.389 0-.215-.178-.389-.398-.389-.49 0-.941.167-1.299.444v-3.373c0-.7.583-1.27 1.299-1.27m5.938 6.686c-.22 0-.398.174-.398.389 0 1.386-1.152 2.513-2.57 2.513-.697 0-1.349-.266-1.837-.753-.154-.153-.407-.156-.564-.006-.157.15-.16.396-.006.549.551.55 1.264.887 2.036.969.183 1.183 1.23 2.093 2.49 2.093.22 0 .398-.174.398-.389 0-.215-.178-.389-.398-.389-.824 0-1.514-.569-1.683-1.325 1.65-.211 2.929-1.592 2.929-3.262 0-.215-.178-.389-.398-.389m-14.42.416c-.22 0-.398.172-.398.387 0 1.67 1.279 3.054 2.929 3.264-.169.756-.859 1.323-1.683 1.323-.22 0-.398.174-.398.389 0 .215.178.389.398.389 1.26 0 2.308-.91 2.49-2.093.772-.082 1.484-.416 2.036-.967.154-.153.151-.401-.006-.551-.157-.15-.408-.148-.562.006-.488.487-1.14.755-1.837.755-1.418 0-2.572-1.129-2.572-2.515 0-.215-.178-.387-.398-.387m8.483 5.804c-.22 0-.398.174-.398.389 0 .215.178.389.398.389 1.418 0 2.572 1.129 2.572 2.515 0 .089-.006.177-.016.265-1.234.489-2.106 1.673-2.106 3.052 0 .215.178.389.398.389.22 0 .398-.174.398-.389 0-1.386 1.154-2.515 2.572-2.515.22 0 .398-.174.398-.389 0-.215-.178-.389-.398-.389-.153 0-.305.011-.452.031 0-.019.002-.037.002-.055 0-1.815-1.511-3.293-3.368-3.293m-4.664.829c-1.856 0-3.368 1.478-3.368 3.293 0 .019.002.036.002.055-.148-.019-.299-.031-.452-.031-.22 0-.398.174-.398.389 0 .215.178.389.398.389 1.418 0 2.572 1.129 2.572 2.515 0 .215.178.389.398.389.22 0 .398-.174.398-.389 0-1.379-.872-2.564-2.106-3.052-.009-.088-.016-.176-.016-.265 0-1.386 1.154-2.515 2.572-2.515.22 0 .398-.174.398-.389 0-.215-.178-.389-.398-.389"/>
+</svg>

frontend/public/mime-types/application-epub+zip.svg

@@ -0,0 +1,22 @@
+<svg width="64" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" height="64" xmlns:xlink="http://www.w3.org/1999/xlink">
+ <defs>
+  <linearGradient id="a" y1="392.36" y2="336.36" gradientUnits="userSpaceOnUse" x2="0" gradientTransform="translate(518 82)">
+   <stop stop-color="#ffffff" stop-opacity="0"/>
+   <stop offset="1" stop-color="#ffffff" stop-opacity=".2"/>
+  </linearGradient>
+  <path color-rendering="auto" color-interpolation-filters="linearRGB" shape-rendering="auto" image-rendering="auto" text-rendering="auto" id="b" color-interpolation="sRGB" color="#000000" d="m542 417.36v58h44v-58h-14z"/>
+ </defs>
+ <g transform="translate(-532-414.36)">
+  <use fill="#f9d24c" xlink:href="#b"/>
+  <g color-rendering="auto" color-interpolation-filters="linearRGB" shape-rendering="auto" image-rendering="auto" text-rendering="auto" color-interpolation="sRGB" color="#000000">
+   <rect opacity=".25" x="542" y="474.36" width="44" height="1"/>
+   <rect opacity=".5" x="542" y="417.36" width="44" fill="#ffffff" height="1"/>
+  </g>
+  <rect width="1" x="548" y="418.36" fill="#ffffff" height="56" fill-opacity=".321"/>
+  <g color-rendering="auto" color-interpolation-filters="linearRGB" shape-rendering="auto" image-rendering="auto" text-rendering="auto" color-interpolation="sRGB" color="#000000">
+   <rect x="549" y="418.36" fill-opacity=".057" width="1" height="56"/>
+   <path opacity=".75" fill="#ffffff" d="m566 453.28l-6.916-6.917 6.916-6.911 2.307 2.302-4.614 4.609 2.307 2.308 6.916-6.917-6.03-6.02c-.489-.489-1.29-.489-1.779 0l-9.739 9.74c-.495.489-.495 1.29 0 1.786l9.739 9.74c.489.489 1.29.489 1.779 0l9.739-9.74c.495-.495.495-1.296 0-1.786l-1.412-1.412zm0 0"/>
+  </g>
+  <use fill="url(#a)" xlink:href="#b"/>
+ </g>
+</svg>

frontend/public/mime-types/application-gzip.svg

@@ -0,0 +1,113 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:xlink="http://www.w3.org/1999/xlink"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="64"
+   version="1.1"
+   viewBox="0 0 64 64"
+   height="64"
+   id="svg74"
+   inkscape:version="0.91 r13725"
+   sodipodi:docname="application-x-gzip.svg">
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1360"
+     inkscape:window-height="708"
+     id="namedview96"
+     showgrid="false"
+     inkscape:zoom="5.6568542"
+     inkscape:cx="-5.9847467"
+     inkscape:cy="40.374841"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg74"
+     inkscape:snap-bbox="true"
+     inkscape:bbox-nodes="true">
+    <inkscape:grid
+       type="xygrid"
+       id="grid4177" />
+  </sodipodi:namedview>
+  <defs
+     id="defs4">
+    <linearGradient
+       inkscape:collect="always"
+       id="linearGradient6251">
+      <stop
+         style="stop-color:#ffffff;stop-opacity:0"
+         offset="0"
+         id="stop6253" />
+      <stop
+         style="stop-color:#ffffff;stop-opacity:0.2"
+         offset="1"
+         id="stop6255" />
+    </linearGradient>
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient6251"
+       id="linearGradient4850"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="matrix(1,0,0,0.84587337,-46.999997,-272.73456)"
+       x1="58"
+       y1="393.95328"
+       x2="58"
+       y2="324.65894" />
+  </defs>
+  <metadata
+     id="metadata84">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <rect
+     style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#febf10;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+     id="rect4838"
+     width="49.999977"
+     height="49.999977"
+     x="7"
+     y="10.999992" />
+  <rect
+     id="rect4840"
+     style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:0.25;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+     height="1.0000085"
+     y="59.999992"
+     x="7"
+     width="50" />
+  <rect
+     id="rect4842"
+     style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:0.5;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+     height="1.0000085"
+     y="10.999992"
+     x="7"
+     width="50" />
+  <path
+     inkscape:connector-curvature="0"
+     style="opacity:0.75;fill:#ffffff;fill-opacity:1"
+     d="m 30,12 0,2 2,0 0,-2 -2,0 z m 2,2 0,2 2,0 0,-2 -2,0 z m 0,2 -2,0 0,2 2,0 0,-2 z m 0,2 0,2 2,0 0,-2 -2,0 z m 0,2 -2,0 0,2 2,0 0,-2 z m 0,2 0,2 2,0 0,-2 -2,0 z m 0,2 -2,0 0,2 2,0 0,-2 z m -2,3 0,4 1,0 0,4 2,0 0,-4 1,0 0,-4 -4,0 z m 1,1 2,0 0,2 -2,0 0,-2 z"
+     id="rect4173-3-3" />
+  <rect
+     y="10.999992"
+     x="7"
+     height="49.999977"
+     width="49.999977"
+     id="rect4848"
+     style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:url(#linearGradient4850);fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate" />
+</svg>

frontend/public/mime-types/application-illustrator.svg

@@ -0,0 +1,27 @@
+<svg width="64" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" height="64" xmlns:xlink="http://www.w3.org/1999/xlink">
+ <defs>
+  <linearGradient id="a" y1="17" y2="31" x1="40" x2="54" gradientUnits="userSpaceOnUse">
+   <stop stop-color="#060606"/>
+   <stop offset="1" stop-opacity="0"/>
+  </linearGradient>
+  <linearGradient id="b" y1="392.36" y2="336.36" x2="0" gradientUnits="userSpaceOnUse" gradientTransform="translate(-48-332.36)">
+   <stop stop-color="#ffffff" stop-opacity="0"/>
+   <stop offset="1" stop-color="#ffffff" stop-opacity=".2"/>
+  </linearGradient>
+  <path id="c" d="m10 61v-58h30l14 14v44h-14z"/>
+ </defs>
+ <use fill="#ffad37" xlink:href="#c"/>
+ <g color-rendering="auto" color-interpolation-filters="linearRGB" shape-rendering="auto" image-rendering="auto" text-rendering="auto" color-interpolation="sRGB" color="#000000">
+  <g fill="#ffffff">
+   <path opacity=".15" d="m10 4v1h2v2h-2v1h2v2h-2v1h2v2h-2v1h2v2h-2v1h2v2h-2v1h2v2h-2v1h2v2h-2v1h2v2h-2v1h2v2h-2v1h2v2h-2v1h2v2h-2v1h2v2h-2v1h2v2h-2v1h2v2h-2v1h2v2h-2v1h2v2h-2v1h2v2h-2v1h2v2h-2v1h2v2h1v-2h2v2h1v-2h2v2h1v-2h2v2h1v-2h2v2h1v-2h2v2h1v-2h2v2h1v-2h2v2h1v-2h2v2h1v-2h2v2h1v-2h2v2h1v-2h2v2h1v-2h2v2h1v-2h2v2h1v-2h2v-1h-2v-2h2v-1h-2v-2h2v-1h-2v-2h2v-1h-2v-2h2v-1h-2v-2h2v-1h-2v-2h2v-1h-2v-2h2v-1h-2v-2h2v-1h-2v-2h2v-1h-2v-2h2v-1h-2v-2h2v-1h-2v-2h2v-1h-2v-2h2v-1h-2v-2h2l-1-1h-1v-1l-1-1v2h-2v-2h2l-1-1h-1v-1l-1-1v2h-2v-2h2l-1-1h-1v-1l-1-1v2h-2v-2h2l-1-1h-1v-1l-1-1v2h-2v-2h2l-1-1h-29zm3 1h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm-24 3h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm-27 3h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm-30 3h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm-33 3h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm-36 3h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm-36 3h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm-36 3h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm-36 3h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm-36 3h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm-36 3h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm-36 3h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2v-1zm3 0h2v2h-2v-1zm3 0h2v2h-2v-1zm3 0h2v2h-2v-1zm3 0h2v2h-2v-1zm3 0h2v2h-2v-1zm3 0h2v2h-2v-1zm3 0h2v2h-2v-1zm3 0h2v2h-2v-1zm3 0h2v2h-2v-1zm3 0h2v2h-2zm-36 3h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2v-1zm3 0h2v2h-2v-1zm3 0h2v2h-2v-1zm3 0h2v2h-2v-1zm3 0h2v2h-2v-1zm3 0h2v2h-2v-1zm3 0h2v2h-2v-1zm3 0h2v2h-2v-1zm3 0h2v2h-2v-1zm3 0h2v2h-2v-1zm-36 3h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm-36 3h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm-36 3h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2v-1zm3 0h2v2h-2v-1zm3 0h2v2h-2v-1zm-36 3h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm-36 3h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2zm3 0h2v2h-2z"/>
+   <rect opacity=".5" x="10" y="-4" width="30" height="1" transform="scale(1-1)"/>
+  </g>
+  <rect opacity=".25" x="10" y="-61" width="44" height="1" transform="scale(1-1)"/>
+ </g>
+ <g fill-rule="evenodd">
+  <path fill="#a46022" d="m54 17l-14-14v14z"/>
+  <path opacity=".2" fill="url(#a)" d="m40 17l14 14v-14z"/>
+ </g>
+ <path color-interpolation-filters="linearRGB" color="#000000" image-rendering="auto" color-rendering="auto" d="m24 23v3h1v5.057a2.5 2.5 0 0 0 -2 2.44336 2.5 2.5 0 0 0 2 2.44531v5.05h-1v3h3v-3h-1v-3.529a13 10.500004 0 0 0 12 6.5293 13 10.500004 0 0 0 1 -.041v-.996a12 9.500009 0 0 1 -1 .0371 12 9.500009 0 0 1 -11.61914 -7.16406 2.5 2.5 0 0 0 1.61914 -2.33595 2.5 2.5 0 0 0 -1.61719 -2.33789 12 9.500009 0 0 1 11.61719 -7.16211 12 9.500009 0 0 1 1 .0391v-1.01a13 10.500004 0 0 0 -1 -.0332 13 10.500004 0 0 0 -12 6.51172v-3.512h1v-3zm1 1h1v1h-1zm.5 8a1.5 1.5 0 0 1 1.5 1.5 1.5 1.5 0 0 1 -1.5 1.5 1.5 1.5 0 0 1 -1.5 -1.5 1.5 1.5 0 0 1 1.5 -1.5m-.5 10h1v1h-1z" color-interpolation="sRGB" text-rendering="auto" fill="#99581d" shape-rendering="auto"/>
+ <use fill="url(#b)" xlink:href="#c"/>
+</svg>

frontend/public/mime-types/application-javascript.svg

@@ -0,0 +1,26 @@
+<svg width="64" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" height="64" xmlns:xlink="http://www.w3.org/1999/xlink">
+ <defs>
+  <linearGradient id="a" y1="17" x1="40" y2="31" gradientUnits="userSpaceOnUse" x2="54" gradientTransform="translate(372 1234.36)">
+   <stop stop-color="#060606"/>
+   <stop offset="1" stop-opacity="0"/>
+  </linearGradient>
+  <linearGradient id="b" y1="392.36" y2="336.36" gradientUnits="userSpaceOnUse" x2="0" gradientTransform="translate(324 902)">
+   <stop stop-color="#ffffff" stop-opacity="0"/>
+   <stop offset="1" stop-color="#ffffff" stop-opacity=".2"/>
+  </linearGradient>
+  <path id="c" d="m382 1295.36v-58h30l14 14v44h-14z"/>
+ </defs>
+ <g transform="translate(-372-1234.36)">
+  <use fill="#ffa555" xlink:href="#c"/>
+  <g color-rendering="auto" color-interpolation-filters="linearRGB" shape-rendering="auto" image-rendering="auto" text-rendering="auto" color-interpolation="sRGB" color="#000000" transform="scale(1-1)">
+   <rect opacity=".5" x="382" y="-1238.36" width="30" fill="#ffffff" height="1"/>
+   <rect opacity=".25" x="382" y="-1295.36" width="44" height="1"/>
+  </g>
+  <g fill-rule="evenodd">
+   <path opacity=".5" fill="#ffffff" d="m426 1251.36l-14-14v14z"/>
+   <path opacity=".1" fill="url(#a)" d="m412 1251.36l14 14v-14z"/>
+  </g>
+  <path opacity=".75" color-interpolation-filters="linearRGB" color="#000000" image-rendering="auto" color-rendering="auto" d="m401 1256.36c-2.216 0-4 1.784-4 4v3c0 1.662-1.338 3-3 3v1c2.216 0 4-1.784 4-4v-3c0-1.662 1.338-3 3-3zm-7 11v1c1.662 0 3 1.338 3 3v3c0 2.216 1.784 4 4 4v-1c-1.662 0-3-1.338-3-3v-3c0-2.216-1.784-4-4-4m13-11v1c1.662 0 3 1.338 3 3v3c0 2.216 1.784 4 4 4v-1c-1.662 0-3-1.338-3-3v-3c0-2.216-1.784-4-4-4m7 11c-2.216 0-4 1.784-4 4v3c0 1.662-1.338 3-3 3v1c2.216 0 4-1.784 4-4v-3c0-1.662 1.338-3 3-3z" color-interpolation="sRGB" text-rendering="auto" fill="#ffffff" shape-rendering="auto"/>
+  <use fill="url(#b)" xlink:href="#c"/>
+ </g>
+</svg>

frontend/public/mime-types/application-json.svg

@@ -0,0 +1,137 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:xlink="http://www.w3.org/1999/xlink"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="64"
+   viewBox="0 0 64 64"
+   height="64"
+   id="svg2"
+   version="1.1"
+   inkscape:version="0.91 r13725"
+   sodipodi:docname="application-json.svg">
+  <metadata
+     id="metadata39">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="2560"
+     inkscape:window-height="1382"
+     id="namedview37"
+     showgrid="false"
+     inkscape:zoom="3.6875"
+     inkscape:cx="32"
+     inkscape:cy="32"
+     inkscape:window-x="0"
+     inkscape:window-y="36"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg2" />
+  <defs
+     id="defs4">
+    <linearGradient
+       id="a"
+       y1="17"
+       y2="31"
+       x1="40"
+       x2="54"
+       gradientUnits="userSpaceOnUse">
+      <stop
+         stop-color="#060606"
+         id="stop7" />
+      <stop
+         offset="1"
+         stop-opacity="0"
+         id="stop9" />
+    </linearGradient>
+    <linearGradient
+       id="b"
+       y1="392.36"
+       y2="336.36"
+       x2="0"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="translate(384,822)">
+      <stop
+         stop-color="#ffffff"
+         stop-opacity="0"
+         id="stop12" />
+      <stop
+         offset="1"
+         stop-color="#ffffff"
+         stop-opacity=".2"
+         id="stop14" />
+    </linearGradient>
+    <path
+       id="c"
+       d="m442 1215.36v-58h30l14 14v44h-14z" />
+  </defs>
+  <use
+     height="100%"
+     width="100%"
+     y="0"
+     x="0"
+     style="fill:#cf74e0"
+     id="use19"
+     xlink:href="#c"
+     transform="translate(-432,-1154.36)" />
+  <rect
+     x="10"
+     y="-3.9999855"
+     width="30"
+     height="1"
+     id="rect23"
+     style="color:#000000;opacity:0.5;color-interpolation:sRGB;color-interpolation-filters:linearRGB;fill:#ffffff;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto"
+     transform="scale(1,-1)" />
+  <rect
+     x="10"
+     y="-60.999985"
+     width="44"
+     height="1"
+     id="rect25"
+     style="color:#000000;opacity:0.25;color-interpolation:sRGB;color-interpolation-filters:linearRGB;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto"
+     transform="scale(1,-1)" />
+  <path
+     d="M 54,17 40,3 40,17 Z"
+     id="path29"
+     inkscape:connector-curvature="0"
+     style="opacity:0.5;fill:#ffffff;fill-rule:evenodd" />
+  <path
+     d="M 40,17 54,31 54,17 Z"
+     id="path31"
+     style="opacity:0.1;fill:url(#a);fill-rule:evenodd"
+     inkscape:connector-curvature="0" />
+  <path
+     style="color:#000000;opacity:0.75;color-interpolation:sRGB;color-interpolation-filters:linearRGB;fill:#ffffff;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto"
+     inkscape:connector-curvature="0"
+     id="path33-6"
+     d="m 29,22 c -2.216,0 -4,1.784 -4,4 l 0,3 c 0,1.662 -1.338,3 -3,3 l 0,1 c 2.216,0 4,-1.784 4,-4 l 0,-3 c 0,-1.662 1.338,-3 3,-3 z m -7,11 0,1 c 1.662,0 3,1.338 3,3 l 0,3 c 0,2.216 1.784,4 4,4 l 0,-1 c -1.662,0 -3,-1.338 -3,-3 l 0,-3 c 0,-2.216 -1.784,-4 -4,-4 m 13,-11 0,1 c 1.662,0 3,1.338 3,3 l 0,3 c 0,2.216 1.784,4 4,4 l 0,-1 c -1.662,0 -3,-1.338 -3,-3 l 0,-3 c 0,-2.216 -1.784,-4 -4,-4 m 7,11 c -2.216,0 -4,1.784 -4,4 l 0,3 c 0,1.662 -1.338,3 -3,3 l 0,1 c 2.216,0 4,-1.784 4,-4 l 0,-3 c 0,-1.662 1.338,-3 3,-3 z" />
+  <use
+     height="100%"
+     width="100%"
+     y="0"
+     x="0"
+     style="fill:url(#b)"
+     id="use35"
+     xlink:href="#c"
+     transform="translate(-432,-1154.36)" />
+</svg>

frontend/public/mime-types/application-mac-binhex40.svg

@@ -0,0 +1,27 @@
+<svg width="64" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" height="64" xmlns:xlink="http://www.w3.org/1999/xlink">
+ <defs>
+  <linearGradient id="a" y1="17" x1="40" y2="31" gradientUnits="userSpaceOnUse" x2="54">
+   <stop stop-color="#060606"/>
+   <stop offset="1" stop-opacity="0"/>
+  </linearGradient>
+  <linearGradient id="b" y1="392.36" y2="336.36" gradientUnits="userSpaceOnUse" x2="0" gradientTransform="translate(-48-332.36)">
+   <stop stop-color="#ffffff" stop-opacity="0"/>
+   <stop offset="1" stop-color="#ffffff" stop-opacity=".2"/>
+  </linearGradient>
+  <path id="c" d="m10 61v-58h30l14 14v44h-14z"/>
+ </defs>
+ <g color-rendering="auto" color-interpolation-filters="linearRGB" shape-rendering="auto" image-rendering="auto" text-rendering="auto" color-interpolation="sRGB" color="#000000">
+  <use fill="#555555" xlink:href="#c"/>
+  <g transform="scale(1-1)">
+   <rect opacity=".4" x="10" y="-4" width="30" fill="#ffffff" height="1"/>
+   <rect opacity=".35" x="10" y="-61" width="44" height="1"/>
+  </g>
+  <path opacity=".5" fill="#ffffff" fill-rule="evenodd" d="m54 17l-14-14v14z"/>
+ </g>
+ <path opacity=".4" fill="url(#a)" fill-rule="evenodd" d="m40 17l14 14v-14z"/>
+ <g color-rendering="auto" color-interpolation-filters="linearRGB" shape-rendering="auto" image-rendering="auto" text-rendering="auto" color-interpolation="sRGB" color="#000000">
+  <path fill="#343434" d="m20 24v22h26v-22zm18 1c.552 0 1 .448 1 1 0 .552-.448 1-1 1-.552 0-1-.448-1-1 0-.552.448-1 1-1m3 0c.552 0 1 .448 1 1 0 .552-.448 1-1 1-.552 0-1-.448-1-1 0-.552.448-1 1-1m3 0c.552 0 1 .448 1 1 0 .552-.448 1-1 1-.552 0-1-.448-1-1 0-.552.448-1 1-1m-23 3h24v17h-24zm8.799 4l2.713 4.721-3.094 5.279h1.184l2.502-4.416 2.5 4.416h1.131c.013-.01.027-.019.039-.029l-3.057-5.25 2.697-4.721h-1.211l-2.1 3.857-2.1-3.857z"/>
+  <path fill="#e0e0e0" d="m19 23v22h26v-22zm18 1c.552 0 1 .448 1 1 0 .552-.448 1-1 1-.552 0-1-.448-1-1 0-.552.448-1 1-1m3 0c.552 0 1 .448 1 1 0 .552-.448 1-1 1-.552 0-1-.448-1-1 0-.552.448-1 1-1m3 0c.552 0 1 .448 1 1 0 .552-.448 1-1 1-.552 0-1-.448-1-1 0-.552.448-1 1-1m-23 3h24v17h-24zm8.799 4l2.713 4.721-3.094 5.279h1.184l2.502-4.416 2.5 4.416h1.131c.013-.01.027-.019.039-.029l-3.057-5.25 2.697-4.721h-1.211l-2.1 3.857-2.1-3.857z"/>
+ </g>
+ <use fill="url(#b)" xlink:href="#c"/>
+</svg>

frontend/public/mime-types/application-mathml+xml.svg

@@ -0,0 +1,24 @@
+<svg width="64" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" height="64" xmlns:xlink="http://www.w3.org/1999/xlink">
+ <defs>
+  <linearGradient id="a" y1="392.36" y2="336.36" gradientUnits="userSpaceOnUse" x2="0" gradientTransform="translate(-48-332.36)">
+   <stop stop-color="#ffffff" stop-opacity="0"/>
+   <stop offset="1" stop-color="#ffffff" stop-opacity=".2"/>
+  </linearGradient>
+  <linearGradient id="b" y1="17" x1="40" y2="31" gradientUnits="userSpaceOnUse" x2="54">
+   <stop stop-color="#060606"/>
+   <stop offset="1" stop-opacity="0"/>
+  </linearGradient>
+  <path id="c" d="m10 61v-58h30l14 14v44h-14z"/>
+ </defs>
+ <use fill="#555555" xlink:href="#c"/>
+ <g color-rendering="auto" color-interpolation-filters="linearRGB" shape-rendering="auto" image-rendering="auto" text-rendering="auto" color-interpolation="sRGB" color="#000000" transform="scale(1-1)">
+  <rect opacity=".4" x="10" y="-4" width="30" fill="#ffffff" height="1"/>
+  <rect opacity=".35" x="10" y="-61" width="44" height="1"/>
+ </g>
+ <g fill-rule="evenodd">
+  <path opacity=".5" fill="#ffffff" d="m54 17l-14-14v14z"/>
+  <path opacity=".4" fill="url(#b)" d="m40 17l14 14v-14z"/>
+ </g>
+ <path opacity=".75" color-interpolation-filters="linearRGB" color="#000000" image-rendering="auto" color-rendering="auto" d="m40 26.01l-8 .004-4.441 7.691-1.555-2.695h-2v1h1.428l2.133 3.693 5.02-8.693h6.42v1h1zm-5 3c-1.662 0-3 1.338-3 3 0 1.662 1.338 3 3 3 .773 0 1.469-.298 2-.775v.775h1v-6h-1v.775c-.531-.477-1.227-.775-2-.775m0 1c1.108 0 2 .892 2 2 0 1.108-.892 2-2 2-1.108 0-2-.892-2-2 0-1.108.892-2 2-2m-11.99 6.99c-.006 0-.01.223-.01.5 0 .277.004.5.01.5h17.98c.006 0 .01-.223.01-.5 0-.277-.004-.5-.01-.5zm8 3c-.006 0-.01.223-.01.5 0 .277.004.5.01.5h1.98c.006 0 .01-.223.01-.5 0-.277-.004-.5-.01-.5z" color-interpolation="sRGB" text-rendering="auto" fill="#ffffff" shape-rendering="auto"/>
+ <use fill="url(#a)" xlink:href="#c"/>
+</svg>

frontend/public/mime-types/application-msonenote.svg

@@ -0,0 +1,222 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:xlink="http://www.w3.org/1999/xlink"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="64"
+   viewBox="0 0 64 64"
+   height="64"
+   id="svg2"
+   version="1.1"
+   inkscape:version="0.91 r13725"
+   sodipodi:docname="application-msonenote.svg">
+  <metadata
+     id="metadata39">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="640"
+     inkscape:window-height="480"
+     id="namedview37"
+     showgrid="false"
+     inkscape:snap-bbox="true"
+     inkscape:bbox-nodes="true"
+     inkscape:zoom="1"
+     inkscape:cx="36.561651"
+     inkscape:cy="28.512949"
+     inkscape:current-layer="svg2">
+    <inkscape:grid
+       type="xygrid"
+       id="grid4219" />
+  </sodipodi:namedview>
+  <defs
+     id="defs4">
+    <linearGradient
+       id="a"
+       y1="61"
+       y2="3"
+       x2="0"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="matrix(1 0 0-1 0 64)">
+      <stop
+         stop-color="#913d88"
+         id="stop7" />
+      <stop
+         offset="1"
+         stop-color="#9b4792"
+         id="stop9" />
+    </linearGradient>
+    <linearGradient
+       id="b"
+       y1="61"
+       y2="47"
+       x2="0"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="matrix(1 0 0-1 0 64)">
+      <stop
+         stop-color="#d5a5d0"
+         id="stop12" />
+      <stop
+         offset="1"
+         stop-color="#e7cbe4"
+         id="stop14" />
+    </linearGradient>
+    <linearGradient
+       id="c"
+       y1="17"
+       x1="40"
+       y2="31"
+       x2="54"
+       gradientUnits="userSpaceOnUse">
+      <stop
+         stop-color="#383e51"
+         id="stop17" />
+      <stop
+         offset="1"
+         stop-color="#655c6f"
+         stop-opacity="0"
+         id="stop19" />
+    </linearGradient>
+    <linearGradient
+       gradientTransform="matrix(1 0 0-1 0 64)"
+       gradientUnits="userSpaceOnUse"
+       x2="0"
+       y2="3"
+       y1="61"
+       id="a-7">
+      <stop
+         id="stop7-5"
+         stop-color="#3a539b" />
+      <stop
+         id="stop9-3"
+         stop-color="#3f5aa9"
+         offset="1" />
+    </linearGradient>
+    <linearGradient
+       gradientTransform="matrix(1 0 0-1 0 64)"
+       gradientUnits="userSpaceOnUse"
+       x2="0"
+       y2="47"
+       y1="61"
+       id="b-5">
+      <stop
+         id="stop12-6"
+         stop-color="#97aad8" />
+      <stop
+         id="stop14-2"
+         stop-color="#c1cae7"
+         offset="1" />
+    </linearGradient>
+    <path
+       d="m40 17l14 14v-14z"
+       id="d"
+       fill-rule="evenodd"
+       fill="url(#c)"
+       opacity=".2" />
+    <linearGradient
+       id="a-3"
+       y1="392.36"
+       y2="336.36"
+       gradientUnits="userSpaceOnUse"
+       x2="0"
+       gradientTransform="translate(-48,-332.36)">
+      <stop
+         stop-color="#ffffff"
+         stop-opacity="0"
+         id="stop4173" />
+      <stop
+         offset="1"
+         stop-color="#ffffff"
+         stop-opacity=".2"
+         id="stop4175" />
+    </linearGradient>
+    <linearGradient
+       id="b-6"
+       y1="17"
+       x1="40"
+       y2="31"
+       gradientUnits="userSpaceOnUse"
+       x2="54">
+      <stop
+         stop-color="#060606"
+         id="stop4178" />
+      <stop
+         offset="1"
+         stop-opacity="0"
+         id="stop4180" />
+    </linearGradient>
+    <path
+       id="c-7"
+       d="m10 61v-58h30l14 14v44h-14z" />
+  </defs>
+  <g
+     id="g4242">
+    <use
+       height="100%"
+       width="100%"
+       y="0"
+       x="0"
+       style="fill:#913d88;fill-opacity:1"
+       xlink:href="#c-7"
+       id="use4183" />
+    <rect
+       id="rect4187"
+       height="1"
+       width="30"
+       y="-4"
+       x="10"
+       style="color:#000000;opacity:0.5;color-interpolation:sRGB;color-interpolation-filters:linearRGB;fill:#ffffff;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto"
+       transform="scale(1,-1)" />
+    <rect
+       id="rect4189"
+       height="1"
+       width="44"
+       y="-61"
+       x="10"
+       style="color:#000000;opacity:0.25;color-interpolation:sRGB;color-interpolation-filters:linearRGB;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto"
+       transform="scale(1,-1)" />
+    <path
+       id="path4193"
+       d="M 54,17 40,3 40,17 Z"
+       inkscape:connector-curvature="0"
+       style="opacity:0.5;fill:#ffffff;fill-rule:evenodd" />
+    <path
+       style="opacity:0.2;fill:url(#b-6);fill-rule:evenodd"
+       id="path4195"
+       d="M 40,17 54,31 54,17 Z"
+       inkscape:connector-curvature="0" />
+    <path
+       inkscape:connector-curvature="0"
+       style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:0.75;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+       id="path35"
+       d="m 22,22 c -0.554,0 -1,0.446 -1,1 l 0,20 c 0,0.554 0.446,1 1,1 l 18,0 c 0.554,0 1,-0.446 1,-1 l 0,-1 1,0 c 0.554,0 1,-0.446 1,-1 l 0,-4 C 43,36.814 42.936,36.649 42.848,36.5 42.936,36.351 43,36.186 43,36 l 0,-4 C 43,31.814 42.936,31.649 42.848,31.5 42.936,31.351 43,31.186 43,31 l 0,-4 c 0,-0.554 -0.446,-1 -1,-1 l -1,0 0,-3 c 0,-0.554 -0.446,-1 -1,-1 z m 0,1 18,0 0,20 -18,0 z m 1,2 0,1 7,0 0,-1 z m 9,0 0,1 7,0 0,-1 z m 9,2 1,0 0,4 -1,0 z m -18,1 0,1 7,0 0,-1 z m 9,0 0,1 7,0 0,-1 z m -9,3 0,1 7,0 0,-1 z m 9,0 0,1 7,0 0,-1 z m 9,1 1,0 0,4 -1,0 z m -18,2 0,1 7,0 0,-1 z m 9,0 0,1 7,0 0,-1 z m -9,3 0,1 7,0 0,-1 z m 9,0 0,1 7,0 0,-1 z m 9,0 1,0 0,4 -1,0 z m -18,3 0,1 7,0 0,-1 z m 9,0 0,1 7,0 0,-1 z" />
+    <use
+       height="100%"
+       width="100%"
+       y="0"
+       x="0"
+       xlink:href="#c-7"
+       id="use4199"
+       style="fill:url(#a-3)" />
+  </g>
+</svg>