feat(ui): allows more convenient sorting of repository. #19829

bianbbc87 · 2024-09-07T14:19:01Z

Checklist:

Fixes: #18454

bunnyshell · 2024-09-07T14:19:06Z

❗ Preview Environment undeploy from Bunnyshell failed

See: Environment Details | Pipeline Logs

Available commands (reply to this comment):

🚀 /bns:deploy to redeploy the environment
❌ /bns:delete to try again to remove the environment

bunnyshell · 2024-09-07T14:19:07Z

❌ Preview Environment deleted from Bunnyshell

Available commands (reply to this comment):

🚀 /bns:deploy to deploy the environment

bianbbc87 · 2024-09-07T14:24:23Z

The ideal sort described in issue was sort, but it was not possible to sort uiwise because Repository objects do not have createdAt properties.
#18454

Instead, among the properties of the repository, it is possible to search by type, project, name, and status.

type: You can search by all, git, and helm.
project : When loading the repository, all projects in the repository array can be listed and searched with the dropdown property.
name : Search statements can be used to search. Remove spaces, ignore case letters
status: You can search using all, Successful, Failed and Unknown.

i deleted sort dropdown

Please let me know if you need anything else.

bianbbc87 · 2024-09-08T02:27:59Z

@david-wu-octopus

Hi. I referenced your code, but I couldn't sort it in date order by comparing x, y for certain conditions. (Since Repository objects don't have properties to display dates)

Instead, I made it possible to sort using other properties. Especially, I think it's convenient to automatically track and sort projects that you have. Can you please check my code?

bianbbc87 · 2024-09-14T02:15:42Z

@pasha-codefresh
Hi, can you check my code?

surajyadav1108 · 2024-09-17T10:03:12Z

@bianbbc87

I would suggest few changes:

Change the anchor element from the default argo button to a simpler anchor sort element as same for applications sort method as the button would be confusing
the code breaks for a repo that dosen't have a name property as it was optional for git repos so if user add a git repo through CLI or UI without setting the name property the UI breaks . I tried some changes which I will include and you write on top of it to improve

I have added some changes and it will look something like this :

changed the anchor element
added some scss for search field as on default it was same as background so "invisible"
added some change in name filter(you can improve on it)

changed.mp4

surajyadav1108

you can add this scss on top of file repo-list.scss for search-bottom

`@import 'node_modules/argo-ui/src/styles/theme';

.search-bar .argo-field{

@include themify($themes) {                  
    border-bottom: 2px solid themed('light-argo-teal-5');;
}

&:focus {
    outline: 0;
    border-color: $argo-color-teal-6;
}

} `

ui/src/app/settings/components/repos-list/repos-list.tsx

bianbbc87 · 2024-09-18T13:23:40Z

@bianbbc87

I would suggest few changes:

Change the anchor element from the default argo button to a simpler anchor sort element as same for applications sort method as the button would be confusing

the code breaks for a repo that dosen't have a name property as it was optional for git repos so if user add a git repo through CLI or UI without setting the name property the UI breaks . I tried some changes which I will include and you write on top of it to improve

I have added some changes and it will look something like this :

changed the anchor element

added some scss for search field as on default it was same as background so "invisible"

added some change in name filter(you can improve on it)

changed.mp4

That's very good feedback. Thank you!

bianbbc87 · 2024-09-19T00:41:04Z

I’m refactoring it now. 😶

bianbbc87 · 2024-09-19T01:57:47Z

@surajyadav1108
I have reflected the modifications, and I have also added some changes below:

reduce the width of the search bar to 50%
modify the selection to verify the selection by adding the property value to the right of the dropdown

The above two things further strengthened the user experience.
I would appreciate any feedback or suggestions you may have to further improve the implementation. 😃

surajyadav1108

ok great! @bianbbc87
looking back at it, I noticed that the project has a similar issue with undefined values, just like with the name

undefined.mp4

So I have some few changes as well modify those and then it looks good to me

corrected.mp4

ui/src/app/settings/components/repos-list/repos-list.tsx

bianbbc87 · 2024-09-21T04:30:11Z

@surajyadav1108
Thank you for the feedback! I'm learning a lot 😊

surajyadav1108 · 2024-09-21T08:04:50Z

@surajyadav1108 Thank you for the feedback! I'm learning a lot 😊

ahh seems ui lint check is failing, you can fix it if you have yarn installed globally if not npm install -g yarn

cd ui switch to ui
yarn install should be 1.22.21 or above
yarn run lint -- you can see the errors
yarn run lint --fix

bianbbc87 · 2024-09-21T08:39:39Z

@surajyadav1108

I've fixed the lint issue.
I think i need a PR label. could you add a PR label?

