feat: add feature flag for chat

instill-ai · Nov 28, 2024 · af35764 · af35764
1 parent 92734df
commit af35764
Show file tree

Hide file tree

Showing 7 changed files with 25 additions and 49 deletions.
diff --git a/apps/console/src/app/(providers)/root-provider.tsx b/apps/console/src/app/(providers)/root-provider.tsx
@@ -19,29 +19,23 @@ import { ReactQueryProvider } from "./react-query-client-provider";
 
 const selector = (store: InstillStore) => ({
   initPipelineBuilder: store.initPipelineBuilder,
-  updateFeatureFlagWebhookEnabled: store.updateFeatureFlagWebhookEnabled,
-  updateFeatureFlagApplicationEnabled:
-    store.updateFeatureFlagApplicationEnabled,
+  updateFeatureFlagChatEnabled: store.updateFeatureFlagChatEnabled,
 });
 
 export const RootProvider = ({
   children,
-  featureFlagWebhookEnabled,
-  featureFlagApplicationEnabled,
+  featureFlagChatEnabled,
 }: {
   children: React.ReactNode;
-  featureFlagWebhookEnabled: boolean;
-  featureFlagApplicationEnabled: boolean;
+  featureFlagChatEnabled: boolean;
 }) => {
   const pathname = usePathname();
   const [previousPathname, setPreviousPathname] =
     React.useState<Nullable<string>>(null);
 
-  const {
-    initPipelineBuilder,
-    updateFeatureFlagWebhookEnabled,
-    updateFeatureFlagApplicationEnabled,
-  } = useInstillStore(useShallow(selector));
+  const { initPipelineBuilder, updateFeatureFlagChatEnabled } = useInstillStore(
+    useShallow(selector),
+  );
 
   const initCreateResourceFormStore = useCreateResourceFormStore(
     (store) => store.init,
@@ -52,12 +46,8 @@ export const RootProvider = ({
   const { dismiss: dismissToast } = useToast();
 
   React.useEffect(() => {
-    updateFeatureFlagWebhookEnabled(() => featureFlagWebhookEnabled);
-  }, [featureFlagWebhookEnabled, updateFeatureFlagWebhookEnabled]);
-
-  React.useEffect(() => {
-    updateFeatureFlagApplicationEnabled(() => featureFlagApplicationEnabled);
-  }, [featureFlagApplicationEnabled, updateFeatureFlagApplicationEnabled]);
+    updateFeatureFlagChatEnabled(() => featureFlagChatEnabled);
+  }, [featureFlagChatEnabled, updateFeatureFlagChatEnabled]);
 
   React.useEffect(() => {
     // When ever user leave /editor page to what ever destination

diff --git a/apps/console/src/app/layout.tsx b/apps/console/src/app/layout.tsx
@@ -54,12 +54,7 @@ export default function RootLayout({
       </head>
       <body className="overflow-y-hidden">
         <RootProvider
-          featureFlagWebhookEnabled={
-            process.env.FEATURE_FLAG_WEBHOOK_ENABLED === "1"
-          }
-          featureFlagApplicationEnabled={
-            process.env.FEATURE_FLAG_APPLICATION_ENABLED === "1"
-          }
+          featureFlagChatEnabled={process.env.FEATURE_FLAG_CHAT_ENABLED === "1"}
         >
           {children}
         </RootProvider>

diff --git a/packages/toolkit/src/components/top-bar/AppTopbar.tsx b/packages/toolkit/src/components/top-bar/AppTopbar.tsx
@@ -24,6 +24,7 @@ import { NavLinks } from "./NavLinks";
 const selector = (store: InstillStore) => ({
   accessToken: store.accessToken,
   enabledQuery: store.enabledQuery,
+  featureFlagChatEnabled: store.featureFlagChatEnabled,
 });
 
 export const AppTopbar = ({
@@ -41,7 +42,9 @@ export const AppTopbar = ({
 }) => {
   const pathname = usePathname();
   const router = useRouter();
-  const { accessToken, enabledQuery } = useInstillStore(useShallow(selector));
+  const { accessToken, enabledQuery, featureFlagChatEnabled } = useInstillStore(
+    useShallow(selector),
+  );
 
   const me = useAuthenticatedUser({
     enabled: enabledQuery,
@@ -111,7 +114,7 @@ export const AppTopbar = ({
           </div>
         </div>
         <div className="flex flex-1 flex-row justify-end">
-          <ChatLink />
+          {featureFlagChatEnabled ? <ChatLink /> : null}
           {topbarControllerChildren ? (
             topbarControllerChildren
           ) : isCloud ? (

diff --git a/packages/toolkit/src/components/top-bar/NavLinks.tsx b/packages/toolkit/src/components/top-bar/NavLinks.tsx
@@ -131,12 +131,12 @@ export const NavLink = ({
 const navLinksSelector = (store: InstillStore) => ({
   accessToken: store.accessToken,
   enabledQuery: store.enabledQuery,
-  featureFlagApplicationEnabled: store.featureFlagApplicationEnabled,
 });
 
 export const NavLinks = ({ isExploreRoute }: { isExploreRoute?: boolean }) => {
-  const { accessToken, enabledQuery, featureFlagApplicationEnabled } =
-    useInstillStore(useShallow(navLinksSelector));
+  const { accessToken, enabledQuery } = useInstillStore(
+    useShallow(navLinksSelector),
+  );
   const me = useAuthenticatedUser({
     enabled: enabledQuery,
     accessToken,
@@ -149,7 +149,7 @@ export const NavLinks = ({ isExploreRoute }: { isExploreRoute?: boolean }) => {
       {me.isSuccess
         ? navLinkItems
             .filter((item) => {
-              if (isCloud && featureFlagApplicationEnabled) {
+              if (isCloud) {
                 return true;
               }
               return item.pathname !== "applications";

diff --git a/packages/toolkit/src/lib/use-instill-store/featureFlagSlice.ts b/packages/toolkit/src/lib/use-instill-store/featureFlagSlice.ts
@@ -8,20 +8,12 @@ export const createFeatureFlagSlice: StateCreator<
   [],
   FeatureFlagSlice
 > = (set) => ({
-  featureFlagWebhookEnabled: false,
-  updateFeatureFlagWebhookEnabled: (fn: (prev: boolean) => boolean) =>
+  featureFlagChatEnabled: false,
+  updateFeatureFlagChatEnabled: (fn: (prev: boolean) => boolean) =>
     set((state) => {
       return {
         ...state,
-        featureFlagWebhookEnabled: fn(state.featureFlagWebhookEnabled),
-      };
-    }),
-  featureFlagApplicationEnabled: false,
-  updateFeatureFlagApplicationEnabled: (fn: (prev: boolean) => boolean) =>
-    set((state) => {
-      return {
-        ...state,
-        featureFlagApplicationEnabled: fn(state.featureFlagApplicationEnabled),
+        featureFlagChatEnabled: fn(state.featureFlagChatEnabled),
       };
     }),
 });
diff --git a/packages/toolkit/src/lib/use-instill-store/types.ts b/packages/toolkit/src/lib/use-instill-store/types.ts
@@ -273,10 +273,8 @@ export type EditorSlice = {
 };
 
 export type FeatureFlagSlice = {
-  featureFlagWebhookEnabled: boolean;
-  updateFeatureFlagWebhookEnabled: (fn: (prev: boolean) => boolean) => void;
-  featureFlagApplicationEnabled: boolean;
-  updateFeatureFlagApplicationEnabled: (fn: (prev: boolean) => boolean) => void;
+  featureFlagChatEnabled: boolean;
+  updateFeatureFlagChatEnabled: (fn: (prev: boolean) => boolean) => void;
 };
 
 export type TriggerPipelineStreamMap = {

diff --git a/packages/toolkit/src/view/recipe-editor/flow/nodes/RunOnEventNode.tsx b/packages/toolkit/src/view/recipe-editor/flow/nodes/RunOnEventNode.tsx
@@ -17,7 +17,6 @@ import { NodeBase } from "./NodeBase";
 
 const selector = (store: InstillStore) => ({
   selectedComponentId: store.selectedComponentId,
-  featureFlagWebhookEnabled: store.featureFlagWebhookEnabled,
   flowIsUnderDemoMode: store.flowIsUnderDemoMode,
   updateEditorMultiScreenModel: store.updateEditorMultiScreenModel,
   accessToken: store.accessToken,
@@ -41,7 +40,6 @@ export const RunOnEventNode = ({ id, data }: NodeProps<RunOnEventNodeData>) => {
 
   const {
     selectedComponentId,
-    featureFlagWebhookEnabled,
     updateSelectedComponentId,
     updateEditorMultiScreenModel,
     enabledQuery,
@@ -108,7 +106,7 @@ export const RunOnEventNode = ({ id, data }: NodeProps<RunOnEventNodeData>) => {
     }));
   }, [id, updateSelectedComponentId]);
 
-  return featureFlagWebhookEnabled ? (
+  return (
     <NodeBase
       id={id}
       isSelected={isSelected}
@@ -131,5 +129,5 @@ export const RunOnEventNode = ({ id, data }: NodeProps<RunOnEventNodeData>) => {
         <Icons.Lightning02 className="w-6 h-6 stroke-semantic-secondary-hover" />
       </div>
     </NodeBase>
-  ) : null;
+  );
 };