@sanity/personalization-plugin 2.5.0 → 3.0.0

package/src/fieldExperiments.tsx

@@ -1,266 +0,0 @@
-import {
-  ArrayOfObjectsInputProps,
-  defineField,
-  definePlugin,
-  defineType,
-  FieldDefinition,
-  isObjectInputProps,
-} from 'sanity'
-
-import {ArrayInput} from './components/Array'
-import {CONFIG_DEFAULT, ExperimentProvider} from './components/ExperimentContext'
-import {ExperimentField} from './components/ExperimentField'
-import {ExperimentInput} from './components/ExperimentInput'
-import {ExperimentItem} from './components/ExperimentItem'
-import {VariantInput} from './components/VariantInput'
-import {VariantPreview} from './components/VariantPreview'
-import {FieldPluginConfig} from './types'
-import {flattenSchemaType} from './utils/flattenSchemaType'
-
-const createExperimentType = ({
-  field,
-  experimentNameOverride,
-  variantNameOverride,
-  variantId,
-  variantArrayName,
-  experimentId,
-}: {
-  field: string | FieldDefinition
-  experimentNameOverride: string
-  variantNameOverride: string
-  variantId: string
-  variantArrayName: string
-  experimentId: string
-}) => {
-  const typeName = typeof field === `string` ? field : field.name
-  const usedName = String(typeName[0]).toUpperCase() + String(typeName).slice(1)
-  const variantName = `${variantNameOverride}${usedName}`
-
-  return defineType({
-    name: `${experimentNameOverride}${usedName}`,
-    type: 'object',
-    components: {
-      field: (props) => (
-        <ExperimentField
-          {...props}
-          experimentId={experimentId}
-          experimentNameOverride={experimentNameOverride}
-          variantNameOverride={variantNameOverride}
-        />
-      ),
-      item: ExperimentItem,
-    },
-    fields: [
-      typeof field === `string`
-        ? // Define a simple field if all we have is the name as a string
-          defineField({
-            name: 'default',
-            type: field,
-          })
-        : // Pass in the configured options, but overwrite the name
-          {
-            ...field,
-            name: 'default',
-          },
-      defineField({
-        name: 'active',
-        type: 'boolean',
-        hidden: true,
-        initialValue: false,
-      }),
-      defineField({
-        name: experimentId,
-        type: 'string',
-        components: {
-          input: (props) => (
-            <ExperimentInput
-              {...props}
-              experimentNameOverride={experimentNameOverride}
-              variantNameOverride={variantNameOverride}
-            />
-          ),
-        },
-        hidden: ({parent}) => {
-          return !parent?.active
-        },
-      }),
-      defineField({
-        name: variantArrayName,
-        type: 'array',
-        hidden: ({parent}) => {
-          return !parent?.[experimentId]
-        },
-        components: {
-          input: (props: ArrayOfObjectsInputProps) => (
-            <ArrayInput
-              {...props}
-              variantName={variantName}
-              variantId={variantId}
-              experimentId={experimentId}
-            />
-          ),
-        },
-        of: [
-          defineField({
-            name: variantName,
-            type: variantName,
-          }),
-        ],
-      }),
-    ],
-    preview: {
-      select: {
-        base: 'default',
-        experiment: experimentId,
-      },
-      prepare: ({base, experiment}) => {
-        const title = base?.title || base?.name || typeof base === 'string' ? base : ''
-        const experimentTitle = experiment ? `Experiment: ${experiment}` : ''
-        const media = base?.image || base?.photo || base?.media || ''
-        return {
-          title: title || experimentTitle,
-          subtitle: title ? experimentTitle : '',
-          media,
-        }
-      },
-    },
-  })
-}
-
-const createVariantType = ({
-  field,
-  variantNameOverride,
-  variantId,
-  experimentId,
-}: {
-  field: string | FieldDefinition
-  variantNameOverride: string
-  variantId: string
-  experimentId: string
-}) => {
-  const typeName = typeof field === `string` ? field : field.name
-  const usedName = String(typeName[0]).toUpperCase() + String(typeName).slice(1)
-  return defineType({
-    name: `${variantNameOverride}${usedName}`,
-    title: `${variantNameOverride} array ${usedName}`,
-    type: 'object',
-    components: {
-      preview: VariantPreview,
-      input: VariantInput,
-    },
-    fields: [
-      {
-        type: 'string',
-        name: variantId,
-        readOnly: true,
-      },
-      {
-        type: 'string',
-        name: experimentId,
-        hidden: true,
-      },
-      typeof field === `string`
-        ? // Define a simple field if all we have is the name as a string
-          defineField({
-            name: 'value',
-            type: field,
-            // hidden: ({parent}) => !parent?.[`${objectNameOverride}Id`],
-          })
-        : // Pass in the configured options, but overwrite the name
-          {
-            ...field,
-            name: 'value',
-            // hidden: ({parent}) => !parent?.[`${objectNameOverride}Id`],
-          },
-    ],
-    preview: {
-      select: {
-        variant: variantId,
-        experiment: experimentId,
-        value: 'value',
-      },
-    },
-  })
-}
-
-const fieldSchema = ({
-  fields,
-  experimentNameOverride,
-  variantNameOverride,
-  variantId,
-  variantArrayName,
-  experimentId,
-}: Required<Omit<FieldPluginConfig, 'apiVersion' | 'experiments'>>) => {
-  return [
-    ...fields.map((field) =>
-      createVariantType({field, variantNameOverride, variantId, experimentId}),
-    ),
-    ...fields.map((field) =>
-      createExperimentType({
-        field,
-        experimentNameOverride,
-        variantNameOverride,
-        variantId,
-        variantArrayName,
-        experimentId,
-      }),
-    ),
-  ]
-}
-
-export const fieldLevelExperiments = definePlugin<FieldPluginConfig>((config) => {
-  const pluginConfig = {...CONFIG_DEFAULT, ...config}
-  const {fields, experimentNameOverride, variantNameOverride} = pluginConfig
-
-  const experimentId = `${experimentNameOverride}Id`
-  const variantArrayName = `${variantNameOverride}s`
-  const variantId = `${variantNameOverride}Id`
-
-  const fieldSchemaConfig = fieldSchema({
-    fields,
-    experimentNameOverride,
-    variantNameOverride,
-    variantId,
-    variantArrayName,
-    experimentId,
-  })
-  return {
-    name: 'sanity-personalistaion-plugin-field-level-experiments',
-    schema: {
-      types: fieldSchemaConfig,
-    },
-    form: {
-      components: {
-        input: (props) => {
-          const isRootInput = props.id === 'root' && isObjectInputProps(props)
-
-          if (!isRootInput) {
-            return props.renderDefault(props)
-          }
-
-          const flatFields = flattenSchemaType(props.schemaType)
-          const hasExperiment = flatFields.some(
-            (field) =>
-              field.type.name.startsWith(experimentNameOverride) ||
-              field.name.startsWith(experimentNameOverride),
-          )
-
-          if (!hasExperiment) {
-            return props.renderDefault(props)
-          }
-
-          const providerProps = {
-            ...props,
-            experimentFieldPluginConfig: {
-              ...pluginConfig,
-              variantId,
-              variantArrayName,
-              experimentId,
-            },
-          }
-          return ExperimentProvider(providerProps)
-        },
-      },
-    },
-  }
-})

