Next.js

// lib/confidence.ts
import { OpenFeature } from '@openfeature/server-sdk';
import { createConfidenceServerProvider } from '@spotify-confidence/openfeature-server-provider-local';

const provider = createConfidenceServerProvider({
  flagClientSecret: process.env.CONFIDENCE_FLAG_CLIENT_SECRET!,
});

// Initialize provider at startup
await OpenFeature.setProviderAndWait(provider);

// app/layout.tsx
import { ConfidenceProvider } from '@spotify-confidence/openfeature-server-provider-local/react-server';
import './lib/confidence';

export default async function RootLayout({ children }: { children: React.ReactNode }) {
  const context = {
    targetingKey: 'user-123',
    country: 'US',
  };

  return (
    <html>
      <body>
        <ConfidenceProvider context={context}>{children}</ConfidenceProvider>
      </body>
    </html>
  );
}

// app/page.tsx
import { getFlag } from '@spotify-confidence/openfeature-server-provider-local/react-server';

export default async function Page() {
  const showNewLayout = await getFlag('page-layout.showNewLayout', false, {
    targetingKey: 'user-123'
  });

  return showNewLayout ? <NewLayout /> : <OldLayout />;
}

// components/FeatureButton.tsx
'use client';
import { useFlag } from '@spotify-confidence/openfeature-server-provider-local/react-client';

export function FeatureButton() {
  const enabled = useFlag('new-feature.enabled', false);

  if (!enabled) return null;

  return <button>New Feature</button>;
}