1<script> 2import { mapState, mapActions, mapGetters } from 'vuex'; 3import { stageKeys } from '../constants'; 4import EmptyState from './commit_sidebar/empty_state.vue'; 5import CommitFilesList from './commit_sidebar/list.vue'; 6 7export default { 8 components: { 9 CommitFilesList, 10 EmptyState, 11 }, 12 computed: { 13 ...mapState(['changedFiles', 'stagedFiles', 'lastCommitMsg']), 14 ...mapState('commit', ['commitMessage', 'submitCommitLoading']), 15 ...mapGetters(['lastOpenedFile', 'someUncommittedChanges', 'activeFile']), 16 ...mapGetters('commit', ['discardDraftButtonDisabled']), 17 showStageUnstageArea() { 18 return Boolean(this.someUncommittedChanges || this.lastCommitMsg); 19 }, 20 activeFileKey() { 21 return this.activeFile ? this.activeFile.key : null; 22 }, 23 }, 24 mounted() { 25 this.initialize(); 26 }, 27 activated() { 28 this.initialize(); 29 }, 30 methods: { 31 ...mapActions(['openPendingTab', 'updateViewer', 'updateActivityBarView']), 32 initialize() { 33 const file = 34 this.lastOpenedFile && this.lastOpenedFile.type !== 'tree' 35 ? this.lastOpenedFile 36 : this.activeFile; 37 38 if (!file) return; 39 40 this.openPendingTab({ 41 file, 42 keyPrefix: file.staged ? stageKeys.staged : stageKeys.unstaged, 43 }) 44 .then((changeViewer) => { 45 if (changeViewer) { 46 this.updateViewer('diff'); 47 } 48 }) 49 .catch((e) => { 50 throw e; 51 }); 52 }, 53 }, 54 stageKeys, 55}; 56</script> 57 58<template> 59 <div class="multi-file-commit-panel-section"> 60 <template v-if="showStageUnstageArea"> 61 <commit-files-list 62 :key-prefix="$options.stageKeys.staged" 63 :file-list="stagedFiles" 64 :active-file-key="activeFileKey" 65 :empty-state-text="__('There are no changes')" 66 class="is-first" 67 /> 68 </template> 69 <empty-state v-else /> 70 </div> 71</template> 72