gbv / jskos-vue

A suite of components and plugins for Vue 3 related to JSKOS.
https://gbv.github.io/jskos-vue/
MIT License
0 stars 1 forks source link

Redesign ItemDetails #3

Closed nichtich closed 3 years ago

nichtich commented 3 years ago

This is an issue for discussion. The current ItemDetails component has same drawbacks. In particular the layout arose from current Cocoda layout and has some drawbacks (or unavoidable compromises):

There will likely be more and/or other tabs in the future, e.g. to show coordinate at a map. Tabs can already be configured with slot tabs. We may also put hierarchy (ancestors & browader, narrower) into a tab instead of always showing it. We may make it configurable which tabs to always show on bottom, at top, or as tab. If there is vertical space, we could also show some content left (e.g. hierarchy) and some right (e.g. tabs)... We could also split ItemDetails into sub-components (e.g. LicenseInfo can be a component of its own) so it can easier be rearranged.

I started by moving the item label to the top of the component, but this still can be discussed.

stefandesu commented 3 years ago

Vue 3's Teleport might be helpful for this.

In any case, the requirements should be clearly defined before we start redesigning ItemDetails. There were a lot of different ideas in your post which need to be organized and properly elaborated.

nichtich commented 3 years ago

We decided to not create a complex component with many configuration but chose one opinionated layout. Still some suggestions:

stefandesu commented 3 years ago

Can we get rid of beforeName? It is used in Cocoda to show the "clear concept" button. This layout is ugly anyway. How about button all buttons to the right, so we only need one slot?

I just noticed that in Cocoda, the "favorite star" is sometimes before and sometimes after the name. I actually like how it looks before the name, so I would vouch to keep the beforeName slot and (in Cocoda) put the favorite star there instead of after the name.

Rename slot tabs to additionalTabs (otherwise I'd expect it to override all tabs)

Fair enough.

Move display of license into a component of its own (LicenseInfo?)

Sure. I guess sometimes it's necessary to show the license separately, like after ItemName or something, so it makes sense. We could also allow to add more license badges via that component (in addition to the built-in ones).

Move tabs into a component ItemDetailTabs so they can better be reused for side-by-side layout of hierarchy and concept details

I'm fine with that.

Think again why the component is named ItemDetails instead of ConceptDetails (I think there was a reason?)

Because we want to use it not only for concepts, but also for concept schemes. It would make sense to add an example for that.

stefandesu commented 3 years ago

I made several changes and I'm going to close this issue now to release 0.2.0. For any further adjustments, please create separate issues.