package/src/growthbook/Components/GrowthbookContext.tsx

@@ -1,38 +0,0 @@
-import {createContext, useContext, useMemo, useState} from 'react'
-import {ObjectInputProps} from 'sanity'
-
-import {GrowthbookContextProps, GrowthbookExperimentFieldPluginConfig} from '../types'
-import {Secrets} from './Secrets'
-
-export const GROWTHBOOK_CONFIG_DEFAULT = {
-  baseUrl: 'https://api.growthbook.io/api/v1',
-}
-
-export const GrowthbookContext = createContext<GrowthbookContextProps>({
-  setSecret: () => undefined,
-  secret: undefined,
-})
-
-export function useGrowthbookContext() {
-  return useContext(GrowthbookContext)
-}
-
-type GrowthbookProps = ObjectInputProps & {
-  growthbookFieldPluginConfig: GrowthbookExperimentFieldPluginConfig
-}
-
-export function GrowthbookProvider(props: GrowthbookProps) {
-  const {growthbookFieldPluginConfig} = props
-  const [secret, setSecret] = useState<string | undefined>()
-
-  const context = useMemo(
-    () => ({...growthbookFieldPluginConfig, secret, setSecret}),
-    [growthbookFieldPluginConfig, secret, setSecret],
-  )
-
-  return (
-    <GrowthbookContext.Provider value={context}>
-      <Secrets {...props} />
-    </GrowthbookContext.Provider>
-  )
-}