It's related to ui.

surajyadav1108 · 2024-09-21T10:07:23Z

@surajyadav1108

I've fixed the lint issue. I think i need a PR label. could you add a PR label?

It's related to ui.

No write access, you will have to wait till a member approves it. meanwhile you can fix the PR title

@ishitasequeira can you merge this if it looks good ❓

andrii-korotkov-verkada · 2024-11-09T07:19:48Z

@bianbbc87, I've asked for review in CNCF Slack. Can you rebase on the latest master and re-test, please?

Signed-off-by: EunJiJung <bianbbc87@gmail.com>

bianbbc87 · 2024-11-16T06:22:31Z

@andrii-korotkov-verkada

hi, i rebased original master and added the changes again.

ui/src/app/settings/components/repos-list/repos-list.tsx

agaudreault · 2025-05-08T23:26:55Z

@bianbbc87 @surajyadav1108 Great work on this! Do you think you can make the final change and let me know so we can merge this? :)

surajyadav1108 · 2025-05-13T05:45:15Z

@bianbbc87, could you please take a look when you have a moment 💭?

Signed-off-by: EunJiJung <bianbbc87@gmail.com>

bianbbc87 · 2025-05-13T09:22:36Z

@agaudreault @surajyadav1108
Hi, Thank you for the reminder.

I've merged the latest changes from upstream and resolved the merge conflict in repos-list.tsx by combining both changes.
Everything looks good on my end, so feel free to approve and merge if you're okay with it ! 👀

Co-authored-by: Suraj yadav <harrypotter1108@gmail.com> Signed-off-by: Eunji <129590633+bianbbc87@users.noreply.github.com>

Signed-off-by: EunJiJung <bianbbc87@gmail.com>

…order color Signed-off-by: EunJiJung <bianbbc87@gmail.com>

No updates

Signed-off-by: EunJiJung <bianbbc87@gmail.com> Signed-off-by: Eunji <129590633+bianbbc87@users.noreply.github.com> Co-authored-by: Suraj yadav <harrypotter1108@gmail.com>

Signed-off-by: EunJiJung <bianbbc87@gmail.com> Signed-off-by: Eunji <129590633+bianbbc87@users.noreply.github.com> Co-authored-by: Suraj yadav <harrypotter1108@gmail.com> Signed-off-by: dsuhinin <suhinin.dmitriy@gmail.com>

Signed-off-by: EunJiJung <bianbbc87@gmail.com> Signed-off-by: Eunji <129590633+bianbbc87@users.noreply.github.com> Co-authored-by: Suraj yadav <harrypotter1108@gmail.com> Signed-off-by: enneitex <etienne.divet@gmail.com>

bianbbc87 requested a review from a team as a code owner September 7, 2024 14:19

bianbbc87 changed the title ~~feat : allows more convenient sorting of repository.~~ feat(ui) : allows more convenient sorting of repository. Sep 8, 2024

surajyadav1108 reviewed Sep 17, 2024

View reviewed changes

bianbbc87 force-pushed the master branch from 39a5c9e to 46e1bbe Compare September 18, 2024 13:47

surajyadav1108 reviewed Sep 19, 2024

View reviewed changes

sunyeongchoi self-assigned this Oct 4, 2024

bianbbc87 changed the title ~~feat(ui) : allows more convenient sorting of repository.~~ feat(ui): allows more convenient sorting of repository. Oct 5, 2024

sunyeongchoi added the component:ui User interfaces bugs and enhancements label Oct 13, 2024

bianbbc87 added 3 commits November 9, 2024 22:21

fix : rebase upstream master

b6c1e25

Signed-off-by: EunJiJung <bianbbc87@gmail.com>

fix: eslint origin file

eb3adec

Signed-off-by: EunJiJung <bianbbc87@gmail.com>

feat : make repository page sortable

7ed750b

Signed-off-by: EunJiJung <bianbbc87@gmail.com>

andrii-korotkov-verkada approved these changes Nov 15, 2024

View reviewed changes

andrii-korotkov-verkada added the ready-for-review label Nov 15, 2024

bianbbc87 added 3 commits November 16, 2024 14:49

feat : Add type, project, status category sorting function

89fa7b1

Signed-off-by: EunJiJung <bianbbc87@gmail.com>

feat, css : add name search, change css

ab60a45

Signed-off-by: EunJiJung <bianbbc87@gmail.com>

refactor : delete sort dropdown and fix eslint

7158e11

Signed-off-by: EunJiJung <bianbbc87@gmail.com>

bianbbc87 force-pushed the master branch from e5f3fa3 to 06fcf10 Compare November 16, 2024 06:08

