feature flags

client/package.json

@@ -19,6 +19,7 @@
     "@hookform/resolvers": "5.0.1",
     "@icons-pack/react-simple-icons": "^13.6.0",
     "@marsidev/react-turnstile": "^1.3.1",
+    "@monaco-editor/react": "^4.7.0",
     "@nivo/bar": "0.96.0",
     "@nivo/calendar": "0.96.0",
     "@nivo/line": "0.96.0",

client/src/api/analytics/endpoints/experiments.ts

@@ -0,0 +1,139 @@
+import { authedFetch } from "../../utils";
+import type {
+  FeatureFlagConditionSet,
+  FeatureFlagPayloadValue,
+  FeatureFlagRuntime,
+  FeatureFlagType,
+  FeatureFlagVariant,
+} from "./featureFlags";
+import { CommonApiParams, toQueryParams } from "./types";
+
+export type ExperimentStatus = "draft" | "running" | "paused" | "completed";
+
+export type ExperimentFeatureFlag = {
+  flagId: number;
+  siteId: number;
+  key: string;
+  description: string | null;
+  enabled: boolean;
+  runtime: FeatureFlagRuntime;
+  flagType: FeatureFlagType;
+  payload?: FeatureFlagPayloadValue | null;
+  variants: FeatureFlagVariant[];
+  rolloutPercentage: number;
+  conditionSets: FeatureFlagConditionSet[];
+  version: number;
+  createdAt: string;
+  updatedAt: string;
+};
+
+export type ExperimentGoal = {
+  goalId: number;
+  siteId: number;
+  name: string | null;
+  goalType: "path" | "event";
+  config: {
+    pathPattern?: string;
+    eventName?: string;
+    eventPropertyKey?: string;
+    eventPropertyValue?: string | number | boolean;
+    propertyFilters?: Array<{
+      key: string;
+      value: string | number | boolean;
+    }>;
+  };
+  createdAt: string;
+};
+
+export type Experiment = {
+  experimentId: number;
+  siteId: number;
+  featureFlagId: number;
+  primaryGoalId: number | null;
+  name: string;
+  description: string | null;
+  hypothesis: string | null;
+  status: ExperimentStatus;
+  winningVariant: string | null;
+  startedAt: string | null;
+  endedAt: string | null;
+  createdAt: string;
+  updatedAt: string;
+  featureFlag: ExperimentFeatureFlag;
+  primaryGoal: ExperimentGoal | null;
+};
+
+export type ExperimentPayload = {
+  name: string;
+  description?: string | null;
+  hypothesis?: string | null;
+  featureFlagId: number;
+  primaryGoalId?: number | null;
+  status: ExperimentStatus;
+  winningVariant?: string | null;
+};
+
+export type ExperimentUpdatePayload = Partial<ExperimentPayload>;
+
+export type ExperimentVariantResult = {
+  variant: string;
+  sessions: number;
+  exposures: number;
+  conversions: number;
+  conversionRate: number;
+  lift: number | null;
+  isControl: boolean;
+};
+
+export type ExperimentResults = {
+  experiment: Experiment;
+  variants: ExperimentVariantResult[];
+  totalExposureSessions: number;
+  totalConversions: number;
+  hasGoal: boolean;
+  measurement: "exposure" | "assignment";
+};
+
+export async function fetchExperiments(site: string | number): Promise<Experiment[]> {
+  const response = await authedFetch<{ data: Experiment[] }>(`/sites/${site}/experiments`);
+  return response.data;
+}
+
+export async function createExperiment(
+  site: string | number,
+  payload: ExperimentPayload
+): Promise<{ success: boolean; data: Experiment }> {
+  return authedFetch(`/sites/${site}/experiments`, undefined, {
+    method: "POST",
+    data: payload,
+  });
+}
+
+export async function updateExperiment(
+  site: string | number,
+  experimentId: number,
+  payload: ExperimentUpdatePayload
+): Promise<{ success: boolean; data: Experiment }> {
+  return authedFetch(`/sites/${site}/experiments/${experimentId}`, undefined, {
+    method: "PUT",
+    data: payload,
+  });
+}
+
+export async function deleteExperiment(site: string | number, experimentId: number): Promise<{ success: boolean }> {
+  return authedFetch(`/sites/${site}/experiments/${experimentId}`, undefined, {
+    method: "DELETE",
+  });
+}
+
+export async function fetchExperimentResults(
+  site: string | number,
+  experimentId: number,
+  params: CommonApiParams
+): Promise<ExperimentResults> {
+  const response = await authedFetch<{ data: ExperimentResults }>(
+    `/sites/${site}/experiments/${experimentId}/results`,
+    toQueryParams(params)
+  );
+  return response.data;
+}

client/src/api/analytics/endpoints/featureFlags.ts