package/src/growthbook/Components/Secrets.tsx

@@ -1,47 +0,0 @@
-import {SettingsView, useSecrets} from '@sanity/studio-secrets'
-import {useEffect, useState} from 'react'
-import {ObjectInputProps} from 'sanity'
-
-import {useGrowthbookContext} from './GrowthbookContext'
-
-export const namespace = 'growthbook'
-
-export const pluginConfigKeys = [
-  {
-    key: 'apiKey',
-    title: 'Your secret API key',
-  },
-]
-
-export const Secrets = (props: ObjectInputProps) => {
-  const {secrets, loading} = useSecrets(namespace) as {secrets: {apiKey: string}; loading: boolean}
-  const {setSecret} = useGrowthbookContext()
-  const [showSettings, setShowSettings] = useState<boolean>(false)
-
-  useEffect(() => {
-    if (loading) return undefined
-    if (!secrets && !loading) {
-      setSecret(undefined)
-      return setShowSettings(true)
-    }
-    setSecret(secrets.apiKey)
-    return setShowSettings(false)
-  }, [secrets, loading, setSecret])
-
-  if (!showSettings) {
-    return props.renderDefault(props)
-  }
-  return (
-    <>
-      <SettingsView
-        title={'Growthbook secret'}
-        namespace={namespace}
-        keys={pluginConfigKeys}
-        onClose={() => {
-          setShowSettings(false)
-        }}
-      />
-      {props.renderDefault(props)}
-    </>
-  )
-}

package/src/growthbook/index.ts

@@ -1,54 +0,0 @@
-import {definePlugin, isObjectInputProps} from 'sanity'
-
-import {fieldLevelExperiments as baseFieldLevelExperiments} from '../fieldExperiments'
-import {flattenSchemaType} from '../utils/flattenSchemaType'
-import {GROWTHBOOK_CONFIG_DEFAULT, GrowthbookProvider} from './Components/GrowthbookContext'
-import {GrowthbookExperimentFieldPluginConfig} from './types'
-import {getExperiments} from './utils'
-
-export const fieldLevelExperiments = definePlugin<GrowthbookExperimentFieldPluginConfig>(
-  (config) => {
-    const pluginConfig = {...GROWTHBOOK_CONFIG_DEFAULT, ...config}
-    const {fields, environment, project, convertBooleans, baseUrl, tags} = pluginConfig
-    return {
-      name: 'sanity-growthbook-personalistaion-plugin-field-level-experiments',
-      plugins: [
-        baseFieldLevelExperiments({
-          fields,
-          experiments: (client) =>
-            getExperiments({client, environment, baseUrl, project, convertBooleans, tags}),
-        }),
-      ],
-
-      form: {
-        components: {
-          input: (props) => {
-            const isRootInput = props.id === 'root' && isObjectInputProps(props)
-
-            if (!isRootInput) {
-              return props.renderDefault(props)
-            }
-
-            const flatFieldTypeNames = flattenSchemaType(props.schemaType).map(
-              (field) => field.type.name,
-            )
-
-            const hasExperiment = flatFieldTypeNames.some((name) => name.startsWith('experiment'))
-
-            if (!hasExperiment) {
-              return props.renderDefault(props)
-            }
-
-            const providerProps = {
-              ...props,
-              growthbookFieldPluginConfig: {
-                ...pluginConfig,
-              },
-            }
-            return GrowthbookProvider(providerProps)
-          },
-        },
-      },
-    }
-  },
-)

package/src/growthbook/types.ts

