Skip to main content

React Client

The @upstash/edge-flags package provides a React hook, you can use to query flags in your React application.


npm install @upstash/edge-flags


Import the useFlag hook from the @upstash/edge-flags package and pass the name of the flag you want to query.

import { useFlag } from "@upstash/edge-flags";

const MyComponent = () => {
const { isEnabled, loading, error } = useFlag("my-flag");

if (error) {
return <p>Error {error}</p>;

if (loading) {
return <p>Loading...</p>;

return <p>Flag is {isEnabled ? "enabled" : "disabled"}</p>;

Custom Attributes

You can use custom attributes to enable a flag for a subset of users. For example, you can identify users by userId or email.

To set attributes, you can pass an object to the useFlag hook.

import { useFlag } from "@upstash/edge-flags";

const { isEnabled } = useFlag("my-flag", {
userId: "chronark",
email: "",