Quick Implementation
Search Component for React is a set of prebuilt UI components that allows you to easily craft an in-app chat with all the essential search features. You can implement Search Component by using the following step. This component support both search functions and search results.
It provides a feature that allows users to search for stickers with search tags. The search tags can be in any form, including emotion, situation, character, and more. The search results automatically adjust to your app category/subcategory and user locale information (language and country). This is so that your users get the perfect sticker results they need.
Before you begin
Make sure you went through all processes in Before You Begin to sign up for stipop dashborad and get API Key, which is reuiqred to complete development of the SDK.
Using Search Component
apikey : Stipop API key for your app.
userId : Unique value for every user to distinguish unique users. The userId can be a string of any format.
React
1
2
3
4
5
6
7
8
9
10
11
12
13
14
import { SearchComponent } from 'stipop-react-sdk'
const App = () => {
return (
<SearchComponent
params={{
apikey: 'apikey',
userId: 'userId',
}}
/>
)
}
export default AppNext.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
import dynamic from 'next/dynamic'
const SearchComponent = dynamic(
() => import('stipop-react-sdk/dist/SearchComponent'),
{
ssr: false,
})
const App = () => {
return (
<SearchComponent
params={{
apikey: 'apikey',
userId: 'userId',
}}
/>
)
}
export default App