[BUG] algolia search icon not visible on website navbar

[anshgoyalevil]

Describe the bug.

There used to be an Algolia Search Icon besides the Language Picker element on Navbar. It is no longer visible, though we can click it as it is present over there but is very small in size.

Expected behavior

In wireframe:

Screenshots

In wireframe:

(That circle besides the Language Picker is where the search icon used to be)

How to Reproduce

• Visit AsyncAPI.com

🥦 Browser

Google Chrome

👀 Have you checked for similar open issues?

• I checked and didn't find similar issue

🏢 Have you read the Contributing Guidelines?

• I have read the Contributing Guidelines

Are you willing to work on this issue ?

No, someone else can work on it

[amanbhoria]

Hi @anshgoyalevil , I've looked into this issue and seems like IconLoupe component i.e Search icon is not rendered correctly as a children prop in AlgoliaSearch file.

• initially children i.e. IconLoupe is not treated as a function but a React Node and that's obvious. But later it's treated as a function. I'm attaching a screenshot for the reference.

As soon as i do setChildren(children) the search bar appears on the homepage. If we've to fix this issue, we can do it that way.
But yes, we can't do this as we can't use the actionKey then.

These are my findings, thank you!

[maverickf0]

@amanbhoria can't we just do this instead

it solves the issue

[amanbhoria]

@maverickf0 this seems to be working fine but I'm wondering how this issue occurred on the first place. I mean how this got merged in the master branch.

[sambhavgupta0705]

PRs for this issue
#3400

#3447