Merge pull request #640 from makeplane/preview

release: v1.3.0-rc9

web/app/[workspaceSlug]/(projects)/active-cycles/header.tsx

@@ -23,7 +23,7 @@ export const WorkspaceActiveCycleHeader = observer(() => (
             }
           />
         </Breadcrumbs>
-        <UpgradeBadge size="md" />
+        <UpgradeBadge size="md" flag="WORKSPACE_ACTIVE_CYCLES" />
       </div>
     </div>
   </div>

web/core/components/workspace/sidebar/workspace-menu.tsx

@@ -126,7 +126,7 @@ export const SidebarWorkspaceMenu = observer(() => {
                         </div>
                         {!sidebarCollapsed && link.key === "active-cycles" && (
                           <div className="flex-shrink-0">
-                            <UpgradeBadge />
+                            <UpgradeBadge flag="WORKSPACE_ACTIVE_CYCLES" />
                           </div>
                         )}
                       </div>

web/core/constants/swr-config.ts

@@ -3,6 +3,5 @@ export const SWR_CONFIG = {
   revalidateIfStale: true,
   revalidateOnFocus: true,
   revalidateOnMount: true,
-  refreshInterval: 600000,
   errorRetryCount: 3,
 };

web/core/layouts/auth-layout/workspace-wrapper.tsx

@@ -37,7 +37,7 @@ export const WorkspaceAuthWrapper: FC<IWorkspaceAuthWrapper> = observer((props)
     workspace: { fetchWorkspaceMembers },
   } = useMember();
   const { workspaces } = useWorkspace();
-  const { loader: featureFlagsLoader, fetchFeatureFlags } = useFeatureFlags();
+  const { fetchFeatureFlags } = useFeatureFlags();
   const { isMobile } = usePlatformOS();
 
   const planeLogo = resolvedTheme === "dark" ? PlaneWhiteLogo : PlaneBlackLogo;
@@ -46,10 +46,10 @@ export const WorkspaceAuthWrapper: FC<IWorkspaceAuthWrapper> = observer((props)
     (allWorkspaces && allWorkspaces.find((workspace) => workspace?.slug === workspaceSlug)) || undefined;
 
   // fetching feature flags
-  useSWR(
+  const { isLoading: featureFlagsLoader } = useSWR(
     workspaceSlug && currentUser ? `WORKSPACE_FEATURE_FLAGS_${workspaceSlug}_${currentUser.id}` : null,
     workspaceSlug && currentUser ? () => fetchFeatureFlags(workspaceSlug.toString(), currentUser.id) : null,
-    { revalidateIfStale: false, revalidateOnFocus: false }
+    { revalidateOnFocus: false }
   );
 
   // fetching user workspace information

web/ee/components/workspace/upgrade-badge.tsx

@@ -4,20 +4,24 @@ import { observer } from "mobx-react";
 import { cn } from "@/helpers/common.helper";
 // store
 import { useWorkspaceSubscription } from "@/plane-web/hooks/store";
+// plane web hooks
+import { E_FEATURE_FLAGS, useFlag } from "@/plane-web/hooks/store/use-flag";
 
 type TUpgradeBadge = {
   className?: string;
   size?: "sm" | "md";
+  flag?: keyof typeof E_FEATURE_FLAGS;
 };
 
 export const UpgradeBadge: FC<TUpgradeBadge> = observer((props) => {
-  const { className, size = "sm" } = props;
+  const { className, size = "sm", flag } = props;
   // store hooks
   const { currentWorkspaceSubscribedPlanDetail } = useWorkspaceSubscription();
   // derived values
+  const isFeatureEnabled = flag ? useFlag(flag) : false;
   const isSubscribedToPro = currentWorkspaceSubscribedPlanDetail?.product === "PRO";
 
-  if (!currentWorkspaceSubscribedPlanDetail || isSubscribedToPro) {
+  if (!currentWorkspaceSubscribedPlanDetail || isFeatureEnabled || isSubscribedToPro) {
     return null;
   }
 

web/ee/store/feature-flags/feature-flags.store.ts

@@ -11,18 +11,15 @@ type TFeatureFlagsMaps = {
 };
 
 export interface IFeatureFlagsStore {
-  loader: boolean;
   flags: TFeatureFlagsMaps;
   fetchFeatureFlags: (workspaceSlug: string, userId: string) => Promise<TFeatureFlagsResponse>;
 }
 
 export class FeatureFlagsStore implements IFeatureFlagsStore {
-  loader = false;
   flags: TFeatureFlagsMaps = {};
 
   constructor() {
     makeObservable(this, {
-      loader: observable.ref,
       flags: observable,
       fetchFeatureFlags: action,
     });
@@ -30,7 +27,6 @@ export class FeatureFlagsStore implements IFeatureFlagsStore {
 
   fetchFeatureFlags = async (workspaceSlug: string, userId: string) => {
     try {
-      set(this, "loader", true);
       const response = await featureFlagService.getFeatureFlags({ workspace_slug: workspaceSlug, user_id: userId });
       runInAction(() => {
         if (response.values) {
@@ -38,11 +34,9 @@ export class FeatureFlagsStore implements IFeatureFlagsStore {
             set(this.flags, key, response.values[key]);
           });
         }
-        set(this, "loader", false);
       });
       return response;
     } catch (error) {
-      set(this, "loader", false);
       console.error("Error fetching feature flags", error);
       throw error;
     }