DataViews: set primary field styles #57846
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
oandregal
added
[Type] Experimental
|
Size Change: +36 B (0%) Total Size: 1.69 MB
ℹ️ View Unchanged
|
oandregal
commented
Jan 15, 2024
| @@ -15,7 +15,9 @@ import { | |||
| } from '../../utils/constants'; | |||
|
|
|||
| export const DEFAULT_CONFIG_PER_VIEW_TYPE = { | |||
| [ LAYOUT_TABLE ]: {}, | |||
| [ LAYOUT_TABLE ]: { | |||
| primaryField: 'title', | |||
There was a problem hiding this comment.
The table layout wasn't defining what's the primary field. This is necessary for the primary field class to be serialized into the HTML.
oandregal
commented
Jan 15, 2024
| } | ||
|
|
||
| return ( | ||
| <VStack spacing={ 1 }> |
There was a problem hiding this comment.
Removes extra divs (VStack/View) that were no longer necessary.
oandregal
commented
Jan 15, 2024
| @@ -224,32 +220,22 @@ export default function PagePages() { | |||
| id: 'title', | |||
| getValue: ( { item } ) => item.title?.rendered, | |||
| render: ( { item } ) => { | |||
| return ( | |||
| <VStack spacing={ 1 }> | |||
There was a problem hiding this comment.
Removes extra divs (VStack/View) that were no longer necessary.
oandregal
commented
Jan 15, 2024
| @@ -210,7 +208,6 @@ function Title( { item, categoryId } ) { | |||
| // Required for the grid's roving tab index system. | |||
| // See https://github.com/WordPress/gutenberg/pull/51898#discussion_r1243399243. | |||
| tabIndex="-1" | |||
| className="dataviews-view-grid__title-field" | |||
There was a problem hiding this comment.
We should not use internal dataviews classes in the consumer code.
It's actually the patterns that are not synced (see left title): 
|
|
Nice work so far, noting a couple of small outstanding issues I'm seeing: In List layout, when hovering an item the title should be blue (matching the other fields), currently it remains dark gray: Truncation doesn't seem to be working in Pages table layout: Truncation seems to be working in Templates table layout, but the ellipsis is missing: Same in Patterns Grid layout: 
|
jameskoster
reviewed
Jan 15, 2024
oandregal
force-pushed
the
update/primary-field-styles
branch
from
0a583fb
to
ed93d63
Compare
…t-overflow" This reverts commit 6b3b92c.
jameskoster
approved these changes
Jan 16, 2024
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Part of #55083
What?
Makes the styles for the primary field (title) equal for all views.
Why?
We want to make it coherent, style wise:
How?
dataviews-view-grid__title-fieldclass in consumer code (Pages, Templates, Patterns pages) to style the title. Consumers should not use dataviews defined classes.Testing Instructions
titlefor all of them).TODO