@@ -1,15 +0,0 @@
-import {FieldDefinition} from 'sanity'
-
-export type GrowthbookExperimentFieldPluginConfig = {
-  fields: (string | FieldDefinition)[]
-  environment: string
-  baseUrl?: string
-  project?: string
-  convertBooleans?: boolean
-  tags?: string[]
-}
-
-export type GrowthbookContextProps = {
-  setSecret: (secret: string | undefined) => void
-  secret: string | undefined
-}

package/src/growthbook/utils.ts

@@ -1,94 +0,0 @@
-import {SanityClient} from 'sanity'
-
-import {ExperimentType, GrowthbookFeature, VariantType} from '../types'
-import {namespace, pluginConfigKeys} from './Components/Secrets'
-import {GrowthbookExperimentFieldPluginConfig} from './types'
-
-const getBooleanConversion = (value: string) => {
-  // control is false
-  if (value === 'true') {
-    return 'variant'
-  } else if (value === 'false') {
-    return 'control'
-  }
-  return value
-}
-
-export const getExperiments = async ({
-  client,
-  environment,
-  baseUrl,
-  project,
-  convertBooleans,
-  tags,
-}: Omit<GrowthbookExperimentFieldPluginConfig, 'fields' | 'baseUrl'> & {
-  client: SanityClient
-  baseUrl: string
-}): Promise<ExperimentType[]> => {
-  const query = `*[_id == 'secrets.${namespace}'][0].secrets.${pluginConfigKeys[0].key}`
-
-  const secret = await client.fetch(query) // secret is stored in the content lake using @sanity/studio-secrets
-  if (!secret) return []
-
-  const featureExperiments: ExperimentType[] = []
-  let hasMore = true
-  let offset = 0
-  const url = new URL(`${baseUrl}/features`)
-  if (project) {
-    url.searchParams.set('projectId', project)
-  }
-
-  while (hasMore) {
-    url.searchParams.set('offset', offset.toString())
-    const response = await fetch(url, {
-      headers: {
-        Authorization: `Bearer ${secret}`,
-      },
-    })
-
-    const {features, hasMore: responseHasMore, nextOffset} = await response.json()
-
-    hasMore = responseHasMore
-    offset = nextOffset
-    if (!features) continue
-
-    features.forEach((feature: GrowthbookFeature) => {
-      if (feature.archived) {
-        return undefined
-      }
-      if (tags && feature.tags && !feature.tags.some((tag) => tags.includes(tag))) {
-        return undefined
-      }
-
-      const experiments = feature.environments[environment]?.rules.filter(
-        (experiment) => experiment.type === 'experiment-ref' || experiment.type === 'experiment',
-      )
-
-      if (!experiments) {
-        return undefined
-      }
-
-      const variations: VariantType[] = []
-      const uniqueValues = new Set<string>()
-
-      experiments.forEach((experiment) => {
-        experiment?.variations.forEach((variant) => {
-          const value = convertBooleans ? getBooleanConversion(variant.value) : variant.value
-          if (!uniqueValues.has(value)) {
-            uniqueValues.add(value)
-            variations.push({
-              id: value,
-              label: value,
-            })
-          }
-        })
-      })
-      const value = {id: feature.id, label: feature.id, variants: variations}
-
-      featureExperiments.push(value)
-      return undefined
-    })
-  }
-  const sortedFeatureExperiments = featureExperiments.sort((a, b) => a.id.localeCompare(b.id))
-  return sortedFeatureExperiments
-}

package/src/index.ts

@@ -1,3 +0,0 @@
-export * from './fieldExperiments'
-export * from './types'
-export * from './utils/flattenSchemaType'

package/src/launchDarkly/components/LaunchDarklyContext.tsx

