@newskit-render/feature-flags 1.9.1 → 1.10.0-alpha.0

package/README.md

@@ -11,31 +11,20 @@ There are two ways that feature flags can be utilized.
 
 ### getFeatureFlags() in getServerSideProps
 
-The most performant way to use feature flags is to call `getFeatureFlags()` in `getServersideProps` and then use them throughout the page. This way the implementation will only be available for the current page and and wouldn't effect the rest of the site.
-To do so you will need to initialize the package by calling `createFeatureFlagsInstance` with the sdkKey from optimizely.
+The most performant way to use feature flags is to call `getFeatureFlags()` or `getFeatureFlagsByKeys()` in `getServerSideProps` and then use them throughout the page. This way the implementation will only be available for the current page and and wouldn't effect the rest of the site.
 Best practice is to store your sdk key in environment variables, the examples below utilize that method.
 For local use, you cadd the Optimizely SDK key from your project in your `.env.local` file like so
 `OPTIMIZELY_SDK_KEY="123"`.
 In case you don't have project or access to the Optimizely platform please contact the Experimentation team.
-Optionally the config can be switched to suit your need. More on this can be found [here](#createFeatureFlagsInstance).<br /> <br />
 An example implementation would be as follows:
 
 `pages/index.ts`
 
 ```
-import {getFeatureFlags, createFeatureFlagsInstance} from '@newskit-render/feature-flags';
+import { getFeatureFlags } from '@newskit-render/feature-flags';
 
 export async function getServerSideProps(context) {
-  // code
-  createFeatureFlagsInstance({ optimizelyConfig: { sdkKey: process.env.OPTIMIZELY_SDK_KEY } })
-  // code
-
-  const [resultFromOtherQueries, featureFlagsResult] = await Promise.allSettled([
-     // other queries,
-     getFeatureFlags()
-  ])
-
-  const featureFlags = featureFlagsResult.value;
+  const featureFlags = await getAllFeatureFlags(config)
 
   return {
     props: {
@@ -46,16 +35,13 @@ export async function getServerSideProps(context) {
 }
 ```
 
-The package also provides a helper function that conbines getFeatureFlags, createFeatureFlagsInstance in one.
+The package also provides a function that is going to return only selected flags
 
 ```
-import {initAndGetFeatureFlag} from '@newskit-render/feature-flags';
+import { getFeatureFlagsByKeys } from '@newskit-render/feature-flags';
 
 export async function getServerSideProps(context) {
-  const [resultFromOtherQueries, featureFlags] = await Promise.allSettled([
-     // other queries,
-     initAndGetFeatureFlag(process.env.OPTIMIZELY_SDK_KEY)
-  ])
+  const featureFlags = getFeatureFlagsByKeys(['flag_1', 'flag_2'], config)
 
   return {
     props: {
@@ -66,32 +52,6 @@ export async function getServerSideProps(context) {
 }
 ```
 
-`samplePage/index.tsx`
-
-```
-import React from 'react'
-import { FeatureFlag } from '@newskit-render/feature-flags'
-
-const SectionPage: React.FC<{
-  page: Page
-  // pageprops...
-  featureFlags?: FeatureFlag[]
-}> = ({ page, pageprops..., featureFlags }) => {
-
-  return(
-      <Layout>
-        {featureFlags && featureFlags['test_flag'] && <p>FEATURE FLAG IS HEREEE</p>}
-        <Cell>
-          // ...content
-        </Cell>
-      </Layout>
- )}
-
-export default SamplePage
-
-``` 
-
-### hooks in getInitialProps
 
 Alternatively, feature flags can be applied on the whole app. To do so, you'll need to instantiate the package in `getInitialProps` of the main app, then call `getFeatureFlags` and pass the result to the whole app.
 By calling the `useFeatureFlagsContext` hook, the list of featureFlags can be accessed from any point of the site.
@@ -147,9 +107,39 @@ const Header: React.FC<{ user: UserData }> = ({ user }) => {
 export default Header
 ```
 
-### createFeatureFlagsInstance
+### config argument
+
+The `config` object is optional. It can be added as an argument to both `getFeatureFlags()` and `getFeatureFlagsByKeys()` functions.
+By default the package is going to get the `OPTIMIZELY_SDK_KEY` directly from the environment variables but the key can be overwritten with a key
+added in the config.
+
+The configurations that can be passed to Optimizely in the `config` object is:
+
+```
+  sdkConfig?: {
+    datafileOptions?: DatafileOptions;
+    eventBatchSize?: number;
+    eventFlushInterval?: number;
+    eventMaxQueueSize?: number;
+    sdkKey?: string;
+    odpOptions?: OdpOptions;
+    persistentCacheProvider?: PersistentCacheProvider;
+  }
+  logLevel?: 'critical' | 'error' | 'warning' | 'debug' | 'info'
+  userData?: {
+    userId?: string
+    attributes?: {
+      [name: string]: UserAttributeValue
+    }
+  }
+  defaultFeatureFlags?: Flags
+  includeFlagVariables?: boolean
+  decideOptions?: OptimizelyDecideOption[]
+```
 
-`createFeatureFlagsInstance` takes config object as parameter. The config object consists of [`optimizelyConfig`](https://docs.developers.optimizely.com/full-stack/v4.0/docs/initialize-sdk-javascript-node#section-parameters), `userId`, `defaultFeatureFlags`, `logLevel`. The only requirement for the feature flags to be instantiated is passing optimizely sdk key to `optimizelyConfig`. Further, the whole config can be changed to suit your needs.
 `userId` serves as optimizely user identity.
+`attributes` is a map of custom key-value pairs specifying attributes for the user that are used for audience targeting. Detailed information can be found in the [`Optimizely docs`](https://docs.developers.optimizely.com/feature-experimentation/docs/optimizelyusercontext-javascript-node) 
 `defaultFeatureFlags` are used in the event that optimizely doesn't load up and initial values are required.
 `logLevel` serves to configure the optimizely logger if you wish to use it. It accepts `critical`, `error`, `warning`, `debug` or `info`
+`decideOptions` is an array of OptimizelyDecideOption enums. Detailed information can be found in the [`Optimizely docs`](https://docs.developers.optimizely.com/feature-experimentation/docs/decide-methods-javascript-node)
+`includeFlagVariables` with default of false can be used when you need additional flag information like `variationKey`, `enabled` and `variables`.