Trigger search on pressing enter key in input box in e-commerce showcase

[Roshanjossey]

You can find the showcase in https://showcase.jina.ai/e-commerce/

You can find the relevant code in https://github.com/jina-ai/jina-ui/blob/master/packages/showcases/src/pages/e-commerce.tsx#L313

[CatStark]

The problem is that after I upload an image, I can't modify the query using text too (so it would be image + text).

We need to trigger this text search.

[umairkarel]

onChange={(event) => { if(event.key === 'Enter') setAddDesc(event.target.value) }}

is this what we should add here?

[Roshanjossey]

@umairkarel, no.

onChange handler is correct

I was thinking about a onKeyUp handler that has the same check you posted. Also, it should trigger search function.

[umairkarel]

onKeyUp ={(event) => { 
      if(event.key === 'Enter') 
         setAddDesc(event.target.value); 
      search(addDesc) 
}}

Now is it correct?

[Roshanjossey]

I want you to answer that yourself.

In this case, when will search get called?

[umairkarel]

Sorry, I got it.

onKeyUp ={(event) => { 
    if(event.key === 'Enter') {
       setAddDesc(event.target.value); 
       search(addDesc)
    }
}}

[Roshanjossey]

You don't have to say sorry. I just wanted to make sure that you understand what you're doing.

Remove the setAddDesc. it's already handled in onChange Also change params of search function to search(addDesc, ...originalDocuments)

[github-actions[bot]]

:tada: This issue has been resolved in version 0.5.0 :tada:

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot :package::rocket: