Comments (4)
Hi, firstly I apologise if you found this frustrating to work with.
Without the Provider/hooks I am able to identify my user as soon as they pass the Authentication step in my app (before React renders) and the first call to flagsmith ends up having the correct user identified flags
It sounds like in this case, really the issue is more that you wish to initialise or identify separately to components / render lifecycle.
Considering what you've raised, I've done 2 things.
1: I've marked the Flagsmith provider options as optional, this means the flagsmith instance you pass into the provider can be initialised both before and after this is rendered. It sounds like this might be preferable for you if you were previously rendering the correct values on the initial render.
As a side bonus this also that means SSR applications will not need to pass options into the component, they basically have the same use-case as yourself where they fetch flags prior to renders.
flagsmith.init({
environmentID: "QjgYur4LQTwe5HpvbvhpzK",
cacheFlags:true
})
...
<FlagsmithProvider flagsmith={flagsmith}>
<App />
</FlagsmithProvider>
2: I've added the ability to initialise with identity and also traits. This means if you know the identify beforehand you can pass it into init or as part of the Flagsmith provider options.
flagsmith.init({
environmentID: "QjgYur4LQTwe5HpvbvhpzK",
cacheFlags:true,
identity: "my_user",
traits: {{trait1:"value}}
})
...
<FlagsmithProvider flagsmith={flagsmith}>
<App />
</FlagsmithProvider>
Or
<FlagsmithProvider flagsmith={flagsmith}
options={{
environmentID: "QjgYur4LQTwe5HpvbvhpzK",
cacheFlags:true,
identity: "my_user",
traits: {{trait1:"value}}
}}>
<App />
</FlagsmithProvider>
You'll need to update to flagsmith or react-native-flagsmith ^2.0.5 to do this.
I'll shortly update the snippets in the flagsmith dashboard to inform users of this. Also, the docs for this will be published to docs.flagsmith.com later today.
If you have any questions regarding the above let me know / re-open the issue.
from flagsmith-js-client.
No problem at all, I'm keen to use this on projects too so I want it to be the best! Thanks for taking the time to be active
from flagsmith-js-client.
@kyle-ssg This is amazing! and thanks for the super fast turnaround! 😁 🎉
from flagsmith-js-client.
@kyle-ssg Please let me know if I should create a new issue, wanted to follow up on this conversation as I've just looked into upgrading to v2. I like the idea behind using a React native approach which makes Flagsmith similar to other React libraries.
I played with v2.0.9 for a bit and noticed a few things.
- This still makes a call to Flagsmith, which then unsurprisingly fails.
<FlagsmithProvider
flagsmith={flagsmith}
options={{
environmentID: ''
}}
>
Can you please make it so that we don't try to send any Flagsmith API requests when the ID is missing? There could be a console warning if you think it's valuable in case someone forgot to inject the correct variable. For my use case, it's not necessary, I just don't want to run Flagsmith in local development. Pre-v2, I would just not call flagsmith.init()
to achieve this.
- Looking at the
<FlagsmithProvider />
props,flagsmith={flagsmith}
stands out. What is the purpose of importing it asimport flagsmith from 'flagsmith'
only to pass it to the provider? Can't you do that automatically for me? I assume this is intended for initialization outside components which may lead to faster first render, correct? For my use case, I'd prefer to pass all options to the provider, otherwise there's very little improvement to my existing implementation. I have my customuseFeatureFlag()
hook which uses Flagsmith under the hood, so at the moment, v2 approach adds seemingly more complexity to implement at very small advantage (fewer re-renders)
Curious to hear your thoughts, thanks!
from flagsmith-js-client.
Related Issues (20)
- Flagsmith's `loadingState.error` is not respect actual error state HOT 11
- [Bug] - NextJS >= 13.0.0 SSR `useFlagsmith` state not matching the state that is passed to the provider. HOT 16
- flagsmith/react only works in React 18 HOT 3
- [Bug] - TypeError: Cannot read properties of null (reading 'getValue') HOT 5
- Flagsmith's 'useFlags' doesn't return actual cached flags when request failed HOT 2
- Rollup Name for react HOT 5
- Inconsistent license information HOT 2
- Caching with multiple instance doesn't work HOT 6
- Typing issue in react.tsx: 'flagsmith' is possibly 'null' HOT 3
- useFlags() race condition HOT 8
- Different environments not working HOT 5
- Localstorage cache is not being wiped out in some edge cases HOT 3
- Support `getValue` fallback without `json` flag HOT 2
- useFlags not updating values in react18/Nextjs App Router
- 3.23.0 seems to have broken something HOT 4
- Intermittent Flakiness in Feature Flags on Safari/MacOS HOT 2
- Flags are null when the cacheFlags option is true HOT 3
- Typescript compiler errror `Cannot find name 'F'.` when compiling flagsmith in Angular project HOT 3
- Bundle ES(flagsmith-es) and combine with standard CJS module (flagsmith)
- Identifier/trait confusion when using `cacheOptions: { skipAPI: true } ` HOT 3
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from flagsmith-js-client.