From 9db885b5f7fbaa8408812d584c435046955c5315 Mon Sep 17 00:00:00 2001
From: sabaimran <narmiabas@gmail.com>
Date: Thu, 21 Nov 2024 07:53:24 -0800
Subject: [PATCH] Limit access to chat models to futurist users

---
 .../web/app/components/agentCard/agentCard.tsx  | 17 +++++++++++++----
 1 file changed, 13 insertions(+), 4 deletions(-)

diff --git a/src/interface/web/app/components/agentCard/agentCard.tsx b/src/interface/web/app/components/agentCard/agentCard.tsx
index 3dba4d3a..b151f02d 100644
--- a/src/interface/web/app/components/agentCard/agentCard.tsx
+++ b/src/interface/web/app/components/agentCard/agentCard.tsx
@@ -749,9 +749,20 @@ export function AgentModificationForm(props: AgentModificationFormProps) {
                             <FormItem className="space-y-1 grid gap-2">
                                 <FormLabel>Chat Model</FormLabel>
                                 <FormDescription>
-                                    Which large language model should this agent use?
+                                    {!props.isSubscribed ? (
+                                        <p className="text-secondary-foreground">
+                                            Upgrade to the <a href="/settings">Futurist plan</a> to
+                                            access all models.
+                                        </p>
+                                    ) : (
+                                        <p>Which chat model would you like to use?</p>
+                                    )}
                                 </FormDescription>
-                                <Select onValueChange={field.onChange} defaultValue={field.value}>
+                                <Select
+                                    onValueChange={field.onChange}
+                                    defaultValue={field.value}
+                                    disabled={!props.isSubscribed}
+                                >
                                     <FormControl>
                                         <SelectTrigger className="text-left">
                                             <SelectValue />
@@ -841,7 +852,6 @@ export function AgentModificationForm(props: AgentModificationFormProps) {
                         render={({ field }) => (
                             <FormItem className="space-y-3">
                                 <FormLabel>Color</FormLabel>
-                                <FormDescription>Choose a color for your agent.</FormDescription>
                                 <Select onValueChange={field.onChange} defaultValue={field.value}>
                                     <FormControl>
                                         <SelectTrigger className="w-[200px]">
@@ -876,7 +886,6 @@ export function AgentModificationForm(props: AgentModificationFormProps) {
                         render={({ field }) => (
                             <FormItem className="space-y-3">
                                 <FormLabel>Icon</FormLabel>
-                                <FormDescription>Choose an icon for your agent.</FormDescription>
                                 <Select onValueChange={field.onChange} defaultValue={field.value}>
                                     <FormControl>
                                         <SelectTrigger className="w-[200px]">