mirror of https://github.com/portainer/portainer
refactor(agent): refactor host-broswer to es6 (#4088)
* refactor(host): replace host-browser with es6 class * refactor(host): replace promises with async * refactor(hosts): replace delete promise with async * refactor(host): replace upload file with async * refactor(host): replace template strings * fix(host): replace host root * feat(agent): rename main filepull/4098/head
Chaim Lev-Ari
GitHub
parent
a473d738be
commit
1ef7347f19
|
|
@ -1,149 +0,0 @@
|
||||||
import _ from 'lodash-es';
|
|
||||||
|
|
||||||
angular.module('portainer.agent').controller('HostBrowserController', [
|
|
||||||
'HostBrowserService',
|
|
||||||
'Notifications',
|
|
||||||
'FileSaver',
|
|
||||||
'ModalService',
|
|
||||||
function HostBrowserController(HostBrowserService, Notifications, FileSaver, ModalService) {
|
|
||||||
var ctrl = this;
|
|
||||||
var ROOT_PATH = '/host';
|
|
||||||
ctrl.state = {
|
|
||||||
path: ROOT_PATH,
|
|
||||||
};
|
|
||||||
|
|
||||||
ctrl.goToParent = goToParent;
|
|
||||||
ctrl.browse = browse;
|
|
||||||
ctrl.renameFile = renameFile;
|
|
||||||
ctrl.downloadFile = downloadFile;
|
|
||||||
ctrl.deleteFile = confirmDeleteFile;
|
|
||||||
ctrl.isRoot = isRoot;
|
|
||||||
ctrl.onFileSelectedForUpload = onFileSelectedForUpload;
|
|
||||||
ctrl.$onInit = $onInit;
|
|
||||||
ctrl.getRelativePath = getRelativePath;
|
|
||||||
|
|
||||||
function getRelativePath(path) {
|
|
||||||
path = path || ctrl.state.path;
|
|
||||||
var rootPathRegex = new RegExp('^' + ROOT_PATH + '/?');
|
|
||||||
var relativePath = path.replace(rootPathRegex, '/');
|
|
||||||
return relativePath;
|
|
||||||
}
|
|
||||||
|
|
||||||
function goToParent() {
|
|
||||||
getFilesForPath(parentPath(this.state.path));
|
|
||||||
}
|
|
||||||
|
|
||||||
function isRoot() {
|
|
||||||
return ctrl.state.path === ROOT_PATH;
|
|
||||||
}
|
|
||||||
|
|
||||||
function browse(folder) {
|
|
||||||
getFilesForPath(buildPath(ctrl.state.path, folder));
|
|
||||||
}
|
|
||||||
|
|
||||||
function getFilesForPath(path) {
|
|
||||||
HostBrowserService.ls(path)
|
|
||||||
.then(function onFilesLoaded(files) {
|
|
||||||
ctrl.state.path = path;
|
|
||||||
ctrl.files = files;
|
|
||||||
})
|
|
||||||
.catch(function onLoadingFailed(err) {
|
|
||||||
Notifications.error('Failure', err, 'Unable to browse');
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function renameFile(name, newName) {
|
|
||||||
var filePath = buildPath(ctrl.state.path, name);
|
|
||||||
var newFilePath = buildPath(ctrl.state.path, newName);
|
|
||||||
|
|
||||||
HostBrowserService.rename(filePath, newFilePath)
|
|
||||||
.then(function onRenameSuccess() {
|
|
||||||
Notifications.success('File successfully renamed', getRelativePath(newFilePath));
|
|
||||||
return HostBrowserService.ls(ctrl.state.path);
|
|
||||||
})
|
|
||||||
.then(function onFilesLoaded(files) {
|
|
||||||
ctrl.files = files;
|
|
||||||
})
|
|
||||||
.catch(function notifyOnError(err) {
|
|
||||||
Notifications.error('Failure', err, 'Unable to rename file');
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function downloadFile(file) {
|
|
||||||
var filePath = buildPath(ctrl.state.path, file);
|
|
||||||
HostBrowserService.get(filePath)
|
|
||||||
.then(function onFileReceived(data) {
|
|
||||||
var downloadData = new Blob([data.file], {
|
|
||||||
type: 'text/plain;charset=utf-8',
|
|
||||||
});
|
|
||||||
FileSaver.saveAs(downloadData, file);
|
|
||||||
})
|
|
||||||
.catch(function notifyOnError(err) {
|
|
||||||
Notifications.error('Failure', err, 'Unable to download file');
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function confirmDeleteFile(name) {
|
|
||||||
var filePath = buildPath(ctrl.state.path, name);
|
|
||||||
|
|
||||||
ModalService.confirmDeletion('Are you sure that you want to delete ' + getRelativePath(filePath) + ' ?', function onConfirm(confirmed) {
|
|
||||||
if (!confirmed) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
return deleteFile(filePath);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function deleteFile(path) {
|
|
||||||
HostBrowserService.delete(path)
|
|
||||||
.then(function onDeleteSuccess() {
|
|
||||||
Notifications.success('File successfully deleted', getRelativePath(path));
|
|
||||||
return HostBrowserService.ls(ctrl.state.path);
|
|
||||||
})
|
|
||||||
.then(function onFilesLoaded(data) {
|
|
||||||
ctrl.files = data;
|
|
||||||
})
|
|
||||||
.catch(function notifyOnError(err) {
|
|
||||||
Notifications.error('Failure', err, 'Unable to delete file');
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function $onInit() {
|
|
||||||
getFilesForPath(ROOT_PATH);
|
|
||||||
}
|
|
||||||
|
|
||||||
function parentPath(path) {
|
|
||||||
if (path === ROOT_PATH) {
|
|
||||||
return ROOT_PATH;
|
|
||||||
}
|
|
||||||
|
|
||||||
var split = _.split(path, '/');
|
|
||||||
return _.join(_.slice(split, 0, split.length - 1), '/');
|
|
||||||
}
|
|
||||||
|
|
||||||
function buildPath(parent, file) {
|
|
||||||
if (parent.lastIndexOf('/') === parent.length - 1) {
|
|
||||||
return parent + file;
|
|
||||||
}
|
|
||||||
return parent + '/' + file;
|
|
||||||
}
|
|
||||||
|
|
||||||
function onFileSelectedForUpload(file) {
|
|
||||||
HostBrowserService.upload(ctrl.state.path, file)
|
|
||||||
.then(function onFileUpload() {
|
|
||||||
onFileUploaded();
|
|
||||||
})
|
|
||||||
.catch(function onFileUpload(err) {
|
|
||||||
Notifications.error('Failure', err, 'Unable to upload file');
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function onFileUploaded() {
|
|
||||||
refreshList();
|
|
||||||
}
|
|
||||||
|
|
||||||
function refreshList() {
|
|
||||||
getFilesForPath(ctrl.state.path);
|
|
||||||
}
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
|
|
@ -1,5 +0,0 @@
|
||||||
angular.module('portainer.agent').component('hostBrowser', {
|
|
||||||
controller: 'HostBrowserController',
|
|
||||||
templateUrl: './host-browser.html',
|
|
||||||
bindings: {},
|
|
||||||
});
|
|
||||||
|
|
@ -9,7 +9,7 @@
|
||||||
browse="$ctrl.browse(name)"
|
browse="$ctrl.browse(name)"
|
||||||
rename="$ctrl.renameFile(name, newName)"
|
rename="$ctrl.renameFile(name, newName)"
|
||||||
download="$ctrl.downloadFile(name)"
|
download="$ctrl.downloadFile(name)"
|
||||||
delete="$ctrl.deleteFile(name)"
|
delete="$ctrl.confirmDeleteFile(name)"
|
||||||
is-upload-allowed="true"
|
is-upload-allowed="true"
|
||||||
on-file-selected-for-upload="($ctrl.onFileSelectedForUpload)"
|
on-file-selected-for-upload="($ctrl.onFileSelectedForUpload)"
|
||||||
>
|
>
|
||||||
|
|
@ -0,0 +1,158 @@
|
||||||
|
import _ from 'lodash-es';
|
||||||
|
|
||||||
|
const ROOT_PATH = '/host';
|
||||||
|
|
||||||
|
export class HostBrowserController {
|
||||||
|
constructor($async, HostBrowserService, Notifications, FileSaver, ModalService) {
|
||||||
|
Object.assign(this, { $async, HostBrowserService, Notifications, FileSaver, ModalService });
|
||||||
|
|
||||||
|
this.state = {
|
||||||
|
path: ROOT_PATH,
|
||||||
|
};
|
||||||
|
|
||||||
|
this.goToParent = this.goToParent.bind(this);
|
||||||
|
this.browse = this.browse.bind(this);
|
||||||
|
this.confirmDeleteFile = this.confirmDeleteFile.bind(this);
|
||||||
|
this.isRoot = this.isRoot.bind(this);
|
||||||
|
this.getRelativePath = this.getRelativePath.bind(this);
|
||||||
|
this.getFilesForPath = this.getFilesForPath.bind(this);
|
||||||
|
this.getFilesForPathAsync = this.getFilesForPathAsync.bind(this);
|
||||||
|
this.downloadFile = this.downloadFile.bind(this);
|
||||||
|
this.downloadFileAsync = this.downloadFileAsync.bind(this);
|
||||||
|
this.renameFile = this.renameFile.bind(this);
|
||||||
|
this.renameFileAsync = this.renameFileAsync.bind(this);
|
||||||
|
this.deleteFile = this.deleteFile.bind(this);
|
||||||
|
this.deleteFileAsync = this.deleteFileAsync.bind(this);
|
||||||
|
this.onFileSelectedForUpload = this.onFileSelectedForUpload.bind(this);
|
||||||
|
this.onFileSelectedForUploadAsync = this.onFileSelectedForUploadAsync.bind(this);
|
||||||
|
}
|
||||||
|
|
||||||
|
getRelativePath(path) {
|
||||||
|
path = path || this.state.path;
|
||||||
|
const rootPathRegex = new RegExp(`^${ROOT_PATH}/?`);
|
||||||
|
const relativePath = path.replace(rootPathRegex, '/');
|
||||||
|
return relativePath;
|
||||||
|
}
|
||||||
|
|
||||||
|
goToParent() {
|
||||||
|
this.getFilesForPath(this.parentPath(this.state.path));
|
||||||
|
}
|
||||||
|
|
||||||
|
isRoot() {
|
||||||
|
return this.state.path === ROOT_PATH;
|
||||||
|
}
|
||||||
|
|
||||||
|
browse(folder) {
|
||||||
|
this.getFilesForPath(this.buildPath(this.state.path, folder));
|
||||||
|
}
|
||||||
|
|
||||||
|
getFilesForPath(path) {
|
||||||
|
return this.$async(this.getFilesForPathAsync, path);
|
||||||
|
}
|
||||||
|
async getFilesForPathAsync(path) {
|
||||||
|
try {
|
||||||
|
const files = await this.HostBrowserService.ls(path);
|
||||||
|
this.state.path = path;
|
||||||
|
this.files = files;
|
||||||
|
} catch (err) {
|
||||||
|
this.Notifications.error('Failure', err, 'Unable to browse');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
renameFile(name, newName) {
|
||||||
|
return this.$async(this.renameFileAsync, name, newName);
|
||||||
|
}
|
||||||
|
async renameFileAsync(name, newName) {
|
||||||
|
const filePath = this.buildPath(this.state.path, name);
|
||||||
|
const newFilePath = this.buildPath(this.state.path, newName);
|
||||||
|
try {
|
||||||
|
await this.HostBrowserService.rename(filePath, newFilePath);
|
||||||
|
this.Notifications.success('File successfully renamed', this.getRelativePath(newFilePath));
|
||||||
|
const files = await this.HostBrowserService.ls(this.state.path);
|
||||||
|
this.files = files;
|
||||||
|
} catch (err) {
|
||||||
|
this.Notifications.error('Failure', err, 'Unable to rename file');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
downloadFile(fileName) {
|
||||||
|
return this.$async(this.downloadFileAsync, fileName);
|
||||||
|
}
|
||||||
|
async downloadFileAsync(fileName) {
|
||||||
|
const filePath = this.buildPath(this.state.path, fileName);
|
||||||
|
try {
|
||||||
|
const { file } = await this.HostBrowserService.get(filePath);
|
||||||
|
const downloadData = new Blob([file], {
|
||||||
|
type: 'text/plain;charset=utf-8',
|
||||||
|
});
|
||||||
|
this.FileSaver.saveAs(downloadData, fileName);
|
||||||
|
} catch (err) {
|
||||||
|
this.Notifications.error('Failure', err, 'Unable to download file');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
confirmDeleteFile(name) {
|
||||||
|
const filePath = this.buildPath(this.state.path, name);
|
||||||
|
|
||||||
|
this.ModalService.confirmDeletion(`Are you sure that you want to delete ${this.getRelativePath(filePath)} ?`, (confirmed) => {
|
||||||
|
if (!confirmed) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
return this.deleteFile(filePath);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
deleteFile(path) {
|
||||||
|
this.$async(this.deleteFileAsync, path);
|
||||||
|
}
|
||||||
|
async deleteFileAsync(path) {
|
||||||
|
try {
|
||||||
|
await this.HostBrowserService.delete(path);
|
||||||
|
this.Notifications.success('File successfully deleted', this.getRelativePath(path));
|
||||||
|
const files = await this.HostBrowserService.ls(this.state.path);
|
||||||
|
this.files = files;
|
||||||
|
} catch (err) {
|
||||||
|
this.Notifications.error('Failure', err, 'Unable to delete file');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
$onInit() {
|
||||||
|
this.getFilesForPath(ROOT_PATH);
|
||||||
|
}
|
||||||
|
|
||||||
|
parentPath(path) {
|
||||||
|
if (path === ROOT_PATH) {
|
||||||
|
return ROOT_PATH;
|
||||||
|
}
|
||||||
|
|
||||||
|
const split = _.split(path, '/');
|
||||||
|
return _.join(_.slice(split, 0, split.length - 1), '/');
|
||||||
|
}
|
||||||
|
|
||||||
|
buildPath(parent, file) {
|
||||||
|
if (parent.lastIndexOf('/') === parent.length - 1) {
|
||||||
|
return parent + file;
|
||||||
|
}
|
||||||
|
return parent + '/' + file;
|
||||||
|
}
|
||||||
|
|
||||||
|
onFileSelectedForUpload(file) {
|
||||||
|
return this.$async(this.onFileSelectedForUploadAsync, file);
|
||||||
|
}
|
||||||
|
async onFileSelectedForUploadAsync(file) {
|
||||||
|
try {
|
||||||
|
await this.HostBrowserService.upload(this.state.path, file);
|
||||||
|
this.onFileUploaded();
|
||||||
|
} catch (err) {
|
||||||
|
this.Notifications.error('Failure', err, 'Unable to upload file');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
onFileUploaded() {
|
||||||
|
this.refreshList();
|
||||||
|
}
|
||||||
|
|
||||||
|
refreshList() {
|
||||||
|
this.getFilesForPath(this.state.path);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,7 @@
|
||||||
|
import angular from 'angular';
|
||||||
|
import { HostBrowserController } from './hostBrowserController';
|
||||||
|
|
||||||
|
angular.module('portainer.agent').component('hostBrowser', {
|
||||||
|
controller: HostBrowserController,
|
||||||
|
templateUrl: './hostBrowser.html',
|
||||||
|
});
|
||||||
Loading…
Reference in New Issue