feat: launchdarkly not syntax

packages/ui/app/src/atoms/launchdarkly.ts

@@ -42,19 +42,20 @@ const SET_LAUNCH_DARKLY_INFO_ATOM = atom(undefined, async (get, set, info: Launc
 });
 
 // TODO: support non-boolean flags
-export const useLaunchDarklyFlag = (flag: string): boolean => {
+export const useLaunchDarklyFlag = (flag: string, not = false): boolean => {
     useInitLaunchDarklyClient();
 
     const client = useAtomValue(LD_CLIENT_ATOM);
 
     // TODO: bootstrap the flag value from the server, and/or local storage
     const getFlagEnabled = useCallback(() => {
         if (!client) {
-            return false;
+            return not;
         }
         // force the flag to be a boolean:
-        return !!client.variation(flag, false);
-    }, [client, flag]);
+        const isTrue = !!client.variation(flag, false);
+        return not ? !isTrue : isTrue;
+    }, [client, flag, not]);
 
     const [enabled, setEnabled] = useState(getFlagEnabled);
 

packages/ui/app/src/mdx/components/launchdarkly/LaunchDarkly.tsx

@@ -4,19 +4,16 @@ import { LinkPreloadApiRoute } from "../../../components/LinkPreload";
 
 export interface LaunchDarklyProps {
     flag: string;
+    not?: boolean;
 }
 
-export function LaunchDarkly({ flag, children }: PropsWithChildren<LaunchDarklyProps>): ReactNode {
-    const ldClient = useLaunchDarklyFlag(flag);
-
-    if (!ldClient) {
-        return null;
-    }
+export function LaunchDarkly({ not = false, flag, children }: PropsWithChildren<LaunchDarklyProps>): ReactNode {
+    const show = useLaunchDarklyFlag(flag, not);
 
     return (
         <>
             <LinkPreloadApiRoute href="/api/fern-docs/integrations/launchdarkly" />
-            {children}
+            {show && children}
         </>
     );
 }