Add dags search widget to navbar for quick search

[tirkarthi]

Closes #33210

There are workflows where users need to quickly switch between dags. Returning to home page to search takes time and also loads dags list data and makes other queries which are not needed. Add a search widget in the top navbar so that users can search and results are returned like legacy home page search. Then users can click on the result to switch to the relevant dag page. The component uses AsyncSelect to fetch options on type and uses debounce to limit queries. The results are limited to 10 so that the queries are faster and uses existing dags endpoint used by home page search without recent runs data.

Notes to reviewer and self

• debounce-promise is needed since use-debounce doesn't work with promises . Ref : Async Debounce for Select 2.0 not behaving as expected JedWatson/react-select#3075 (comment)
• staleTime is set as zero so that queries are not cached and results are live to search for dags added recently after a search for the term.
• There are autocomplete components for Chakra but they are not compatible with Chakra 3 . Ref : Support for chakra v3 anubra266/choc-autocomplete#272
• There could be a custom endpoint with just dag_id and dag_display_name but with 10 entries the size is low at 2kB compressed and 8-9kB uncompressed and doesn't seem to be worth it to have a separate endpoint. Probably if needed can be taken as an enhancement in another PR.

[shubhamraj-git]

Overall looks good.

[tirkarthi]

@shubhamraj-git The search is substring search like the legacy view. Legacy view has limit of 10 entries and I am fine with increasing the limit here. Thanks.

airflow/airflow/www/views.py

Line 5522 in b13ed89

for row in session.execute(dag_ids_query.union(owners_query).order_by("name").limit(10))

[shubhamraj-git]

@shubhamraj-git The search is substring search like the legacy view. Legacy view has limit of 10 entries and I am fine with increasing the limit here. Thanks.

airflow/airflow/www/views.py

Line 5522 in b13ed89

for row in session.execute(dag_ids_query.union(owners_query).order_by("name").limit(10))

Actually yes, I saw in the legacy. Hence removed the comment, since i got my answer. Yes, maybe increasing to 10 will be good.

[tirkarthi]

Thanks, increased it to 10 and also increased width to view longer names.