fix: adjust breadcrumbs component

[raimund-schluessler]

☑️ Resolves

• This PR fixes an issue with the breadcrumbs component where the getWidth function errors because it uses .elm on a vnode which might not be defined. The PR is basically a backport of the changes I did for the NcBreadcrumbs component in the vue3 branch. The PR still needs some cleanup and fine-tuning, but it seems to fix the error.

@susnux The hidden breadcumbs in the action menu currently don't work as they should. The breadcrumbs component might need to be adjusted, but I still need to figure out what's the problem.

[raimund-schluessler]

@susnux The hidden breadcumbs in the action menu currently don't work as they should. The breadcrumbs component might need to be adjusted, but I still need to figure out what's the problem.

This is partially fixed by second commit in the PR now. The hidden crumbs now correctly execute the bound listeners and navigating directories in the filepicker now also works for hidden crumbs. However, clicking a hidden crumb also navigates in the browser and the URL changes, which should not be the case. Maybe this can be skipped with a preventDefault on the listener, but I think adjusting NcBreadcrumbs to not navigate at all in such cases would be cleaner.

[raimund-schluessler]

However, clicking a hidden crumb also navigates in the browser and the URL changes, which should not be the case. Maybe this can be skipped with a preventDefault on the listener, but I think adjusting NcBreadcrumbs to not navigate at all in such cases would be cleaner.

@susnux I think the issue is that the hidden crumbs always render to an ActionLink or ActionRouter which makes the browser navigate. How about we allow also ActionButton in case the crumb has neither a to nor href set? I think we never really considered using NcBreadcrumbs in a non navigating context, like it's done in the Filepicker now.

[raimund-schluessler]

@susnux I think the issue is that the hidden crumbs always render to an ActionLink or ActionRouter which makes the browser navigate. How about we allow also ActionButton in case the crumb has neither a to nor href set? I think we never really considered using NcBreadcrumbs in a non navigating context, like it's done in the Filepicker now.

I implemented it like this now. Let me know whether this fixes all issues you saw with the NcBreadcrumbs component in the filepicker. For me, everything works now. Crumbs get dynamically hidden on resize and navigating with hidden crumbs works fine now. If the fix works for you as well, I will cleanup a bit so we can merge it after review.

[raimund-schluessler]

@susnux @skjnldsv I know you sure are busy with 27.1, but it would be great if you could have a look at this PR here, and check whether it fixes the issues with the breadcrumb bar in the new vue filepicker component. I think this should also be included for 27.1. because it otherwise could be seen as a regression.

[skjnldsv]

I know you sure are busy with 27.1, but it would be great if you could have a look at this PR here, and check whether it fixes the issues with the breadcrumb bar in the new vue filepicker component. I think this should also be included for 27.1. because it otherwise could be seen as a regression.

Looks good to me! :)
Added one comment fixing a height issue

[raimund-schluessler]

Looks good to me! :) Added one comment fixing a height issue

Thanks for having a look. Could you check whether it fixes the issue with the crumbs in the filepicker for you? Anyway, I will cleanup the PR a bit and once @susnux had a look, we can merge it.

[skjnldsv]

Thanks for having a look. Could you check whether it fixes the issue with the crumbs in the filepicker for you? Anyway, I will cleanup the PR a bit and once @susnux had a look, we can merge it.

Seems to work for me. No more error messages :)

[raimund-schluessler]

I cleaned up a bit. After a rebase and a squash this should be good to go.

[susnux]

Works perfectly now! Thank you 🎉

Just squash and then ready to go :)