feat: hide slack behind feature flag (#1011)

* feat: hide slack behind feature flag

* feat: remove log

* feat: fix comments

* feat: add slack redirect uri

Author: olzhik11

frontend/app/project/[projectId]/settings/page.tsx

@@ -5,6 +5,7 @@ import { getServerSession } from "next-auth";
 import Settings from "@/components/settings/settings";
 import { getApiKeys } from "@/lib/actions/project-api-keys";
 import { authOptions } from "@/lib/auth";
+import { Feature, isFeatureEnabled } from "@/lib/features/features";
 
 export const metadata: Metadata = {
   title: "Settings",
@@ -19,14 +20,14 @@ export default async function ApiKeysPage(props: { params: Promise<{ projectId:
   }
 
   const apiKeys = await getApiKeys({ projectId: params.projectId });
+  const isSlackEnabled = isFeatureEnabled(Feature.SLACK);
 
   return (
-    <>
-      <Settings
-        slackClientId={process.env.SLACK_CLIENT_ID}
-        slackRedirectUri={process.env.SLACK_REDIRECT_URL}
-        apiKeys={apiKeys}
-      />
-    </>
+    <Settings
+      isSlackEnabled={isSlackEnabled}
+      slackClientId={process.env.SLACK_CLIENT_ID}
+      slackRedirectUri={process.env.SLACK_REDIRECT_URL}
+      apiKeys={apiKeys}
+    />
   );
 }

frontend/components/settings/settings.tsx

@@ -28,6 +28,7 @@ import TraceSummarySettings from "./trace-summary-settings";
 
 interface SettingsProps {
   apiKeys: ProjectApiKey[];
+  isSlackEnabled: boolean;
   slackClientId?: string;
   slackRedirectUri?: string;
 }
@@ -44,7 +45,7 @@ const tabs: { id: SettingsTab; label: string; icon: ReactNode }[] = [
 
 const sidebarStyle = { "--sidebar-width": "auto" } as CSSProperties;
 
-export default function Settings({ apiKeys, slackClientId, slackRedirectUri }: SettingsProps) {
+export default function Settings({ apiKeys, isSlackEnabled, slackClientId, slackRedirectUri }: SettingsProps) {
   const searchParams = useSearchParams();
   const [activeTab, setActiveTab] = useState<SettingsTab>((searchParams.get("tab") as SettingsTab) || "general");
   const pathName = usePathname();
@@ -57,9 +58,9 @@ export default function Settings({ apiKeys, slackClientId, slackRedirectUri }: S
         if (t.id === "trace-summary" && workspace?.tierName === "Free") {
           return false;
         }
-        return !(t.id === "integrations" && workspace?.tierName !== "Pro");
+        return !(t.id === "integrations" && (workspace?.tierName !== "Pro" || !isSlackEnabled));
       }),
-    [workspace]
+    [workspace, isSlackEnabled]
   );
 
   const renderContent = () => {
@@ -79,9 +80,15 @@ export default function Settings({ apiKeys, slackClientId, slackRedirectUri }: S
       case "provider-api-keys":
         return <ProviderApiKeys />;
       case "trace-summary":
-        return <TraceSummarySettings />;
+        if (workspace?.tierName !== "Free") {
+          return <TraceSummarySettings />;
+        }
+        return null;
       case "integrations":
-        return <Integrations slackClientId={slackClientId} slackRedirectUri={slackRedirectUri} />;
+        if (workspace?.tierName === "Pro" && isSlackEnabled) {
+          return <Integrations slackClientId={slackClientId} slackRedirectUri={slackRedirectUri} />;
+        }
+        return null;
     }
   };
 

frontend/lib/features/features.ts

@@ -10,7 +10,8 @@ export const enum Feature {
   LOCAL_DB = "LOCAL_DB",
   FULL_BUILD = "FULL_BUILD",
   SUBSCRIPTION = "SUBSCRIPTION",
-  LANDING = "LANDING"
+  SLACK = "SLACK",
+  LANDING = "LANDING",
 }
 
 // right now all managed-version features are disabled in local environment
@@ -32,7 +33,11 @@ export const isFeatureEnabled = (feature: Feature) => {
   }
 
   if (feature === Feature.AZURE_AUTH) {
-    return !!process.env.AUTH_AZURE_AD_CLIENT_ID && !!process.env.AUTH_AZURE_AD_CLIENT_SECRET && !!process.env.AUTH_AZURE_AD_TENANT_ID;
+    return (
+      !!process.env.AUTH_AZURE_AD_CLIENT_ID &&
+      !!process.env.AUTH_AZURE_AD_CLIENT_SECRET &&
+      !!process.env.AUTH_AZURE_AD_TENANT_ID
+    );
   }
 
   if (feature === Feature.FULL_BUILD) {
@@ -44,15 +49,22 @@ export const isFeatureEnabled = (feature: Feature) => {
   }
 
   if (feature === Feature.SUBSCRIPTION) {
-    return (
-      process.env.ENVIRONMENT === "PRODUCTION" &&
-      !!process.env.STRIPE_SECRET_KEY
-    );
+    return process.env.ENVIRONMENT === "PRODUCTION" && !!process.env.STRIPE_SECRET_KEY;
   }
 
   if (feature === Feature.SEND_EMAIL) {
     return !!process.env.RESEND_API_KEY;
   }
 
+  if (feature === Feature.SLACK) {
+    return (
+      process.env.ENVIRONMENT === "PRODUCTION" &&
+      !!process.env.SLACK_CLIENT_ID &&
+      !!process.env.SLACK_CLIENT_SECRET &&
+      !!process.env.SLACK_SIGNING_SECRET &&
+      !!process.env.SLACK_REDIRECT_URL
+    );
+  }
+
   return process.env.ENVIRONMENT === "PRODUCTION";
 };