Closed rushilshah1 closed 4 years ago
Hi @rushilshah1, what's the purpose of managing the search text via prop instead of letting the user set it through the input field? Do you need to set a default query on component initialization?
@sergiop - It is more for accessing the user query outside of the react-giphy-searchbox component. Similar to the onSelect
callback which returns a Gif object, if that or some other prop could return the search query it can be used/displayed outside of the react-giphy-searchbox component.
@rushilshah1 ah... ok! I've completely misunderstood your request, sorry. 🙂
Nice idea, we can call it onSearch
and it will receive the searched text as a parameter, like this.
onSearch={
text => console.log('Searched text', text)
}
What do you think?
@sergiop sounds good to me! Thank you 😄
@rushilshah1 I just added the feature in this PR, it was pretty simple. Please feel free to give it a try leaving your feedback. In the meantime maybe I can write some tests to run inside the CI.
@sergiop Appreciate the quick turnaround! What would be the easiest way for me to try it out since it is not a new package version on npm just yet?
To test:
Way 1:
you can fork or simply clone this repo, check out the feature/on-search-callback
branch, run yarn install
and yarn start
. Once the project is running, you can open the demo page on http://localhost:3000/, adding the new callback on demo/src/index.js
.
Way 2 (maybe simpler):
if you have already installed this library on a project, change your package.json
from this:
"dependencies": {
"react-giphy-searchbox": "^1.3.0"
}
to this:
"dependencies": {
"react-giphy-searchbox": "git+ssh://git@github.com:sergiop/react-giphy-searchbox.git#62ad4e4"
}
(where #62ad4e4
is the hash related to the changes I just made) and run yarn install
or npm install
.
Otherwise, if you can wait a couple of days, I'll release the feature! 😉
@rushilshah1 just released with version 1.4.0. 😉
wohoo! Thanks @sergiop!
Add prop that allows for the user search entry to be retrieved. Example
searchText
prop that would bind a variable to the search text input or can be retrieved via a callback function likeonChange
. I would love to use this tool but this seems to be the only missing feature that I would need!