@flipfeatureflag/react 0.1.9 → 0.1.11

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@flipfeatureflag/react",
-  "version": "0.1.9",
+  "version": "0.1.11",
   "description": "flipFeatureFlag React SDK",
   "main": "dist/index.cjs",
   "module": "dist/index.mjs",
@@ -20,7 +20,10 @@
     "react": ">=17"
   },
   "dependencies": {
-    "@flipfeatureflag/core": "0.1.8",
-    "@flipfeatureflag/js": "0.1.9"
-  }
+    "@flipfeatureflag/core": "0.1.10",
+    "@flipfeatureflag/js": "0.1.11"
+  },
+  "files": [
+    "dist"
+  ]
 }

package/src/index.tsx

@@ -1,174 +0,0 @@
-import React, { PropsWithChildren, useEffect, useMemo, useRef, useState } from "react";
-import { FlipFlagClient, FlipFlagClientOptions, FlagsStatus, SdkFlagEvaluation } from "@flipfeatureflag/core";
-import { createClient as createBrowserClient } from "@flipfeatureflag/js";
-
-interface FlipFlagProviderProps {
-  client?: FlipFlagClient;
-  config?: FlipFlagClientOptions;
-}
-
-const FlipFlagContext = React.createContext<FlipFlagClient | null>(null);
-const FlipFlagStatusContext = React.createContext<FlagsStatus>({ ready: false });
-
-export function FlipFlagProvider({ client, config, children }: PropsWithChildren<FlipFlagProviderProps>) {
-  const configKey = useMemo(() => {
-    if (!config) {
-      return "";
-    }
-    return [
-      config.url,
-      config.sdkKey,
-      config.env ?? "",
-      String(config.refreshIntervalMs ?? ""),
-      String(config.metricsIntervalMs ?? ""),
-      String(config.disableRefresh ?? false),
-      String(config.disableMetrics ?? false),
-    ].join("|");
-  }, [
-    config?.url,
-    config?.sdkKey,
-    config?.env,
-    config?.refreshIntervalMs,
-    config?.metricsIntervalMs,
-    config?.disableRefresh,
-    config?.disableMetrics,
-  ]);
-
-  const clientRef = useRef<FlipFlagClient | null>(null);
-  const ownsRef = useRef(false);
-  const configKeyRef = useRef(configKey);
-
-  if (client) {
-    clientRef.current = client;
-    ownsRef.current = false;
-    configKeyRef.current = configKey;
-  } else {
-    if (!config) {
-      throw new Error("flipFeatureFlagProvider requires client or config");
-    }
-    if (!clientRef.current || configKeyRef.current !== configKey) {
-      if (clientRef.current && ownsRef.current) {
-        clientRef.current.stop();
-      }
-      clientRef.current = createBrowserClient(config);
-      ownsRef.current = true;
-      configKeyRef.current = configKey;
-    }
-  }
-
-  const resolvedClient = clientRef.current;
-  if (!resolvedClient) {
-    throw new Error("flipFeatureFlagProvider requires client or config");
-  }
-  const ownsClient = ownsRef.current;
-
-  const [status, setStatus] = useState<FlagsStatus>(resolvedClient.getStatus());
-
-  useEffect(() => {
-    let mounted = true;
-
-    const handleUpdate = () => {
-      if (mounted) {
-        setStatus(resolvedClient.getStatus());
-      }
-    };
-
-    resolvedClient.on("ready", handleUpdate);
-    resolvedClient.on("update", handleUpdate);
-    resolvedClient.on("error", handleUpdate);
-
-    void resolvedClient.start();
-
-    return () => {
-      mounted = false;
-      resolvedClient.off("ready", handleUpdate);
-      resolvedClient.off("update", handleUpdate);
-      resolvedClient.off("error", handleUpdate);
-      if (ownsClient) {
-        resolvedClient.stop();
-      }
-    };
-  }, [resolvedClient, ownsClient]);
-
-  return (
-    <FlipFlagContext.Provider value={resolvedClient}>
-      <FlipFlagStatusContext.Provider value={status}>{children}</FlipFlagStatusContext.Provider>
-    </FlipFlagContext.Provider>
-  );
-}
-
-export function useFlipFlagClient(): FlipFlagClient {
-  const client = React.useContext(FlipFlagContext);
-  if (!client) {
-    throw new Error("useFlipFlagClient must be used within flipFeatureFlagProvider");
-  }
-  return client;
-}
-
-export function useFlagsStatus(): FlagsStatus {
-  return React.useContext(FlipFlagStatusContext);
-}
-
-export interface FlagValueResult<T = SdkFlagEvaluation["value"]> {
-  value: T;
-  enabled: boolean;
-}
-
-function toFlagResult(evaluation: SdkFlagEvaluation, known: boolean): FlagValueResult {
-  const enabled = known && evaluation.reason !== "disabled";
-  return {
-    value: evaluation.value,
-    enabled,
-  };
-}
-
-export function useFlag(
-  flagKey: string,
-  defaultValue: SdkFlagEvaluation["value"] = false,
-): FlagValueResult {
-  const client = useFlipFlagClient();
-  const [result, setResult] = useState(() =>
-    toFlagResult(client.getVariant(flagKey, defaultValue), client.hasFlag(flagKey)),
-  );
-
-  useEffect(() => {
-    const update = () => {
-      setResult(toFlagResult(client.getVariant(flagKey, defaultValue), client.hasFlag(flagKey)));
-    };
-    client.on("update", update);
-    return () => client.off("update", update);
-  }, [client, flagKey, defaultValue]);
-
-  return result;
-}
-
-export function useVariant(flagKey: string, defaultValue: SdkFlagEvaluation["value"] = false): SdkFlagEvaluation {
-  const client = useFlipFlagClient();
-  const [variant, setVariant] = useState(() => client.getVariant(flagKey, defaultValue));
-
-  useEffect(() => {
-    const update = () => {
-      setVariant(client.getVariant(flagKey, defaultValue));
-    };
-    client.on("update", update);
-    return () => client.off("update", update);
-  }, [client, flagKey, defaultValue]);
-
-  return variant;
-}
-
-export function useAllFlags(): Record<string, SdkFlagEvaluation> {
-  const client = useFlipFlagClient();
-  const [flags, setFlags] = useState(() => client.getAllFlags());
-
-  useEffect(() => {
-    const update = () => setFlags(client.getAllFlags());
-    client.on("update", update);
-    return () => client.off("update", update);
-  }, [client]);
-
-  return flags;
-}
-
-export type { FlipFlagClientOptions } from "@flipfeatureflag/core";
-export { FlipFlagClient } from "@flipfeatureflag/core";

package/tsconfig.json

@@ -1,7 +0,0 @@
-{
-  "extends": "../../tsconfig.base.json",
-  "compilerOptions": {
-    "jsx": "react-jsx"
-  },
-  "include": ["src"]
-}