You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: packages/react-sdk/README.md
+21-20Lines changed: 21 additions & 20 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -510,26 +510,7 @@ The `<ReflagProvider>` initializes the Reflag SDK, fetches flags and starts list
510
510
- `expireTimeMs`: If set, flags will be cached between page loads for this duration (in milliseconds).
511
511
- `staleTimeMs`: Maximum time (in milliseconds) that stale flags will be returned if `staleWhileRevalidate` is true and new flags cannot be fetched.
512
512
- `offline`: Provide this option when testing or in local development environments to avoid contacting Reflag servers.
513
-
- `loadingComponent` lets you specify an React component to be rendered instead of the children while the Reflag provider is initializing. If you want more control over loading screens, `useFlag()` returns `isLoading` which you can use to customize the loading experience:
{/* children here are shown when loading finishes */}
529
-
</LoadingReflag>
530
-
</ReflagProvider>;
531
-
```
532
-
513
+
- `loadingComponent` lets you specify an React component to be rendered instead of the children while the Reflag provider is initializing. If you want more control over loading screens, `useFlag()` and `useIsLoading` returns `isLoading` which you can use to customize the loading experience.
533
514
- `enableTracking`: Set to `false` to stop sending tracking events and user/company updates to Reflag. Useful when you're impersonating a user (defaults to `true`),
534
515
- `apiBaseUrl`: Optional base URL for the Reflag API. Use this to override the default API endpoint,
535
516
- `appBaseUrl`: Optional base URL for the Reflag application. Use this to override the default app URL,
@@ -584,6 +565,7 @@ Returns the state of a given flag for the current context. The hook provides typ
584
565
585
566
```tsx
586
567
import { useFlag } from"@reflag/react-sdk";
568
+
import { Loading } from"./Loading";
587
569
588
570
function StartHuddleButton() {
589
571
const {
@@ -772,6 +754,25 @@ function LoggingWrapper({ children }: { children: ReactNode }) {
772
754
}
773
755
```
774
756
757
+
### `useIsLoading()`
758
+
759
+
Returns the loading state of the flags in the `ReflagClient`.
760
+
761
+
```tsx
762
+
import { useIsLoading } from"@reflag/react-sdk";
763
+
import { Spinner } from"./Spinner";
764
+
765
+
function LoadingWrapper({ children }: { children:ReactNode }) {
766
+
const isLoading =useIsLoading();
767
+
768
+
if (isLoading) {
769
+
return <Spinner />;
770
+
}
771
+
772
+
returnchildren;
773
+
}
774
+
```
775
+
775
776
## Migrating from Bucket SDK
776
777
777
778
If you have been using the Bucket SDKs, the following list will help you migrate to Reflag SDK:
0 commit comments