@@ -0,0 +1,118 @@
+import { authedFetch } from "../../utils";
+
+export type FeatureFlagType = "boolean" | "multivariate" | "remote_config";
+export type FeatureFlagRuntime = "client" | "server" | "both";
+export type FeatureFlagPayloadValue =
+  | string
+  | number
+  | boolean
+  | null
+  | FeatureFlagPayloadValue[]
+  | { [key: string]: FeatureFlagPayloadValue };
+
+export type FeatureFlagRule = {
+  field:
+    | "hostname"
+    | "pathname"
+    | "query"
+    | "referrer"
+    | "language"
+    | "country"
+    | "region"
+    | "city"
+    | "device_type"
+    | "user_id"
+    | "trait";
+  key?: string;
+  operator: "equals" | "not_equals" | "contains" | "starts_with" | "ends_with" | "regex";
+  value: string | number | boolean | Array<string | number | boolean>;
+};
+
+export type FeatureFlagVariant = {
+  key: string;
+  name?: string;
+  rolloutPercentage: number;
+  payload?: FeatureFlagPayloadValue;
+};
+
+export type FeatureFlagConditionSet = {
+  name?: string;
+  rules: FeatureFlagRule[];
+  rolloutPercentage?: number;
+  variants?: FeatureFlagVariant[];
+  payload?: FeatureFlagPayloadValue | null;
+};
+
+export type FeatureFlagStats = {
+  flag_key: string;
+  flag_value: string;
+  sessions: number;
+  events: number;
+  exposures: number;
+};
+
+export type FeatureFlag = {
+  flagId: number;
+  siteId: number;
+  key: string;
+  description: string | null;
+  enabled: boolean;
+  runtime: FeatureFlagRuntime;
+  flagType: FeatureFlagType;
+  payload?: FeatureFlagPayloadValue | null;
+  variants: FeatureFlagVariant[];
+  rolloutPercentage: number;
+  rules: FeatureFlagRule[];
+  conditionSets: FeatureFlagConditionSet[];
+  version: number;
+  createdAt: string;
+  updatedAt: string;
+  stats: FeatureFlagStats[];
+};
+
+export type FeatureFlagPayload = {
+  key: string;
+  description?: string | null;
+  enabled: boolean;
+  runtime: FeatureFlagRuntime;
+  flagType: FeatureFlagType;
+  payload?: FeatureFlagPayloadValue | null;
+  variants: FeatureFlagVariant[];
+  rolloutPercentage: number;
+  rules: FeatureFlagRule[];
+  conditionSets: FeatureFlagConditionSet[];
+};
+
+export type FeatureFlagUpdatePayload = Partial<FeatureFlagPayload>;
+
+export async function fetchFeatureFlags(site: string | number): Promise<FeatureFlag[]> {
+  const response = await authedFetch<{ data: FeatureFlag[] }>(`/sites/${site}/feature-flags`);
+  return response.data;
+}
+
+export async function createFeatureFlag(
+  site: string | number,
+  payload: FeatureFlagPayload
+): Promise<{ success: boolean; data: FeatureFlag }> {
+  return authedFetch(`/sites/${site}/feature-flags`, undefined, {
+    method: "POST",
+    data: payload,
+  });
+}
+
+export async function updateFeatureFlag(
+  site: string | number,
+  flagId: number,
+  payload: FeatureFlagUpdatePayload
+): Promise<{ success: boolean; data: FeatureFlag }> {
+  return authedFetch(`/sites/${site}/feature-flags/${flagId}`, undefined, {
+    method: "PUT",
+    data: payload,
+  });
+}
+
+export async function deleteFeatureFlag(site: string | number, flagId: number): Promise<{ success: boolean }> {
+  return authedFetch(`/sites/${site}/feature-flags/${flagId}`, undefined, {
+    method: "DELETE",
+  });
+}

client/src/api/analytics/endpoints/index.ts

@@ -63,6 +63,40 @@ export type {
   UpdateGoalParams,
 } from "./goals";
 
+// Feature flag endpoints
+export { fetchFeatureFlags, createFeatureFlag, updateFeatureFlag, deleteFeatureFlag } from "./featureFlags";
+export type {
+  FeatureFlag,
+  FeatureFlagConditionSet,
+  FeatureFlagPayload,
+  FeatureFlagPayloadValue,
+  FeatureFlagRule,
+  FeatureFlagRuntime,
+  FeatureFlagStats,
+  FeatureFlagType,
+  FeatureFlagUpdatePayload,
+  FeatureFlagVariant,
+} from "./featureFlags";
+
+// Experiment endpoints
+export {
+  createExperiment,
+  deleteExperiment,
+  fetchExperimentResults,
+  fetchExperiments,
+  updateExperiment,
+} from "./experiments";
+export type {
+  Experiment,
+  ExperimentFeatureFlag,
+  ExperimentGoal,
+  ExperimentPayload,
+  ExperimentResults,
+  ExperimentStatus,
+  ExperimentUpdatePayload,
+  ExperimentVariantResult,
+} from "./experiments";
+
 // Funnels endpoints
 export { fetchFunnels, analyzeFunnel, fetchFunnelStepSessions, saveFunnel, deleteFunnel } from "./funnels";
 export type {