Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(files): attach sidebar to main content for vue debug #50814

Open
wants to merge 2 commits into
base: master
Choose a base branch
from
+27 −17
Open

fix(files): attach sidebar to main content for vue debug #50814

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
f73c34b
fix(files): attach sidebar to main content for vue debug
skjnldsv Feb 14, 2025
6c8c80d
fix(systemtags): do not hide if no tags
skjnldsv Feb 14, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 10 additions & 2 deletions apps/files/src/sidebar.js → apps/files/src/sidebar.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,8 @@ window.addEventListener('DOMContentLoaded', function() {
const contentElement = document.querySelector('body > .content')
|| document.querySelector('body > #content')

let vueParent

// Make sure we have a proper layout
if (contentElement) {
// Make sure we have a mountpoint
Expand All @@ -31,14 +33,20 @@ window.addEventListener('DOMContentLoaded', function() {
sidebarElement.id = 'app-sidebar'
contentElement.appendChild(sidebarElement)
}

// Helps with vue debug, as we mount the sidebar to the
// content element which is a vue instance itself
vueParent = contentElement.__vue__ as Vue
}

// Init vue app
const View = Vue.extend(SidebarView)
const AppSidebar = new View({
name: 'SidebarRoot',
})
AppSidebar.$mount('#app-sidebar')
parent: vueParent,
}).$mount('#app-sidebar')

// Expose Sidebar methods
window.OCA.Files.Sidebar.open = AppSidebar.open
window.OCA.Files.Sidebar.close = AppSidebar.close
window.OCA.Files.Sidebar.setFullScreenMode = AppSidebar.setFullScreenMode
Expand Down
29 changes: 16 additions & 13 deletions apps/files/src/views/Sidebar.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -38,8 +38,7 @@
<SystemTags v-if="isSystemTagsEnabled && showTagsDefault"
v-show="showTags"
:disabled="!fileInfo?.canEdit()"
:file-id="fileInfo.id"
@has-tags="value => showTags = value" />
:file-id="fileInfo.id" />
<LegacyView v-for="view in views"
:key="view.cid"
:component="view"
Expand Down Expand Up @@ -93,19 +92,20 @@
</template>
</NcAppSidebar>
</template>
<script>
import { getCurrentUser } from '@nextcloud/auth'
import { getCapabilities } from '@nextcloud/capabilities'
import { showError } from '@nextcloud/dialogs'
<script lang="ts">
import { davRemoteURL, davRootPath, File, Folder, formatFileSize } from '@nextcloud/files'
import { defineComponent } from 'vue'
import { emit, subscribe, unsubscribe } from '@nextcloud/event-bus'
import { File, Folder, davRemoteURL, davRootPath, formatFileSize } from '@nextcloud/files'
import { encodePath } from '@nextcloud/paths'
import { fetchNode } from '../services/WebdavClient.ts'
import { generateUrl } from '@nextcloud/router'
import { ShareType } from '@nextcloud/sharing'
import { getCapabilities } from '@nextcloud/capabilities'
import { getCurrentUser } from '@nextcloud/auth'
import { mdiStar, mdiStarOutline } from '@mdi/js'
import { fetchNode } from '../services/WebdavClient.ts'
import axios from '@nextcloud/axios'
import { ShareType } from '@nextcloud/sharing'
import { showError } from '@nextcloud/dialogs'
import $ from 'jquery'
import axios from '@nextcloud/axios'

import NcAppSidebar from '@nextcloud/vue/dist/Components/NcAppSidebar.js'
import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton.js'
Expand All @@ -120,7 +120,7 @@ import SidebarTab from '../components/SidebarTab.vue'
import SystemTags from '../../../systemtags/src/components/SystemTags.vue'
import logger from '../logger.ts'

export default {
export default defineComponent({
name: 'Sidebar',

components: {
Expand Down Expand Up @@ -464,7 +464,10 @@ export default {
* Toggle the tags selector
*/
toggleTags() {
this.showTagsDefault = this.showTags = !this.showTags
// toggle
this.showTags = !this.showTags
// save the new state
this.setShowTagsDefault(this.showTags)
},

/**
Expand Down Expand Up @@ -585,7 +588,7 @@ export default {
this.hasLowHeight = document.documentElement.clientHeight < 1024
},
},
}
})
</script>
<style lang="scss" scoped>
.app-sidebar {
Expand Down
1 change: 0 additions & 1 deletion apps/systemtags/src/components/SystemTags.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -117,7 +117,6 @@ export default Vue.extend({
this.loadingTags = true
try {
this.selectedTags = await fetchTagsForFile(this.fileId)
this.$emit('has-tags', this.selectedTags.length > 0)
} catch (error) {
showError(t('systemtags', 'Failed to load selected tags'))
}
Expand Down
2 changes: 1 addition & 1 deletion webpack.modules.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@ module.exports = {
'settings-personal-availability': path.join(__dirname, 'apps/dav/src', 'settings-personal-availability.js'),
},
files: {
sidebar: path.join(__dirname, 'apps/files/src', 'sidebar.js'),
sidebar: path.join(__dirname, 'apps/files/src', 'sidebar.ts'),
main: path.join(__dirname, 'apps/files/src', 'main.ts'),
init: path.join(__dirname, 'apps/files/src', 'init.ts'),
search: path.join(__dirname, 'apps/files/src/plugins/search', 'folderSearch.ts'),
Expand Down
Loading