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.

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

Update group cards further #928

Open
wants to merge 2 commits into
base: master
Choose a base branch
from
Open

Update group cards further #928

wants to merge 2 commits into from

Conversation

genehack
Copy link
Contributor

Description of proposed changes

  • Links group name to group page; updates tooltip on group name

Related issue(s)

#870

Checklist

This causes the group name to be rendered as a link to the group page.

This still uses the default tooltip, which is (IMO) wrong for the
links on the `/groups` page.
* If not provided, defaults to the former hard-coded tooltip value
* Includes changes to all `tooltipText` to be provided at to the
  `ListResources` component, as that's the level that knows what the
  tooltip for all the card should be

As noted in the `FIXME` comment: I'm not wild about the text I came up
with for the groups page and would welcome a better phrasing.
@genehack
Copy link
Contributor Author

genehack commented Jun 21, 2024

Pushing this for preliminary feedback on this first bit; more to come.

Preview

@nextstrain-bot nextstrain-bot temporarily deployed to nextstrain-s-update-gro-qworkw June 21, 2024 01:12 Inactive
@genehack genehack requested a review from a team June 21, 2024 01:21
@@ -115,6 +115,7 @@ class GroupsPage extends React.Component {

<ListResources
resourceType="dataset"
defaultGroupLinks={true}
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

[crystal ball gazing -- not a request for changes]

Implicit in the original design is that card titles will become links by simply adding the card name to the current URL. It works well for the groups page (e.g. groups + blab), but I don't think it'll work for an individual groups page.¹ We'll probably just disable the links for those pages.

Also, for what it's worth, the ={true} can be dropped, if you prefer.

¹ Depends on how card titles are chosen of course, but the blab group will probably have a "229e" card and /groups/blab/229e is 404.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Depends on how card titles are chosen of course, but the blab group will probably have a "229e" card and /groups/blab/229e is 404.

I would think on the individual groups page, the titles would not include groups/<group_name>. The resourceListingCallback would just return pathPrefix: "groups/<group_name>"? (Maybe I'm completely off here, still catching up on all the ListResources work)

@@ -15,9 +15,11 @@ interface ResourceGroupHeaderProps {
isCollapsed: boolean
resourcesToShowWhenCollapsed: number
quickLinks: QuickLink[]
tooltipText: string
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

There are quite a few tooltips within the resources UI, so I'd consider a prop name such as defaultGroupLinksTooltip.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is not the entire text and gets added to later. I would call it something like groupTooltipPrefix.

resourceListingCallback={resourceListingCallback}/>
resourceListingCallback={resourceListingCallback}
// FIXME I do not love this text string; suggestions welcome
tooltipText="Click to load the group page"
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

[suggestion]

"Click to view this group in isolation, including additional information specific to that group"

Won't look nice if you then tack on for ${group.groupDisplayName || group.groupName} but we could change the prop to be a function accepting the group name.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The Nextstrain docs for Groups call it a "splash page", so we can follow that pattern here:

"Click to view the individual group splash page"

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Or something less wordy:

Go to splash page for blab

Visit splash page for blab

@genehack genehack marked this pull request as ready for review July 8, 2024 22:55
@genehack genehack requested a review from a team July 8, 2024 22:55
@joverlee521 joverlee521 temporarily deployed to nextstrain-s-update-gro-xmgarp July 9, 2024 16:04 Inactive
@@ -15,9 +15,11 @@ interface ResourceGroupHeaderProps {
isCollapsed: boolean
resourcesToShowWhenCollapsed: number
quickLinks: QuickLink[]
tooltipText: string
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is not the entire text and gets added to later. I would call it something like groupTooltipPrefix.

Comment on lines +22 to 23
if (!tooltipText) tooltipText="Click to load the default (and most recent) analysis";
const setModalResource = useContext(SetModalResourceContext);
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggestion: don't set a default here. Make sure every usage of ListResources defines the right text based on the context.

resourceListingCallback={resourceListingCallback}/>
resourceListingCallback={resourceListingCallback}
// FIXME I do not love this text string; suggestions welcome
tooltipText="Click to load the group page"
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Or something less wordy:

Go to splash page for blab

Visit splash page for blab

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants