diff --git a/src/interface/web/app/agents/page.tsx b/src/interface/web/app/agents/page.tsx
index 697d4f80..4a6c7619 100644
--- a/src/interface/web/app/agents/page.tsx
+++ b/src/interface/web/app/agents/page.tsx
@@ -11,7 +11,7 @@ import {
     UserProfile,
     ModelOptions,
     useUserConfig,
-    SubscriptionStates,
+    isUserSubscribed,
 } from "../common/auth";
 
 import { Lightning, Plus } from "@phosphor-icons/react";
@@ -267,14 +267,7 @@ export default function Agents() {
 
     const modelOptions: ModelOptions[] = userConfig?.chat_model_options || [];
     const selectedChatModelOption: number = userConfig?.selected_chat_model_config || 0;
-    const isSubscribed: boolean =
-        (userConfig?.subscription_state &&
-            [
-                SubscriptionStates.SUBSCRIBED.valueOf(),
-                SubscriptionStates.TRIAL.valueOf(),
-                SubscriptionStates.UNSUBSCRIBED.valueOf(),
-            ].includes(userConfig.subscription_state)) ||
-        false;
+    const isSubscribed: boolean = isUserSubscribed(userConfig);
 
     // The default model option should map to the item in the modelOptions array that has the same id as the selectedChatModelOption
     const defaultModelOption = modelOptions.find(
diff --git a/src/interface/web/app/common/auth.ts b/src/interface/web/app/common/auth.ts
index 8acea392..2ece265d 100644
--- a/src/interface/web/app/common/auth.ts
+++ b/src/interface/web/app/common/auth.ts
@@ -93,3 +93,15 @@ export function useUserConfig(detailed: boolean = false) {
 
     return { userConfig, isLoadingUserConfig };
 }
+
+export function isUserSubscribed(userConfig: UserConfig | null): boolean {
+    return (
+        (userConfig?.subscription_state &&
+            [
+                SubscriptionStates.SUBSCRIBED.valueOf(),
+                SubscriptionStates.TRIAL.valueOf(),
+                SubscriptionStates.UNSUBSCRIBED.valueOf(),
+            ].includes(userConfig.subscription_state)) ||
+        false
+    );
+}