@scaleway/use-growthbook 1.0.0

package/.npmignore

@@ -0,0 +1,5 @@
+**/__tests__/**
+examples/
+src
+.eslintrc.cjs
+!.npmignore

package/CHANGELOG.md

@@ -0,0 +1,7 @@
+# @scaleway/use-growthbook
+
+## 1.0.0
+
+### Major Changes
+
+- [#1434](https://github.com/scaleway/scaleway-lib/pull/1434) [`4695cbc`](https://github.com/scaleway/scaleway-lib/commit/4695cbce29e4ac688607b97d67401e33923c92f3) Thanks [@Slashgear](https://github.com/Slashgear)! - Initialize the AB test common package for integration of GrowthBook inside Scaleway frontend apps

package/LICENSE.md

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2021 Scaleway
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,52 @@
+# `@scaleway/use-growthbook`
+
+Tiny adapter to easily add [GrowthBook](https://www.growthbook.io/) to your React Application.
+The idea of this package is to propose a _facade pattern_ above GrowthBook React SDK.
+
+## Install
+
+```bash
+$ pnpm add @scaleway/use-growthbook
+```
+
+## How to use
+
+### First add the provider to your application roots
+
+```js
+import { AbTestProvider } from '@scaleway/use-growthbook'
+import React from 'react'
+import ReactDOM from 'react-dom'
+import App from './App'
+
+ReactDOM.render(
+  <React.StrictMode>
+    <AbTestProvider
+      config={{ apiHost: 'string', clientKey: 'string', enableDevMode: true }}
+      anonymousId="123456789"
+      trackingCallback={(experiment, result) => console.log(experiment, result)}
+      errorCallback={console.error}
+    >
+      <App />
+    </AbTestProvider>
+  </React.StrictMode>,
+  document.getElementById('root'),
+)
+```
+
+### Attributes
+
+A hook `useAbTestAttributes` is available to get currentAttributes and to set new ones dynamically.
+
+### API
+
+Exported utils from GrowthBook React are listed here:
+
+- FeatureString
+- FeaturesReady
+- IfFeatureEnabled
+- useExperiment
+- useFeature
+- withRunExperiment
+- useFeatureIsOn
+- useFeatureValue

package/dist/AbTestProvider.js

@@ -0,0 +1,58 @@
+import { GrowthBookProvider, GrowthBook } from '@growthbook/growthbook-react';
+import { useMemo, useCallback, useEffect } from 'react';
+import { jsx } from 'react/jsx-runtime';
+
+const getGrowthBookInstance = _ref => {
+  let {
+    config: {
+      apiHost,
+      clientKey,
+      enableDevMode
+    },
+    anonymousId,
+    trackingCallback
+  } = _ref;
+  return new GrowthBook({
+    apiHost,
+    clientKey,
+    enableDevMode,
+    attributes: {
+      anonymousId,
+      userId: undefined,
+      organizationId: undefined,
+      organizationType: undefined
+    },
+    trackingCallback
+  });
+};
+const AbTestProvider = _ref2 => {
+  let {
+    children,
+    config,
+    anonymousId,
+    trackingCallback,
+    errorCallback
+  } = _ref2;
+  const growthbook = useMemo(() => getGrowthBookInstance({
+    config,
+    anonymousId,
+    trackingCallback
+  }), [trackingCallback, config, anonymousId]);
+  const loadFeature = useCallback(async () => {
+    if (config.clientKey) {
+      await growthbook.loadFeatures({
+        autoRefresh: false,
+        timeout: 500
+      });
+    }
+  }, [growthbook, config]);
+  useEffect(() => {
+    loadFeature().catch(errorCallback);
+  }, [loadFeature, errorCallback]);
+  return jsx(GrowthBookProvider, {
+    growthbook: growthbook,
+    children: children
+  });
+};
+
+export { AbTestProvider };

package/dist/index.d.ts

@@ -0,0 +1,28 @@
+export { FeatureString, FeaturesReady, IfFeatureEnabled, useExperiment, useFeature, useFeatureIsOn, useFeatureValue, withRunExperiment } from '@growthbook/growthbook-react';
+import * as react from 'react';
+import { ReactNode } from 'react';
+
+type Attributes = Record<string, unknown>;
+
+declare const useAbTestAttributes: () => [Attributes, (attributes: Attributes) => null | undefined];
+
+type ToolConfig = {
+    apiHost: string;
+    clientKey: string;
+    enableDevMode: boolean;
+};
+type TrackingCallback = (experiment: {
+    key: string;
+}, result: {
+    key: string;
+}) => null;
+type AbTestProviderProps = {
+    children: ReactNode;
+    anonymousId: string;
+    config: ToolConfig;
+    trackingCallback: TrackingCallback;
+    errorCallback: (error: string) => null;
+};
+declare const AbTestProvider: ({ children, config, anonymousId, trackingCallback, errorCallback, }: AbTestProviderProps) => react.JSX.Element;
+
+export { AbTestProvider, useAbTestAttributes };

package/dist/index.js

@@ -0,0 +1,3 @@
+export { FeatureString, FeaturesReady, IfFeatureEnabled, useExperiment, useFeature, useFeatureIsOn, useFeatureValue, withRunExperiment } from '@growthbook/growthbook-react';
+export { useAbTestAttributes } from './useAbTestAttributes.js';
+export { AbTestProvider } from './AbTestProvider.js';

package/dist/useAbTestAttributes.js

@@ -0,0 +1,14 @@
+import { useGrowthBook } from '@growthbook/growthbook-react';
+import { useMemo, useCallback } from 'react';
+
+const useAbTestAttributes = () => {
+  const growthBook = useGrowthBook();
+  const attributes = useMemo(() => growthBook?.getAttributes() ?? {}, [growthBook]);
+  const setAttributes = useCallback(newAttributes => growthBook?.setAttributes({
+    ...attributes,
+    ...newAttributes
+  }), [growthBook, attributes]);
+  return [attributes, setAttributes];
+};
+
+export { useAbTestAttributes };

package/package.json

@@ -0,0 +1,36 @@
+{
+  "name": "@scaleway/use-growthbook",
+  "version": "1.0.0",
+  "description": "Utility package to expose AB test tool",
+  "type": "module",
+  "engines": {
+    "node": ">=14.x"
+  },
+  "exports": {
+    "types": "./dist/index.d.ts",
+    "default": "./dist/index.js"
+  },
+  "sideEffects": false,
+  "publishConfig": {
+    "access": "public"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/scaleway/scaleway-lib",
+    "directory": "packages/growthbook"
+  },
+  "license": "MIT",
+  "keywords": [
+    "ab",
+    "feature flags"
+  ],
+  "dependencies": {
+    "@growthbook/growthbook-react": "0.17.0"
+  },
+  "devDependencies": {
+    "react": "18.2.0"
+  },
+  "peerDependencies": {
+    "react": "18.x"
+  }
+}