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

fix(ui): Add title for full content without clicking (issue #17600) #18243

Merged
merged 3 commits into from
May 20, 2024

Conversation

sunyeongchoi
Copy link
Member

@sunyeongchoi sunyeongchoi commented May 16, 2024

Fixes #17600

If the text is long, it will be cut off and can't see the entire text. So I added title.
When hovering the mouse, the user can see the entire text.

Checklist:

  • Either (a) I've created an enhancement proposal and discussed it with the community, (b) this is a bug fix, or (c) this does not need to be in the release notes.
  • The title of the PR states what changed and the related issues number (used for the release note).
  • The title of the PR conforms to the Toolchain Guide
  • I've included "Closes [ISSUE #]" or "Fixes [ISSUE #]" in the description to automatically close the associated issue.
  • I've updated both the CLI and UI to expose my feature, or I plan to submit a second PR with them.
  • Does this PR require documentation updates?
  • I've updated documentation as required by this PR.
  • I have signed off all my commits as required by DCO
  • I have written unit and/or e2e tests for my change. PRs without these are unlikely to be merged.
  • My build is green (troubleshooting builds).
  • My new feature complies with the feature status guidelines.
  • I have added a brief description of why this PR is necessary and/or what this PR solves.
  • Optional. My organization is added to USERS.md.
  • Optional. For bug fixes, I've indicated what older releases this fix should be cherry-picked into (this may or may not happen depending on risk/complexity).

Results

Before

image

After(Before review)

NAME field title
image

GROUP/KIND field title
image

SYNC ORDER field title
image

NAMESPACE field title
image

CREATED AT field title
image

After(After review)

NAME field title
image

GROUP/KIND field title
image

SYNC ORDER field title
image

NAMESPACE field title
image

CREATED AT field title
image

@sunyeongchoi sunyeongchoi requested a review from a team as a code owner May 16, 2024 07:49
@sunyeongchoi sunyeongchoi force-pushed the refactoring/ui-table branch 2 times, most recently from d6e8715 to 662e0a3 Compare May 16, 2024 08:13
@sunyeongchoi sunyeongchoi added the component:ui User interfaces bugs and enhancements label May 16, 2024
Signed-off-by: sunyeongchoi <suoung0716@gmail.com>
Signed-off-by: sunyeongchoi <suoung0716@gmail.com>
<div className='columns small-1 xxxlarge-1'>{[res.group, res.kind].filter(item => !!item).join('/')}</div>
<div className='columns small-1 xxxlarge-1'>{res.syncWave || '-'}</div>
<div className='columns small-2 xxxlarge-1'>{res.namespace}</div>
<div className='columns small-1 xxxlarge-1' title={[res.group, res.kind].filter(item => !!item).join('/')}>
Copy link
Contributor

Choose a reason for hiding this comment

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

let's move this filtering to local variable, to reuse code

Copy link
Member Author

Choose a reason for hiding this comment

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

Thanks for your review! I applied your review and defined a local variable to reuse.
df59d79

<div className='columns small-1 xxxlarge-1'>{[res.group, res.kind].filter(item => !!item).join('/')}</div>
<div className='columns small-1 xxxlarge-1'>{res.syncWave || '-'}</div>
<div className='columns small-2 xxxlarge-1'>{res.namespace}</div>
<div className='columns small-1 xxxlarge-1' title={[res.group, res.kind].filter(item => !!item).join('/')}>
Copy link
Contributor

Choose a reason for hiding this comment

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

Would you consider using the tooltip component from argo-ui, which is already available, instead of the native tooltip?

Copy link
Member Author

Choose a reason for hiding this comment

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

Thanks for your review! I applied it as a tooltip in argo-ui as you said, and it looked much prettier :)
df59d79

Signed-off-by: sunyeongchoi <suoung0716@gmail.com>
@pasha-codefresh pasha-codefresh merged commit 4d61974 into argoproj:master May 20, 2024
26 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
component:ui User interfaces bugs and enhancements
Projects
None yet
Development

Successfully merging this pull request may close these issues.

I cannot see whole name of resource in config map
4 participants