fix : fix eslint

4b05f12

Signed-off-by: EunJiJung <bianbbc87@gmail.com>

keithchong previously requested changes Nov 21, 2024

View reviewed changes

ui/src/app/settings/components/repos-list/repos-list.tsx Outdated Show resolved Hide resolved

keithchong reviewed Nov 21, 2024

View reviewed changes

ui/src/app/settings/components/repos-list/repos-list.tsx Show resolved Hide resolved

keithchong reviewed Nov 21, 2024

View reviewed changes

ui/src/app/settings/components/repos-list/repos-list.tsx Outdated Show resolved Hide resolved

surajyadav1108 mentioned this pull request Dec 4, 2024

REQUEST: New membership for @surajyadav1108 argoproj/argoproj#346

Closed

6 tasks

bianbbc87 added 2 commits May 13, 2025 17:48

fix : resolve merge conflict in repos-list.tsx by combining changes

3ad1360

Signed-off-by: EunJiJung <bianbbc87@gmail.com>

fix : emove duplicate function implementation

247025c

Signed-off-by: EunJiJung <bianbbc87@gmail.com>

Merge branch 'master' into master

b8d8ac8

bianbbc87 requested a review from keithchong May 13, 2025 12:21

agaudreault approved these changes May 14, 2025

View reviewed changes

bianbbc87 and others added 6 commits May 15, 2025 01:10

refactor : name check with safer trim-based condition

dbcdc5d

Co-authored-by: Suraj yadav <harrypotter1108@gmail.com> Signed-off-by: Eunji <129590633+bianbbc87@users.noreply.github.com>

refactor : extend search filter to include repository

b680145

Signed-off-by: EunJiJung <bianbbc87@gmail.com>

delete : delete sort property in repo-list.tsx

a290cf2

Signed-off-by: EunJiJung <bianbbc87@gmail.com>

fix : fix eslint in repos-list.tsx

95a21a4

Signed-off-by: EunJiJung <bianbbc87@gmail.com>

design : improve input field visibility in light mode by overriding b…

5463ba4

…order color Signed-off-by: EunJiJung <bianbbc87@gmail.com>

Merge branch 'master' into master

437dd36

surajyadav1108 self-requested a review May 24, 2025 07:42

surajyadav1108 approved these changes May 24, 2025

View reviewed changes

agaudreault merged commit 0e95193 into argoproj:master Jun 3, 2025
23 checks passed

github-project-automation bot moved this from Changes Requested to Done in Argo CD Review Jun 3, 2025

feat(ui): allows more convenient sorting of repository. #19829

feat(ui): allows more convenient sorting of repository. #19829

Uh oh!

Conversation

bianbbc87 commented Sep 7, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

bunnyshell bot commented Sep 7, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

❗ Preview Environment undeploy from Bunnyshell failed

Uh oh!

bunnyshell bot commented Sep 7, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

❌ Preview Environment deleted from Bunnyshell

Uh oh!

bianbbc87 commented Sep 7, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

bianbbc87 commented Sep 8, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

bianbbc87 commented Sep 14, 2024

Uh oh!

surajyadav1108 commented Sep 17, 2024

Uh oh!

surajyadav1108 left a comment • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

bianbbc87 commented Sep 18, 2024

Uh oh!

bianbbc87 commented Sep 19, 2024

Uh oh!

bianbbc87 commented Sep 19, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

surajyadav1108 left a comment • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

bianbbc87 commented Sep 21, 2024

Uh oh!

surajyadav1108 commented Sep 21, 2024

Uh oh!

bianbbc87 commented Sep 21, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

surajyadav1108 commented Sep 21, 2024

Uh oh!

andrii-korotkov-verkada commented Nov 9, 2024

Uh oh!

bianbbc87 commented Nov 16, 2024

Uh oh!

Uh oh!

Uh oh!

Uh oh!

agaudreault commented May 8, 2025

Uh oh!

surajyadav1108 commented May 13, 2025

Uh oh!

bianbbc87 commented May 13, 2025

Uh oh!

Uh oh!

Uh oh!

bianbbc87 commented Sep 7, 2024 •

edited

Loading

bunnyshell bot commented Sep 7, 2024 •

edited

Loading

bunnyshell bot commented Sep 7, 2024 •

edited

Loading

bianbbc87 commented Sep 7, 2024 •

edited

Loading

bianbbc87 commented Sep 8, 2024 •

edited

Loading

surajyadav1108 left a comment •

edited

Loading

bianbbc87 commented Sep 19, 2024 •

edited

Loading

surajyadav1108 left a comment •

edited

Loading

bianbbc87 commented Sep 21, 2024 •

edited

Loading