[Feedback] Request for Guidance: Implementing Locale-Based Feature Flags with Edge Config

[ayhid]

Description

First, thank you for maintaining this amazing feature flag system! I'm hoping the community might be able to help with some guidance on implementing locale-based feature flags using Vercel Edge Config. I've created a custom adapter extending the base Edge Config adapter, but I'm encountering some challenges with cookie-based overrides and would appreciate any advice on the best approach for handling locale-specific feature flags.

Current Approach

I've been experimenting with a custom adapter that extends the base Edge Config adapter:

import { createEdgeConfigAdapter } from '@flags-sdk/edge-config'
import { getLocale } from 'next-intl/server'
import type { Adapter } from 'flags'

// Generic adapter that adds locale awareness
export function createAdapter(connectionString?: string) {
  const configConnection = connectionString || process.env.FLAGS_CONNECTION_STRING

  if (!configConnection) {
    throw new Error('Missing connection string configuration')
  }

  const baseAdapter = createEdgeConfigAdapter(configConnection)()

  return function adapterInstance<ValueType>(): Adapter<ValueType, any> {
    return {
      origin: baseAdapter.origin,

      async decide({ key, headers, cookies }): Promise<ValueType> {
        try {
          // Get base value from Edge Config
          const rawValue = await baseAdapter.decide({ key, headers })

          // Handle simple boolean case
          if (typeof rawValue === 'boolean') {
            return rawValue as unknown as ValueType
          }

          // Handle object with locale information
          if (rawValue && typeof rawValue === 'object') {
            const locale = await getLocale()

            // Check for locale-specific value
            if (
              locale &&
              'locales' in rawValue &&
              rawValue.locales &&
              typeof rawValue.locales === 'object' &&
              locale in rawValue.locales
            ) {
              return Boolean(rawValue.locales[locale]) as unknown as ValueType
            }

            // Fall back to default value
            if ('value' in rawValue) {
              return Boolean(rawValue.value) as unknown as ValueType
            }
          }
          
          // Default fallback
          return false as unknown as ValueType
        } catch (error) {
          console.error(`Error evaluating flag "${key}":`, error)
          return false as unknown as ValueType
        }
      },
    }
  }
}

Problems Encountered

1. Cookie-based overrides don't seem to be accessible in the server environment
2. Unclear how to structure locale-specific flag data in Edge Config
3. No established patterns for handling locale-specific flag values with the Toolbar

Kindly Requesting Help With

1. Any suggestions or guidance for implementing locale-based feature flags
2. Recommendations for structuring locale-based flags in Edge Config
3. Tips for integrating Vercel Toolbar with locale-specific flags
4. Examples or advice on handling both locale-specific values and cookie-based overrides

If any of this functionality is already documented somewhere that I might have missed, I'd be incredibly grateful for a pointer in the right direction!

Edge Config Structure (Current)

Currently, I'm using a structure like:

{
  "example-feature": {
    "value": true,
    "description": "Controls this feature",
    "locales": {
      "en": true,
      "fr": false,
      "de": true
    }
  }
}

Questions I'm Hoping to Explore

1. Would you consider this a reasonable structure for locale-based flags in Edge Config, or is there a better approach you'd recommend?
2. What would be the best way for the Vercel Toolbar to handle overriding locale-specific flags?
3. How should cookie-based overrides interact with locale-specific values ideally?
4. Are there any performance optimizations you might suggest for handling multiple locales?

I'm open to completely different approaches if there are better patterns for this use case!

Reproduction Steps

1. Set up a Next.js application with next-intl for localization
2. Implement a custom adapter similar to the one above
3. Configure flags in Edge Config with locale-specific values
4. Attempt to debug or override flags

Environment

• Next.js version: 14.x
• @flags-sdk/edge-config version: latest
• @vercel/edge-config version: latest
• next-intl version: latest

Additional Context

I'm working on a multilingual application that needs efficient feature flag management across different locales. While my current implementation works for basic cases, I'd love to improve the developer experience, particularly around debugging and overrides.

Thanks so much for your time and any guidance you can provide. I really appreciate the work that's gone into this project and I'm excited to contribute back to the community with what I learn.