@togglely/sdk-react 1.1.2 → 1.1.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +48 -1
- package/package.json +2 -2
package/README.md
CHANGED
|
@@ -12,7 +12,7 @@ npm install @togglely/sdk-react
|
|
|
12
12
|
|
|
13
13
|
### Provider
|
|
14
14
|
|
|
15
|
-
Wrap your app with `TogglelyProvider
|
|
15
|
+
Wrap your app with `TogglelyProvider`. You can provide an `initialContext` for multi-tenant setups:
|
|
16
16
|
|
|
17
17
|
```tsx
|
|
18
18
|
import { TogglelyProvider } from '@togglely/sdk-react';
|
|
@@ -21,8 +21,13 @@ function App() {
|
|
|
21
21
|
return (
|
|
22
22
|
<TogglelyProvider
|
|
23
23
|
apiKey="your-api-key"
|
|
24
|
+
project="web-app"
|
|
24
25
|
environment="production"
|
|
25
26
|
baseUrl="https://your-togglely-instance.com"
|
|
27
|
+
initialContext={{
|
|
28
|
+
tenantId: 'customer-123',
|
|
29
|
+
plan: 'premium'
|
|
30
|
+
}}
|
|
26
31
|
>
|
|
27
32
|
<MyApp />
|
|
28
33
|
</TogglelyProvider>
|
|
@@ -30,8 +35,50 @@ function App() {
|
|
|
30
35
|
}
|
|
31
36
|
```
|
|
32
37
|
|
|
38
|
+
### Server Side Rendering (SSR) & Next.js
|
|
39
|
+
|
|
40
|
+
For SSR, use `getTogglelyState` to fetch toggles before the page renders:
|
|
41
|
+
|
|
42
|
+
```tsx
|
|
43
|
+
// Next.js getServerSideProps example
|
|
44
|
+
import { getTogglelyState } from '@togglely/sdk-react';
|
|
45
|
+
|
|
46
|
+
export async function getServerSideProps() {
|
|
47
|
+
const toggles = await getTogglelyState({
|
|
48
|
+
apiKey: process.env.TOGGLELY_API_KEY,
|
|
49
|
+
project: 'web-app',
|
|
50
|
+
environment: 'production',
|
|
51
|
+
baseUrl: 'https://your-togglely-instance.com'
|
|
52
|
+
}, {
|
|
53
|
+
tenantId: 'customer-123'
|
|
54
|
+
});
|
|
55
|
+
|
|
56
|
+
return { props: { initialToggles: toggles } };
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
// Then pass to Provider to avoid flickering
|
|
60
|
+
<TogglelyProvider initialToggles={props.initialToggles} ...>
|
|
61
|
+
```
|
|
62
|
+
|
|
33
63
|
### Hooks
|
|
34
64
|
|
|
65
|
+
#### `useTogglelyClient()`
|
|
66
|
+
|
|
67
|
+
Access the core client to update context dynamically:
|
|
68
|
+
|
|
69
|
+
```tsx
|
|
70
|
+
function LoginComponent() {
|
|
71
|
+
const client = useTogglelyClient();
|
|
72
|
+
|
|
73
|
+
const handleLogin = (user) => {
|
|
74
|
+
client.setContext({
|
|
75
|
+
userId: user.id,
|
|
76
|
+
tenantId: user.companyId
|
|
77
|
+
});
|
|
78
|
+
};
|
|
79
|
+
}
|
|
80
|
+
```
|
|
81
|
+
|
|
35
82
|
#### `useToggle(key, defaultValue)`
|
|
36
83
|
|
|
37
84
|
Check if a boolean feature toggle is enabled:
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@togglely/sdk-react",
|
|
3
|
-
"version": "1.1.
|
|
3
|
+
"version": "1.1.4",
|
|
4
4
|
"description": "React SDK for Togglely - Feature toggles with hooks",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"module": "dist/index.esm.js",
|
|
@@ -35,4 +35,4 @@
|
|
|
35
35
|
"tslib": "^2.6.2",
|
|
36
36
|
"typescript": "^5.3.3"
|
|
37
37
|
}
|
|
38
|
-
}
|
|
38
|
+
}
|