Elgato_dark/argo-cd
1
0
Fork 0
mirror of https://github.com/argoproj/argo-cd synced 2026-05-23 09:18:26 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 6

feat: Click on search icon must focus on search area (#4801)

Browse source 
Fixes: #4791

Signed-off-by: Chetan Banavikalmutt <chetanrns1997@gmail.com>
This commit is contained in:
Chetan Banavikalmutt 2020-11-23 23:16:58 +05:30 committed by GitHub
parent 79509003fa
commit ae12145f2d
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 14 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
ui/src/app/applications/components/applications-list/applications-list.scss
View file

@ -188,6 +188,10 @@
position: absolute;
bottom: 0.6em;
left: -1.5em;
cursor: pointer;
&:hover {
color: $argo-color-gray-6;
}
}
i.fa-times {
cursor: pointer;

12
ui/src/app/applications/components/applications-list/applications-list.tsx
View file

@ -163,6 +163,7 @@ export const ApplicationsList = (props: RouteComponentProps<{}>) => {
const [createApi, setCreateApi] = React.useState(null);
const clusters = React.useMemo(() => services.clusters.list(), []);
const [isAppCreatePending, setAppCreatePending] = React.useState(false);
const searchBar = React.useRef<HTMLDivElement>(null);
const loaderRef = React.useRef<DataLoader>();
function refreshApp(appName: string) {
@ -273,8 +274,15 @@ export const ApplicationsList = (props: RouteComponentProps<{}>) => {
<div className='columns small-12 xxlarge-2'>
<Query>
{q => (
<div className='applications-list__search'>
<i className='fa fa-search' />
<div className='applications-list__search' ref={searchBar}>
<i
className='fa fa-search'
onClick={() => {
if (searchBar.current) {
searchBar.current.querySelector('input').focus();
}
}}
/>
{q.get('search') && (
<i className='fa fa-times' onClick={() => ctx.navigation.goto('.', {search: null}, {replace: true})} />
)}