Skip to content

G
gitlab-ce
Commit fffa5640 authored by Phil Hughes's avatar Phil Hughes
Browse files
Options

fixed closing last file not opening the next available file 

fixed right sidebar not being collapsible
parent 816b4202
Hide whitespace changes
Inline Side-by-side
Showing with 319 additions and 242 deletions
app/assets/stylesheets/pages/repo.scss
View file @ fffa5640
......@@ -68,7 +68,6 @@
.ide-new-btn {
display: none;
margin-top: -4px;
margin-bottom: -4px;
margin-right: -8px;
}
......@@ -84,7 +83,6 @@
fill: $gl-text-color-secondary;
}
}
}
a {
......@@ -290,7 +288,7 @@
.margin-view-overlays .insert-sign,
.margin-view-overlays .delete-sign {
opacity: .4;
opacity: 0.4;
}
}
}
......@@ -548,7 +546,6 @@
height: 10px;
margin-left: 3px;
}
}
.multi-file-commit-list-path {
......@@ -626,7 +623,7 @@
top: 0;
width: 100px;
height: 1px;
background-color: rgba($red-500, .5);
background-color: rgba($red-500, 0.5);
}
}
}
......@@ -697,8 +694,12 @@
}
.multi-file-commit-panel .multi-file-commit-panel-inner-scroll {
max-height: calc(100vh - #{$header-height + $flash-height + $context-header-height});
min-height: calc(100vh - #{$header-height + $flash-height + $context-header-height});
max-height: calc(
100vh - #{$header-height + $flash-height + $context-header-height}
);
min-height: calc(
100vh - #{$header-height + $flash-height + $context-header-height}
);
}
}
}
......@@ -729,17 +730,24 @@
}
.ide-view {
height: calc(100vh - #{$header-height + $performance-bar-height + $flash-height});
height: calc(
100vh - #{$header-height + $performance-bar-height + $flash-height}
);
}
.multi-file-commit-panel .multi-file-commit-panel-inner-scroll {
max-height: calc(100vh - #{$header-height + $performance-bar-height + $flash-height + $context-header-height});
min-height: calc(100vh - #{$header-height + $performance-bar-height + $flash-height + $context-header-height});
max-height: calc(
100vh - #{$header-height + $performance-bar-height + $flash-height +
$context-header-height}
);
min-height: calc(
100vh - #{$header-height + $performance-bar-height + $flash-height +
$context-header-height}
);
}
}
}
.dragHandle {
position: absolute;
top: 0;
......
ee/app/assets/javascripts/ide/components/ide_context_bar.vue
View file @ fffa5640
<script>
import { mapGetters, mapState } from 'vuex';
import icon from '~/vue_shared/components/icon.vue';
import panelResizer from '~/vue_shared/components/panel_resizer.vue';
import repoCommitSection from './repo_commit_section.vue';
import ResizablePanel from './resizable_panel.vue';
import { mapActions, mapGetters, mapState } from 'vuex';
import icon from '~/vue_shared/components/icon.vue';
import panelResizer from '~/vue_shared/components/panel_resizer.vue';
import repoCommitSection from './repo_commit_section.vue';
import ResizablePanel from './resizable_panel.vue';
export default {
components: {
repoCommitSection,
icon,
panelResizer,
ResizablePanel,
export default {
components: {
repoCommitSection,
icon,
panelResizer,
ResizablePanel,
},
props: {
noChangesStateSvgPath: {
type: String,
required: true,
},
props: {
noChangesStateSvgPath: {
type: String,
required: true,
},
committedStateSvgPath: {
type: String,
required: true,
},
committedStateSvgPath: {
type: String,
required: true,
},
computed: {
...mapState([
'changedFiles',
'rightPanelCollapsed',
]),
...mapGetters([
'currentIcon',
]),
},
};
},
computed: {
...mapState(['changedFiles', 'rightPanelCollapsed']),
...mapGetters(['currentIcon']),
},
methods: {
...mapActions(['setPanelCollapsedStatus']),
},
};
</script>
<template>
......@@ -66,7 +64,10 @@
<button
type="button"
class="btn btn-transparent multi-file-commit-panel-collapse-btn"
@click.stop="toggleCollapsed"
@click.stop="setPanelCollapsedStatus({
side: 'right',
collapsed: !rightPanelCollapsed,
})"
>
<icon
:name="currentIcon"
......
ee/app/assets/javascripts/ide/components/repo_file.vue
View file @ fffa5640
<script>
import { mapActions } from 'vuex';
import skeletonLoadingContainer from '~/vue_shared/components/skeleton_loading_container.vue';
import fileIcon from '~/vue_shared/components/file_icon.vue';
import router from '../ide_router';
import newDropdown from './new_dropdown/index.vue';
import fileStatusIcon from './repo_file_status_icon.vue';
import changedFileIcon from './changed_file_icon.vue';
import { mapActions } from 'vuex';
import skeletonLoadingContainer from '~/vue_shared/components/skeleton_loading_container.vue';
import fileIcon from '~/vue_shared/components/file_icon.vue';
import router from '../ide_router';
import newDropdown from './new_dropdown/index.vue';
import fileStatusIcon from './repo_file_status_icon.vue';
import changedFileIcon from './changed_file_icon.vue';
export default {
name: 'RepoFile',
components: {
skeletonLoadingContainer,
newDropdown,
fileStatusIcon,
fileIcon,
changedFileIcon,
export default {
name: 'RepoFile',
components: {
skeletonLoadingContainer,
newDropdown,
fileStatusIcon,
fileIcon,
changedFileIcon,
},
props: {
file: {
type: Object,
required: true,
},
props: {
file: {
type: Object,
required: true,
},
level: {
type: Number,
required: true,
},
level: {
type: Number,
required: true,
},
computed: {
isTree() {
return this.file.type === 'tree';
},
isBlob() {
return this.file.type === 'blob';
},
levelIndentation() {
return {
marginLeft: `${this.level * 16}px`,
};
},
fileClass() {
return {
'file-open': this.isBlob && this.file.opened,
'file-active': this.isBlob && this.file.active,
folder: this.isTree,
};
},
},
computed: {
isTree() {
return this.file.type === 'tree';
},
updated() {
if (this.file.type === 'blob' && this.file.active) {
this.$el.scrollIntoView();
}
isBlob() {
return this.file.type === 'blob';
},
levelIndentation() {
return {
marginLeft: `${this.level * 16}px`,
};
},
fileClass() {
return {
'file-open': this.isBlob && this.file.opened,
'file-active': this.isBlob && this.file.active,
folder: this.isTree,
};
},
methods: {
...mapActions(['toggleTreeOpen', 'updateDelayViewerUpdated']),
clickFile() {
// Manual Action if a tree is selected/opened
if (
this.isTree &&
this.$router.currentRoute.path === `/project${this.file.url}`
) {
this.toggleTreeOpen(this.file.path);
}
},
updated() {
if (this.file.type === 'blob' && this.file.active) {
this.$el.scrollIntoView();
}
},
methods: {
...mapActions(['toggleTreeOpen', 'updateDelayViewerUpdated']),
clickFile() {
// Manual Action if a tree is selected/opened
if (
this.isTree &&
this.$router.currentRoute.path === `/project${this.file.url}`
) {
this.toggleTreeOpen(this.file.path);
}
const delayPromise = this.file.changed
? Promise.resolve()
: this.updateDelayViewerUpdated(true);
const delayPromise = this.file.changed
? Promise.resolve()
: this.updateDelayViewerUpdated(true);
return delayPromise.then(() => {
router.push(`/project${this.file.url}`);
});
},
return delayPromise.then(() => {
router.push(`/project${this.file.url}`);
});
},
};
},
};
</script>
<template>
......@@ -101,16 +101,17 @@
:file="file"
/>
</span>
<changed-file-icon
:file="file"
v-if="file.changed || file.tempFile"
class="prepend-top-5 pull-right"
/>
<new-dropdown
v-if="isTree"
:project-id="file.projectId"
:branch="file.branchId"
:path="file.path"
/>
<changed-file-icon
:file="file"
v-if="file.changed || file.tempFile"
class="prepend-top-5"
class="pull-right prepend-left-8"
/>
</div>
</div>
......
ee/app/assets/javascripts/ide/stores/actions/file.js
View file @ fffa5640
......@@ -7,7 +7,7 @@ import router from '../../ide_router';
import { setPageTitle } from '../utils';
export const closeFile = ({ commit, state, getters, dispatch }, path) => {
const indexOfClosedFile = state.openFiles.indexOf(path);
const indexOfClosedFile = state.openFiles.findIndex(f => f.path === path);
const file = state.entries[path];
const fileWasActive = file.active;
......@@ -16,7 +16,7 @@ export const closeFile = ({ commit, state, getters, dispatch }, path) => {
if (state.openFiles.length > 0 && fileWasActive) {
const nextIndexToOpen = indexOfClosedFile === 0 ? 0 : indexOfClosedFile - 1;
const nextFileToOpen = state.entries[state.openFiles[nextIndexToOpen]];
const nextFileToOpen = state.entries[state.openFiles[nextIndexToOpen].path];
router.push(`/project${nextFileToOpen.url}`);
} else if (!state.openFiles.length) {
......
ee/app/assets/javascripts/ide/stores/modules/commit/actions.js
View file @ fffa5640
......@@ -137,6 +137,7 @@ export const commitChanges = ({ commit, state, getters, dispatch, rootState }) =
}
dispatch('setLastCommitMessage', data);
dispatch('updateCommitMessage', '');
if (state.commitAction === consts.COMMIT_TO_NEW_BRANCH_MR) {
dispatch(
......
spec/javascripts/ide/stores/actions/file_spec.js
View file @ fffa5640
......@@ -27,21 +27,24 @@ describe('Multi-file store file actions', () => {
store.state.entries[localFile.path] = localFile;
});
it('closes open files', (done) => {
store.dispatch('closeFile', localFile.path)
it('closes open files', done => {
store
.dispatch('closeFile', localFile.path)
.then(() => {
expect(localFile.opened).toBeFalsy();
expect(localFile.active).toBeFalsy();
expect(store.state.openFiles.length).toBe(0);
done();
}).catch(done.fail);
})
.catch(done.fail);
});
it('closes file even if file has changes', (done) => {
it('closes file even if file has changes', done => {
store.state.changedFiles.push(localFile);
store.dispatch('closeFile', localFile.path)
store
.dispatch('closeFile', localFile.path)
.then(Vue.nextTick)
.then(() => {
expect(store.state.openFiles.length).toBe(0);
......@@ -51,6 +54,26 @@ describe('Multi-file store file actions', () => {
})
.catch(done.fail);
});
it('closes file & opens next available file', done => {
const f = {
...file('newOpenFile'),
url: '/newOpenFile',
};
store.state.openFiles.push(f);
store.state.entries[f.path] = f;
store
.dispatch('closeFile', localFile.path)
.then(Vue.nextTick)
.then(() => {
expect(router.push).toHaveBeenCalledWith(`/project${f.url}`);
done();
})
.catch(done.fail);
});
});
describe('setFileActive', () => {
......@@ -72,58 +95,68 @@ describe('Multi-file store file actions', () => {
store._actions.scrollToTab = oldScrollToTab; // eslint-disable-line
});
it('calls scrollToTab', (done) => {
store.dispatch('setFileActive', localFile.path)
it('calls scrollToTab', done => {
store
.dispatch('setFileActive', localFile.path)
.then(() => {
expect(scrollToTabSpy).toHaveBeenCalled();
done();
}).catch(done.fail);
})
.catch(done.fail);
});
it('sets the file active', (done) => {
store.dispatch('setFileActive', localFile.path)
it('sets the file active', done => {
store
.dispatch('setFileActive', localFile.path)
.then(() => {
expect(localFile.active).toBeTruthy();
done();
}).catch(done.fail);
})
.catch(done.fail);
});
it('returns early if file is already active', (done) => {
it('returns early if file is already active', done => {
localFile.active = true;
store.dispatch('setFileActive', localFile.path)
store
.dispatch('setFileActive', localFile.path)
.then(() => {
expect(scrollToTabSpy).not.toHaveBeenCalled();
done();
}).catch(done.fail);
})
.catch(done.fail);
});
it('sets current active file to not active', (done) => {
it('sets current active file to not active', done => {
const f = file('newActive');
store.state.entries[f.path] = f;
localFile.active = true;
store.state.openFiles.push(localFile);
store.dispatch('setFileActive', f.path)
store
.dispatch('setFileActive', f.path)
.then(() => {
expect(localFile.active).toBeFalsy();
done();
}).catch(done.fail);
})
.catch(done.fail);
});
it('resets location.hash for line highlighting', (done) => {
it('resets location.hash for line highlighting', done => {
location.hash = 'test';
store.dispatch('setFileActive', localFile.path)
store
.dispatch('setFileActive', localFile.path)
.then(() => {
expect(location.hash).not.toBe('test');
done();
}).catch(done.fail);
})
.catch(done.fail);
});
});
......@@ -131,70 +164,83 @@ describe('Multi-file store file actions', () => {
let localFile;
beforeEach(() => {
spyOn(service, 'getFileData').and.returnValue(Promise.resolve({
headers: {
'page-title': 'testing getFileData',
},
json: () => Promise.resolve({
blame_path: 'blame_path',
commits_path: 'commits_path',
permalink: 'permalink',
raw_path: 'raw_path',
binary: false,
html: '123',
render_error: '',
spyOn(service, 'getFileData').and.returnValue(
Promise.resolve({
headers: {
'page-title': 'testing getFileData',
},
json: () =>
Promise.resolve({
blame_path: 'blame_path',
commits_path: 'commits_path',
permalink: 'permalink',
raw_path: 'raw_path',
binary: false,
html: '123',
render_error: '',
}),
}),
}));
);
localFile = file(`newCreate-${Math.random()}`);
localFile.url = 'getFileDataURL';
store.state.entries[localFile.path] = localFile;
});
it('calls the service', (done) => {
store.dispatch('getFileData', localFile)
it('calls the service', done => {
store
.dispatch('getFileData', localFile)
.then(() => {
expect(service.getFileData).toHaveBeenCalledWith('getFileDataURL');
done();
}).catch(done.fail);
})
.catch(done.fail);
});
it('sets the file data', (done) => {
store.dispatch('getFileData', localFile)
it('sets the file data', done => {
store
.dispatch('getFileData', localFile)
.then(() => {
expect(localFile.blamePath).toBe('blame_path');
done();
}).catch(done.fail);
})
.catch(done.fail);
});
it('sets document title', (done) => {
store.dispatch('getFileData', localFile)
it('sets document title', done => {
store
.dispatch('getFileData', localFile)
.then(() => {
expect(document.title).toBe('testing getFileData');
done();
}).catch(done.fail);
})
.catch(done.fail);
});
it('sets the file as active', (done) => {
store.dispatch('getFileData', localFile)
it('sets the file as active', done => {
store
.dispatch('getFileData', localFile)
.then(() => {
expect(localFile.active).toBeTruthy();
done();
}).catch(done.fail);
})
.catch(done.fail);
});
it('adds the file to open files', (done) => {
store.dispatch('getFileData', localFile)
it('adds the file to open files', done => {
store
.dispatch('getFileData', localFile)
.then(() => {
expect(store.state.openFiles.length).toBe(1);
expect(store.state.openFiles[0].name).toBe(localFile.name);
done();
}).catch(done.fail);
})
.catch(done.fail);
});
});
......@@ -208,22 +254,26 @@ describe('Multi-file store file actions', () => {
store.state.entries[tmpFile.path] = tmpFile;
});
it('calls getRawFileData service method', (done) => {
store.dispatch('getRawFileData', tmpFile)
it('calls getRawFileData service method', done => {
store
.dispatch('getRawFileData', tmpFile)
.then(() => {
expect(service.getRawFileData).toHaveBeenCalledWith(tmpFile);
done();
}).catch(done.fail);
})
.catch(done.fail);
});
it('updates file raw data', (done) => {
store.dispatch('getRawFileData', tmpFile)
it('updates file raw data', done => {
store
.dispatch('getRawFileData', tmpFile)
.then(() => {
expect(tmpFile.raw).toBe('raw');
done();
}).catch(done.fail);
})
.catch(done.fail);
});
});
......@@ -235,60 +285,72 @@ describe('Multi-file store file actions', () => {
store.state.entries[tmpFile.path] = tmpFile;
});
it('updates file content', (done) => {
store.dispatch('changeFileContent', {
path: tmpFile.path,
content: 'content',
})
.then(() => {
expect(tmpFile.content).toBe('content');
it('updates file content', done => {
store
.dispatch('changeFileContent', {
path: tmpFile.path,
content: 'content',
})
.then(() => {
expect(tmpFile.content).toBe('content');
done();
}).catch(done.fail);
done();
})
.catch(done.fail);
});
it('adds file into changedFiles array', (done) => {
store.dispatch('changeFileContent', {
path: tmpFile.path,
content: 'content',
})
.then(() => {
expect(store.state.changedFiles.length).toBe(1);
it('adds file into changedFiles array', done => {
store
.dispatch('changeFileContent', {
path: tmpFile.path,
content: 'content',
})
.then(() => {
expect(store.state.changedFiles.length).toBe(1);
done();
}).catch(done.fail);
done();
})
.catch(done.fail);
});
it('adds file once into changedFiles array', (done) => {
store.dispatch('changeFileContent', {
path: tmpFile.path,
content: 'content',
})
.then(() => store.dispatch('changeFileContent', {
path: tmpFile.path,
content: 'content 123',
}))
.then(() => {
expect(store.state.changedFiles.length).toBe(1);
done();
}).catch(done.fail);
it('adds file once into changedFiles array', done => {
store
.dispatch('changeFileContent', {
path: tmpFile.path,
content: 'content',
})
.then(() =>
store.dispatch('changeFileContent', {
path: tmpFile.path,
content: 'content 123',
}),
)
.then(() => {
expect(store.state.changedFiles.length).toBe(1);
done();
})
.catch(done.fail);
});
it('removes file from changedFiles array if not changed', (done) => {
store.dispatch('changeFileContent', {
path: tmpFile.path,
content: 'content',
})
.then(() => store.dispatch('changeFileContent', {
path: tmpFile.path,
content: '',
}))
.then(() => {
expect(store.state.changedFiles.length).toBe(0);
done();
}).catch(done.fail);
it('removes file from changedFiles array if not changed', done => {
store
.dispatch('changeFileContent', {
path: tmpFile.path,
content: 'content',
})
.then(() =>
store.dispatch('changeFileContent', {
path: tmpFile.path,
content: '',
}),
)
.then(() => {
expect(store.state.changedFiles.length).toBe(0);
done();
})
.catch(done.fail);
});
});
......@@ -305,51 +367,55 @@ describe('Multi-file store file actions', () => {
store.state.entries[tmpFile.path] = tmpFile;
});
it('resets file content', (done) => {
store.dispatch('discardFileChanges', tmpFile.path)
.then(() => {
expect(tmpFile.content).not.toBe('testing');
it('resets file content', done => {
store
.dispatch('discardFileChanges', tmpFile.path)
.then(() => {
expect(tmpFile.content).not.toBe('testing');
done();
})
.catch(done.fail);
done();
})
.catch(done.fail);
});
it('removes file from changedFiles array', (done) => {
store.dispatch('discardFileChanges', tmpFile.path)
.then(() => {
expect(store.state.changedFiles.length).toBe(0);
it('removes file from changedFiles array', done => {
store
.dispatch('discardFileChanges', tmpFile.path)
.then(() => {
expect(store.state.changedFiles.length).toBe(0);
done();
})
.catch(done.fail);
done();
})
.catch(done.fail);
});
it('closes temp file', (done) => {
it('closes temp file', done => {
tmpFile.tempFile = true;
tmpFile.opened = true;
store.dispatch('discardFileChanges', tmpFile.path)
.then(() => {
expect(tmpFile.opened).toBeFalsy();
store
.dispatch('discardFileChanges', tmpFile.path)
.then(() => {
expect(tmpFile.opened).toBeFalsy();
done();
})
.catch(done.fail);
done();
})
.catch(done.fail);
});
it('does not re-open a closed temp file', (done) => {
it('does not re-open a closed temp file', done => {
tmpFile.tempFile = true;
expect(tmpFile.opened).toBeFalsy();
store.dispatch('discardFileChanges', tmpFile.path)
.then(() => {
expect(tmpFile.opened).toBeFalsy();
store
.dispatch('discardFileChanges', tmpFile.path)
.then(() => {
expect(tmpFile.opened).toBeFalsy();
done();
})
.catch(done.fail);
done();
})
.catch(done.fail);
});
});
});
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment
GitLab Nexedi Edition | About GitLab | About Nexedi | 沪ICP备2021021310号-2 | 沪ICP备2021021310号-7