@@ -35,7 +52,7 @@
import {ApplicationState, FileManagerState} from '@/store/types';
import {mapState} from "vuex";
import * as Ace from 'brace';
- import { join } from 'path';
+ import {join} from 'path';
import {DirectoryContentObject} from "@/api/server/types";
import getFileContents from '@/api/server/files/getFileContents';
import SpinnerModal from "@/components/core/SpinnerModal.vue";
@@ -46,11 +63,12 @@
file?: DirectoryContentObject,
serverUuid?: string,
fm?: FileManagerState,
+ fileName?: string,
error: string | null,
editor: Ace.Editor | null,
isVisible: boolean,
isLoading: boolean,
- supportedTypes: {type: string, name: string, default?: boolean}[],
+ supportedTypes: { type: string, name: string, default?: boolean }[],
}
const defaults = {
@@ -58,6 +76,8 @@
editor: null,
isVisible: false,
isLoading: true,
+ file: undefined,
+ fileName: undefined,
};
export default Vue.extend({
@@ -101,6 +121,8 @@
this.file = file;
this.isVisible = true;
this.isLoading = true;
+ this.fileName = file ? file.name : undefined;
+ this.errors.clear();
this.$nextTick(() => {
this.editor = Ace.edit('editor');
@@ -120,13 +142,36 @@
});
},
+ watch: {
+ fileName: function (newValue?: string, oldValue?: string) {
+ if (newValue === oldValue || !newValue) {
+ return;
+ }
+
+ this.updateFileLanguageFromName(newValue);
+ },
+ },
+
methods: {
submit: function () {
+ if (!this.file && (!this.fileName || this.fileName.length === 0)) {
+ this.error = 'You must provide a file name before saving.';
+ return;
+ }
+
this.isLoading = true;
const content = this.editor!.getValue();
- writeFileContents(this.serverUuid!, join(this.fm!.currentDirectory, this.file!.name), content)
- .then(() => this.error = null)
+ writeFileContents(this.serverUuid!, join(this.fm!.currentDirectory, this.fileName!), content)
+ .then(() => {
+ this.error = null;
+
+ // @todo come up with a more graceful solution here
+ if (!this.file) {
+ this.$emit('refresh');
+ this.closeModal();
+ }
+ })
.catch(error => {
console.log(error);
this.error = httpErrorToHuman(error);
@@ -136,7 +181,7 @@
loadFileContent: function (): Promise {
return new Promise((resolve, reject) => {
- const { editor, file } = this;
+ const {editor, file} = this;
if (!file || !editor || file.directory) {
return resolve();
@@ -147,29 +192,32 @@
editor.$blockScrolling = Infinity;
editor.setValue(contents, 1);
})
- .then(() => {
- // Set the correct MIME type on the editor for the user.
- const modelist = Ace.acequire('ace/ext/modelist');
- if (modelist) {
- const mode = modelist.getModeForPath(file.name).mode || 'ace/mode/text';
- editor.getSession().setMode(mode);
-
- const parts = mode.split('/');
- const element = (this.$refs.fileLanguageSelector as HTMLSelectElement | null);
-
- if (element) {
- const index = this.supportedTypes.findIndex(value => value.type === parts[parts.length - 1]);
- if (index >= 0) {
- element.selectedIndex = index;
- }
- }
- }
- })
+ .then(() => this.updateFileLanguageFromName(file.name))
.then(() => resolve())
.catch(reject);
});
},
+ updateFileLanguageFromName: function (name: string) {
+ const modelist = Ace.acequire('ace/ext/modelist');
+ if (!modelist || !this.editor) {
+ return;
+ }
+
+ const mode = modelist.getModeForPath(name).mode || 'ace/mode/text';
+
+ const parts = mode.split('/');
+ const element = (this.$refs.fileLanguageSelector as HTMLSelectElement | null);
+
+ if (element) {
+ const index = this.supportedTypes.findIndex(value => value.type === parts[parts.length - 1]);
+ if (index >= 0) {
+ element.selectedIndex = index;
+ this.editor.getSession().setMode(mode);
+ }
+ }
+ },
+
updateFileLanguage: function (e: MouseEvent) {
if (!this.editor) {
return;
@@ -185,7 +233,7 @@
/* webpackMode: "lazy-once" */
/* webpackInclude: /(dockerfile|golang|html|java|javascript|json|kotlin|lua|markdown|text|php|properties|python|ruby|sh|sql|xml|yaml).js$/ */
`brace/mode/${o.type}`
- ))
+ ))
);
},
diff --git a/resources/assets/scripts/components/server/subpages/FileManager.vue b/resources/assets/scripts/components/server/subpages/FileManager.vue
index 4a5b50f88..59e3bdcb7 100644
--- a/resources/assets/scripts/components/server/subpages/FileManager.vue
+++ b/resources/assets/scripts/components/server/subpages/FileManager.vue
@@ -52,7 +52,7 @@