#community-help

Issues with Typesense.Client in React Native

TLDR kurt is experiencing issues with Typesense.Client instantiation in React Native, despite correct imports and code. Jason couldn't identify immediate issues, but agreed to troubleshoot with a simplified reproduction app.

Powered by Struct AI

1

1

Aug 31, 2021 (29 months ago)
kurt
Photo of md5-70a65c96b293c1aafa37eaaefeaefa64
kurt
04:47 PM
Hi all! Has anyone gotten this to work with React Native? I’m building an app with Expo, using React Native code, and when I’m just trying to instantiate Typesense and assign a variable to the Typesense.Client, i get the error: "TypeError: Cannot read property 'Client' of undefined".

I just try to get the client like in Step #2 of the Firebase docs
Jason
Photo of md5-8813087cccc512313602b6d9f9ece19f
Jason
04:48 PM
It should technically work with React Native, but I haven’t tried it myself.

In this case, did you already import or require the Typesense library?
kurt
Photo of md5-70a65c96b293c1aafa37eaaefeaefa64
kurt
04:49 PM
Yes, definitely did that
Jason
Photo of md5-8813087cccc512313602b6d9f9ece19f
Jason
04:50 PM
Hmmm, could you share the full code snippet you’re using?
04:50
Jason
04:50 PM
Oh also, have you added it to package json, npm install, etc?
kurt
Photo of md5-70a65c96b293c1aafa37eaaefeaefa64
kurt
04:51 PM
Above my screen component, it basically looks like this for now, just to try to see some results:

import React, { useEffect, useLayoutEffect, useState } from 'react';
import { HeaderBackButton, StackScreenProps } from '@react-navigation/stack';
import Typesense from 'typesense';

type ScreenProps = StackScreenProps<AppStackParamList, 'Explore'>;



let searchClient = new Typesense.Client({
    nodes: [
        {
            host: '', 
            port: '443',
            protocol: 'https'
        }
    ],
    apiKey: 'my-api-key',
    connectionTimeoutSeconds: 2
});

export default function ExploreScreen({ navigation, route }: ScreenProps) {
...
}
04:53
kurt
04:53 PM
If you can’t see anything wrong with that, maybe i have to make a minimal reproducible app
04:55
kurt
04:55 PM
and yeah, typesense is installed with:
typesense": "^0.14.0,
Jason
Photo of md5-8813087cccc512313602b6d9f9ece19f
Jason
04:56 PM
Yeah I can’t see anything immediately wrong with it, but then I’m also not too familiar with React Native. If you can give me a minimal app to reproduce this in, I can take a closer look
kurt
Photo of md5-70a65c96b293c1aafa37eaaefeaefa64
kurt
05:00 PM
yeah, it doesn’t seem much like a React Native error though but something else more rudimentary to js, but i’m not really sure. I did install @babel/runtime too. Thanks for the quick replies in any case!
05:02
kurt
05:02 PM
On a side note, i was a little confused by the docs there, since, about the Firebase Extension (which I’m using) at the top of the doc, it states:
If you choose to use this extension, you can skip directly to Step 4 below, once you set up the extension.

and then at Step 4, the code shows to use client variable, but not showing how to get the client.

1

05:03
kurt
05:03 PM
so I’m assuming it’s the same as in Step 2.
Jason
Photo of md5-8813087cccc512313602b6d9f9ece19f
Jason
05:03 PM
Ah yes it is. Good catch, will fix that

1

Typesense

Lightning-fast, open source search engine for everyone | Knowledge Base powered by Struct.AI

Indexed 3015 threads (79% resolved)

Join Our Community

Similar Threads

Typescript Support and Import Issues with Typesense

Ahmad faced trouble with Typesense support for Typescript. Jason assisted by suggesting checks and solutions. Phil suggested modifying the import statement. Ultimately, the issue was resolved with a change from Jason in version `v1.1.2`.

24
25mo

Issues with Typesense Frontend Search Integration

Akash experienced issues integrating Typesense into their frontend search, particularly with their search box. Jason guided them to troubleshoot, eventually identifying the issue to be with react-instantsearch-dom and suggesting a downgrade to react 17, which resolved the issue.

2

52
14mo

Setup and Issues in Connecting Typesense Instance with Firebase Emulator

Michael.M seeks help on connecting a local Typesense instance to the Firebase local emulator. Jason suggests looking at emulator commands and creating a specific file. After various attempts and troubleshooting steps, Michael.M is able to establish the connection.

4

17
20mo

Resolving Issues with Firebase Extension and Typesense Configuration

Ernie sought clarification on how to handle the Firebase Extension and typesense collection configuration issues. Jason explained how to correctly specify the path and refresh the page to see updated data. After applying the advice given, Ernie successfully saw the changes.

2

12
15mo

Debugging Search Issue with Typesense Server Caching

Jameshwart reported experiencing caching issues with typesense server, despite the server's default setting of not caching. Through troubleshooting steps with Kishore Nallan, they were able to confirm an issue with the Typesense Javascript client and resolved it by adding `cacheSearchResultsForSeconds: 0` after `apiKey` in the initialisation. Laura also participated in discussion, learning about server and client level caching.

66
5mo