@@ -1,36 +0,0 @@
-import {createContext, useContext, useMemo, useState} from 'react'
-import {ObjectInputProps} from 'sanity'
-
-import {LaunchDarklyContextProps, LaunchDarklyFieldLevelConfig} from '../types'
-import {Secrets} from './Secrets'
-
-export const LAUNCHDARKLY_CONFIG_DEFAULT = {}
-
-export const LaunchDarklyContext = createContext<LaunchDarklyContextProps>({
-  setSecret: () => undefined,
-  secret: undefined,
-})
-
-export function useLaunchDarklyContext() {
-  return useContext(LaunchDarklyContext)
-}
-
-type LaunchDarklyProps = ObjectInputProps & {
-  launchDarklyFieldPluginConfig: LaunchDarklyFieldLevelConfig
-}
-
-export function LaunchDarklyProvider(props: LaunchDarklyProps) {
-  const {launchDarklyFieldPluginConfig} = props
-  const [secret, setSecret] = useState<string | undefined>()
-
-  const context = useMemo(
-    () => ({...launchDarklyFieldPluginConfig, secret, setSecret}),
-    [launchDarklyFieldPluginConfig, secret, setSecret],
-  )
-
-  return (
-    <LaunchDarklyContext.Provider value={context}>
-      <Secrets {...props} />
-    </LaunchDarklyContext.Provider>
-  )
-}

package/src/launchDarkly/components/Secrets.tsx

@@ -1,46 +0,0 @@
-import {SettingsView, useSecrets} from '@sanity/studio-secrets'
-import {useEffect, useState} from 'react'
-import {ObjectInputProps} from 'sanity'
-
-import {useLaunchDarklyContext} from './LaunchDarklyContext'
-
-const namespace = 'launchdarkly'
-const pluginConfigKeys = [
-  {
-    key: 'apiKey',
-    title: 'Your secret API key',
-  },
-]
-
-export const Secrets = (props: ObjectInputProps) => {
-  const {secrets, loading} = useSecrets(namespace) as {secrets: {apiKey: string}; loading: boolean}
-  const {setSecret} = useLaunchDarklyContext()
-  const [showSettings, setShowSettings] = useState<boolean>(false)
-
-  useEffect(() => {
-    if (loading) return undefined
-    if (!secrets && !loading) {
-      setSecret(undefined)
-      return setShowSettings(true)
-    }
-    setSecret(secrets.apiKey)
-    return setShowSettings(false)
-  }, [secrets, loading, setSecret])
-
-  if (!showSettings) {
-    return props.renderDefault(props)
-  }
-  return (
-    <>
-      <SettingsView
-        title={`${namespace} api key`}
-        namespace={namespace}
-        keys={pluginConfigKeys}
-        onClose={() => {
-          setShowSettings(false)
-        }}
-      />
-      {props.renderDefault(props)}
-    </>
-  )
-}

package/src/launchDarkly/index.ts

@@ -1,52 +0,0 @@
-import {definePlugin, isObjectInputProps} from 'sanity'
-
-import {fieldLevelExperiments as baseFieldLevelExperiments} from '../fieldExperiments'
-import {flattenSchemaType} from '../utils/flattenSchemaType'
-import {LAUNCHDARKLY_CONFIG_DEFAULT, LaunchDarklyProvider} from './components/LaunchDarklyContext'
-import {LaunchDarklyFieldLevelConfig} from './types'
-import {getExperiments} from './utils'
-
-export const fieldLevelExperiments = definePlugin<LaunchDarklyFieldLevelConfig>((config) => {
-  const pluginConfig = {...LAUNCHDARKLY_CONFIG_DEFAULT, ...config}
-  const {fields, projectKey, tags} = pluginConfig
-  return {
-    name: 'sanity-growthbook-personalistaion-plugin-field-level-experiments',
-    plugins: [
-      baseFieldLevelExperiments({
-        fields,
-        experiments: (client) => getExperiments({client, projectKey, tags}),
-        experimentNameOverride: 'flag',
-      }),
-    ],
-
-    form: {
-      components: {
-        input: (props) => {
-          const isRootInput = props.id === 'root' && isObjectInputProps(props)
-
-          if (!isRootInput) {
-            return props.renderDefault(props)
-          }
-
-          const flatFieldTypeNames = flattenSchemaType(props.schemaType).map(
-            (field) => field.type.name,
-          )
-
-          const hasExperiment = flatFieldTypeNames.some((name) => name.startsWith('flag'))
-
-          if (!hasExperiment) {
-            return props.renderDefault(props)
-          }
-
-          const providerProps = {
-            ...props,
-            launchDarklyFieldPluginConfig: {
-              ...pluginConfig,
-            },
-          }
-          return LaunchDarklyProvider(providerProps)
-        },
-      },
-    },
-  }
-})