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

Jump to bottom

Lazy load text-viewer and text-files #4698

Merged
merged 3 commits into from
Nov 29, 2023
Merged

Lazy load text-viewer and text-files #4698

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
8da8c40
Lazy load text-viewer and text-files
artonge Aug 24, 2023
8409b5a
fix: Lazy load viewer component
juliushaertl Nov 28, 2023
b9009dc
fix: Merge webpack splitChunks options
juliushaertl Nov 28, 2023
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
16 changes: 11 additions & 5 deletions src/files.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,26 +21,28 @@
*/
import { linkTo } from '@nextcloud/router'
import { loadState } from '@nextcloud/initial-state'
import Vue from 'vue'
import { registerFileListHeaders } from '@nextcloud/files'

import { logger } from './helpers/logger.js'
import { registerFileActionFallback } from './helpers/files.js'
import FilesSettings from './views/FilesSettings.vue'
import store from './store/index.js'

__webpack_nonce__ = window.btoa(OC.requestToken) // eslint-disable-line
__webpack_public_path__ = linkTo('text', 'js/') // eslint-disable-line

const workspaceAvailable = loadState('text', 'workspace_available')
const workspaceEnabled = loadState('text', 'workspace_enabled')

document.addEventListener('DOMContentLoaded', () => {
document.addEventListener('DOMContentLoaded', async () => {
if (typeof OCA.Viewer === 'undefined') {
const { registerFileActionFallback } = await import('./helpers/files.js')
logger.error('Viewer app is not installed')
registerFileActionFallback()
}

if (workspaceAvailable && OCA && OCA?.Files?.Settings) {
const { default: Vue } = await import('vue')
const { default: FilesSettings } = await import('./views/FilesSettings.vue')
const { default: store } = await import('./store/index.js')

Vue.prototype.t = window.t
Vue.prototype.n = window.n
Vue.prototype.OCA = window.OCA
Expand All @@ -54,6 +56,10 @@ document.addEventListener('DOMContentLoaded', () => {
}))
}

if (workspaceAvailable) {
const { FilesWorkspaceHeader } = await import('./helpers/files.js')
registerFileListHeaders(FilesWorkspaceHeader)
}
})

OCA.Text = {
Expand Down
5 changes: 3 additions & 2 deletions src/helpers/files.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,6 @@ import { loadState } from '@nextcloud/initial-state'

import { getSharingToken } from './token.js'
import { openMimetypes } from './mime.js'
import RichWorkspace from '../views/RichWorkspace.vue'
import store from '../store/index.js'
import { getCurrentUser } from '@nextcloud/auth'
import { showSuccess, showError } from '@nextcloud/dialogs'
Expand Down Expand Up @@ -211,7 +210,7 @@ export const FilesWorkspaceHeader = new Header({
return view.id === 'files'
},

render(el, folder, view) {
async render(el, folder, view) {
if (vm) {
// Enforce destroying of the old rendering and rerender as the FilesListHeader calls render on every folder change
vm.$destroy()
Expand All @@ -223,6 +222,8 @@ export const FilesWorkspaceHeader = new Header({

newWorkspaceCreated = false

const { default: RichWorkspace } = await import('./../views/RichWorkspace.vue')

import('vue').then((module) => {
el.id = 'files-workspace-wrapper'

Expand Down
3 changes: 1 addition & 2 deletions src/viewer.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,6 @@
*
*/

import ViewerComponent from './components/ViewerComponent.vue'
import { logger } from './helpers/logger.js'
import { openMimetypesMarkdown, openMimetypesPlainText } from './helpers/mime.js'

Expand All @@ -33,7 +32,7 @@ if (typeof OCA.Viewer === 'undefined') {
OCA.Viewer.registerHandler({
id: 'text',
mimes: [...openMimetypesMarkdown, ...openMimetypesPlainText],
component: ViewerComponent,
component: () => import('./components/ViewerComponent.vue'),
group: null,
theme: 'default',
canCompare: true,
Expand Down
17 changes: 5 additions & 12 deletions webpack.config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -36,19 +36,12 @@ Object.assign(webpackConfig.output, {

webpackConfig.optimization.chunkIds = 'named'
webpackConfig.optimization.splitChunks.cacheGroups = {
defaultVendors: {
test(module) {
return module.resource && module.resource.includes(`${path.sep}node_modules${path.sep}`) &&
!module.resource.includes(`${path.sep}highlight.js${path.sep}`)
},
name: 'vendors',
}
mermaid: {
test: /[\\/]node_modules[\\/](mermaid)[\\/]/,
name: 'mermaid',
},
}

// webpackConfig.resolve.modules = [
// path.resolve(__dirname, 'node_modules'),
// 'node_modules'
// ]
webpackConfig.optimization.splitChunks.minSize = 102400

// Fix Buffer issues
webpackConfig.plugins.push(new webpack.ProvidePlugin({
Expand Down