feat(frontend): launchdarkly tracking on frontend browser (#11076)

<!-- Clearly explain the need for these changes: -->
We struggle to identify where issues are coming from feature flags and
which are from normal use. This adds that split on the frontend.

### Changes 🏗️
Include sentry in the LD initialization
<!-- Concisely describe all of the changes made in this pull request:
-->

### Checklist 📋

#### For code changes:
- [x] I have clearly listed my changes in the PR description
- [x] I have made a test plan
- [x] I have tested my changes according to the test plan:
  <!-- Put your test plan here: -->
- [x] Test that launch darkly flags get attached to the frontend
(browser only)

autogpt_platform/frontend/instrumentation-client.ts

@@ -31,7 +31,7 @@ Sentry.init({
     Sentry.extraErrorDataIntegration(),
     Sentry.browserProfilingIntegration(),
     Sentry.httpClientIntegration(),
-    // Sentry.launchDarklyIntegration(),
+    Sentry.launchDarklyIntegration(),
     Sentry.replayIntegration({
       unmask: [".sentry-unmask, [data-sentry-unmask]"],
     }),

autogpt_platform/frontend/src/services/feature-flags/feature-flag-provider.tsx

@@ -5,6 +5,7 @@ import type { ReactNode } from "react";
 import { useMemo } from "react";
 import { useSupabase } from "@/lib/supabase/hooks/useSupabase";
 import { BehaveAs, getBehaveAs } from "@/lib/utils";
+import * as Sentry from "@sentry/nextjs";
 
 const clientId = process.env.NEXT_PUBLIC_LAUNCHDARKLY_CLIENT_ID;
 const envEnabled = process.env.NEXT_PUBLIC_LAUNCHDARKLY_ENABLED === "true";
@@ -45,7 +46,10 @@ export function LaunchDarklyProvider({ children }: { children: ReactNode }) {
       clientSideID={clientId}
       context={context}
       reactOptions={{ useCamelCaseFlagKeys: false }}
-      options={{ bootstrap: "localStorage" }}
+      options={{
+        bootstrap: "localStorage",
+        inspectors: [Sentry.buildLaunchDarklyFlagUsedHandler()],
+      }}
     >
       {children}
     </LDProvider>