Bump @nextcloud/vue to 6.0.0-beta.1 and vue-template-compiler

[PVince81]

• resolve compilation issues (see below)
• 🚫 missing icons
• smoke test

I was advised by @juliushaertl to update vue-template-compiler to 2.7 which I did here

[juliusknorr]

Either changing each import to add .js for the vue components or nextcloud-libraries/eslint-config#383 should fix the listing issue, but there seems to be another version incompatibility:

npm ERR! While resolving: @nextcloud/[email protected]
npm ERR! Found: @nextcloud/[email protected]
npm ERR! node_modules/@nextcloud/vue
npm ERR!   @nextcloud/vue@"^6.0.0-beta.1" from the root project
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer @nextcloud/vue@"^4.2||^5.0" from @nextcloud/[email protected]
npm ERR! node_modules/@nextcloud/calendar-availability-vue
npm ERR!   @nextcloud/calendar-availability-vue@"^0.3.1" from the root project
npm ERR! 
npm ERR! Conflicting peer dependency: @nextcloud/[email protected]
npm ERR! node_modules/@nextcloud/vue
npm ERR!   peer @nextcloud/vue@"^4.2||^5.0" from @nextcloud/[email protected]
npm ERR!   node_modules/@nextcloud/calendar-availability-vue
npm ERR!     @nextcloud/calendar-availability-vue@"^0.3.1" from the root project

[PVince81]

I've renamed ButtonVue to Button and the local compilation is fixed.

Now the next problem, missing icon:

I'll recheck/recompile just to be sure

[PVince81]

with node v14 there was no error about @nextcloud/calendar-availability-vue@"^0.3.1

after upgrading to node v16 that error appears for me as well

[PVince81]

• update the failing lib: Update @nextcloud/vue to 6.0.0-beta.1 calendar-availability-vue#22

[juliusknorr]

Icons can be fixed by running npm run build and npm run sass before npm run sass:icons. Doesn't work out of the box on this branch as the dist/ folder is not present.

[PVince81]

seems I deleted the dist folder by mistake, I'll bring it back

[PVince81]

I did "npm ci --force" to bypass the dep issue for now and brought back the dist folder, and run npm run sass && npm run sass:icons, force refreshed the browser. Icon still missing.

[PVince81]

I remember that usually the files app icons would disappear when we forget "sass:icons", but they're here:

so perhaps it's not the icon compilation and maybe a CSS problem or other problem with the Actions component ?

also see that the favorite icon now has a border, so either a bug or needs adjustments here

[PVince81]

as far as I can see the working buttons have the CSS classes button-vue button-vue--icon-only button-vue--vue-tertiary action-item__menutoggle the the one with missing icon only has button-vue sharing-entry__actions button-vue--vue-tertiary action-item action-item--single new-share-link v-popper--has-tooltip, no mention of icon

I'll see if we're missing a vue attribute

[PVince81]

this is the button in question: https://github.com/nextcloud/server/blob/update-nextcloud-vue-6.0.0-beta.1/apps/files_sharing/src/components/SharingEntryLink.vue#L299

based on the conditions it would be a single action button which is then supposed to render inline
as far as I can see inline rendering is NOT broken: https://nextcloud-vue-components.netlify.app/#/Components/Actions?id=actions-1 or at least not when using Vue icons

[PVince81]

the missing icon on ActionButton is a regression, raised here: nextcloud-libraries/nextcloud-vue#3006

[PVince81]

cool, at least it compiles now

waiting for the action button regression fixes to attempt another update

[PVince81]

next iteration: #33516