init() to gurantee Flagsmith won't be reinitialized more than once?

[sammysium]

already asked on SO but didn't get a reply. so sorry for spamming it here. Basically, we want to create a wrapper for FS since our need differs:

import flagsmith from 'react-native-flagsmith';

flagsmith.init({
environmentID: Config.FLAGSMITH_ENVIRONMENT_ID,
api: Config.FLAGSMITH_API_URL,
asyncStorage: AsyncStorage,
cacheFlags: true,
onError: handleFlagsError,
onChange: (oldFlags, params) => {},
defaultFlags: TabletConfigurations
});

function getValue(key){
const value = flagsmith.getValue(key);
//logic that works based on value and key goes here
return someresultnow;
}


const FS = {getValue};

export default FS;

all is good so far but I was wondering why I can't wrap the initalization in a function because I want to manually. Sure, I can do the init() in the component but I want to keep all flagsmith related tasks in the file. So, I tried the following but it returns two errors randomly:

async function initFS(){
try{
   await flagsmith.init({...});
  //began listening
}catch(e){
console.log(e)
}
}

// from entry of the app:

await iniitFS()

one of the errors is 'u.getItem' (u is undefined) and another one flags is undefined. Why does it not initialize when I wrapped it in a function but does get initalized outside of the function?

[dabeeeenster]

Hi @sammysium - @kyle-ssg will be along soon to answer this! In the meantime - I don't see your Q on Stack Overflow? Did you remove it?

[kyle-ssg]

Hey @sammysium it's a bit difficult to piece together a full example from the above. Are you able to make a quick gist or repo separating into files as to what you've tried?

I can't see a good reason for wrapping the init function to cause an issue, I suspect something else is going on to cause that issue.

Actually are you sure AsyncStorage is defined and has a function getItem? It seems like the error is around that.

[kyle-ssg]

Ah, I think you need to pass AsyncStorage into init, not asyncStorage.

flagsmith.init({
...
**asyncStorage: AsyncStorage,** // should be AsyncStorage
cacheFlags: true,

[sammysium]

@kyle-ssg actually I thought AsyncStorage is the issue as well (removed it even just to see a change).

import AsyncStorage from '@react-native-community/async-storage';

so yeah I am using that one as well. Hold on, I will create a small repo.

[sammysium]

like i said, outside the function it works just great.

[sammysium]

@kyle-ssg sorry for delay. Here is the repo: https://github.com/iconicsammy/flagsmithissue

strangely enough, i cant get it to work with or without a wrapper this time in this mini-repo but the error message is the same. in my real app, I get the error only if I wrap it into a function. here is screenshot of the erro as well

[sammysium]

Possible Unhandled Promise Rejection (id: 0):
TypeError: undefined is not an object (evaluating 'u.getItem')
http://10.0.2.2:8081/index.bundle?platform=android&dev=true&minify=false&app=com.flagsmithissue&modulesOnly=false&runModule=true:107352:16
tryCallTwo@http://10.0.2.2:8081/index.bundle?platform=android&dev=true&minify=false&app=com.flagsmithissue&modulesOnly=false&runModule=true:28586:9
doResolve@http://10.0.2.2:8081/index.bundle?platform=android&dev=true&minify=false&app=com.flagsmithissue&modulesOnly=false&runModule=true:28750:25
Promise@http://10.0.2.2:8081/index.bundle?platform=android&dev=true&minify=false&app=com.flagsmithissue&modulesOnly=false&runModule=true:28609:14
value@http://10.0.2.2:8081/index.bundle?platform=android&dev=true&minify=false&app=com.flagsmithissue&modulesOnly=false&runModule=true:107350:31

loadModuleImplementation@http://10.0.2.2:8081/index.bundle?platform=android&dev=true&minify=false&app=com.flagsmithissue&modulesOnly=false&runModule=true:290:14
guardedLoadModule@http://10.0.2.2:8081/index.bundle?platform=android&dev=true&minify=false&app=com.flagsmithissue&modulesOnly=false&runModule=true:163:47
runUpdatedModule@http://10.0.2.2:8081/index.bundle?platform=android&dev=true&minify=false&app=com.flagsmithissue&modulesOnly=false&runModule=true:578:19
metroHotUpdateModule@http://10.0.2.2:8081/index.bundle?platform=android&dev=true&minify=false&app=com.flagsmithissue&modulesOnly=false&runModule=true:452:40
define@http://10.0.2.2:8081/index.bundle?platform=android&dev=true&minify=false&app=com.flagsmithissue&modulesOnly=false&runModule=true:40:26
eval code
eval@[native code]
inject@http://10.0.2.2:8081/index.bundle?platform=android&dev=true&minify=false&app=com.flagsmithissue&modulesOnly=false&runModule=true:33422:11
forEach@[native code]
injectUpdate@http://10.0.2.2:8081/index.bundle?platform=android&dev=true&minify=false&app=com.flagsmithissue&modulesOnly=false&runModule=true:33428:28
http://10.0.2.2:8081/index.bundle?platform=android&dev=true&minify=false&app=com.flagsmithissue&modulesOnly=false&runModule=true:33511:23
emit@http://10.0.2.2:8081/index.bundle?platform=android&dev=true&minify=false&app=com.flagsmithissue&modulesOnly=false&runModule=true:33776:33
onmessage@http://10.0.2.2:8081/index.bundle?platform=android&dev=true&minify=false&app=com.flagsmithissue&modulesOnly=false&runModule=true:33486:23
dispatchEvent@http://10.0.2.2:8081/index.bundle?platform=android&dev=true&minify=false&app=com.flagsmithissue&modulesOnly=false&runModule=true:30817:31
http://10.0.2.2:8081/index.bundle?platform=android&dev=true&minify=false&app=com.flagsmithissue&modulesOnly=false&runModule=true:31817:31
emit@http://10.0.2.2:8081/index.bundle?platform=android&dev=true&minify=false&app=com.flagsmithissue&modulesOnly=false&runModule=true:2246:42
__callFunction@http://10.0.2.2:8081/index.bundle?platform=android&dev=true&minify=false&app=com.flagsmithissue&modulesOnly=false&runModule=true:3262:36
http://10.0.2.2:8081/index.bundle?platform=android&dev=true&minify=false&app=com.flagsmithissue&modulesOnly=false&runModule=true:2986:31
__guard@http://10.0.2.2:8081/index.bundle?platform=android&dev=true&minify=false&app=com.flagsmithissue&modulesOnly=false&runModule=true:3213:15
callFunctionReturnFlushedQueue@http://10.0.2.2:8081/index.bundle?platform=android&dev=true&minify=false&app=com.flagsmithissue&modulesOnly=false&runModule=true:2985:21
callFunctionReturnFlushedQueue@[native code]

[sammysium]

@kyle-ssg any thoughts please on why I am getting .getItem error?

[kyle-ssg]

@sammysium in this repository you're still initialising flagsmith with asyncStorage instead of AsyncStorage as previously mentioned. Changing it to AsyncStorage instead of asyncStorage works fine for me inside your initializeFlagSmith function.

 const initializeFlagSmith = () => {
   flagsmith
     .init({
       environmentID: 'Qqzb8wpxz7YmT34rZHyFw7',
       api: 'https://flagsapi.oneacrefund.org/api/v1/',
       AsyncStorage: AsyncStorage,
       cacheFlags: true,
       onError: handleFlagsError,
       onChange: (oldFlags, params) => {
         alert(JSON.stringify(flagsmith.flags))
       }
     })
     .then(() => {
       flagsmith.startListening(30000);
     })
     .catch((error) => {
       handleFlagsError(error);
     });
 };

Added PR.