fix

Chat.go

@@ -289,7 +289,7 @@ func generateWelcomeChatHTML() string {
 	}
 	NextMessages = append(NextMessages, nextMsg)
 
-	botOut, err := botTmpl.Execute(pongo2.Context{"Messages": NextMessages, "ConversationAreaId": 0, "NotClickable": true})
+	botOut, err := botTmpl.Execute(pongo2.Context{"Messages": NextMessages, "ConversationAreaId": 0, "NotClickable": true, "DontShowName": true})
 	if err != nil {
 		fmt.Println("Error executing bot template")
 		panic(err)
@@ -334,7 +334,7 @@ func generateHelpChatHTML() string {
 	}
 	NextMessages = append(NextMessages, nextMsg)
 
-	botOut, err := botTmpl.Execute(pongo2.Context{"Messages": NextMessages, "ConversationAreaId": 0, "NotClickable": true})
+	botOut, err := botTmpl.Execute(pongo2.Context{"Messages": NextMessages, "ConversationAreaId": 0, "NotClickable": true, "DontShowName": true})
 	if err != nil {
 		fmt.Println("Error executing bot template")
 		panic(err)
@@ -383,7 +383,7 @@ func generateEnterKeyChatHTML() string {
 	}
 	NextMessages = append(NextMessages, nextMsg)
 
-	botOut, err := botTmpl.Execute(pongo2.Context{"Messages": NextMessages, "ConversationAreaId": 0, "NotClickable": true})
+	botOut, err := botTmpl.Execute(pongo2.Context{"Messages": NextMessages, "ConversationAreaId": 0, "NotClickable": true, "DontShowName": true})
 	if err != nil {
 		fmt.Println("Error executing bot template")
 		panic(err)
@@ -463,7 +463,7 @@ func generateTermAndServiceChatHTML() string {
 	}
 	NextMessages = append(NextMessages, nextMsg)
 
-	botOut, err := botTmpl.Execute(pongo2.Context{"Messages": NextMessages, "ConversationAreaId": 0, "NotClickable": true})
+	botOut, err := botTmpl.Execute(pongo2.Context{"Messages": NextMessages, "ConversationAreaId": 0, "NotClickable": true, "DontShowName": true})
 	if err != nil {
 		fmt.Println("Error executing bot template")
 		panic(err)
@@ -842,7 +842,7 @@ func LoadSettingsHandler(c *fiber.Ctx) error {
 	// Percent encoding of the email
 	user.Email = url.QueryEscape(user.Email)
 
-	stripeSubLink := "https://billing.stripe.com/p/login/test_eVa5kC1q7dogaaIcMM?prefilled_email=" + user.Email
+	stripeSubLink := "https://billing.stripe.com/p/login/6oE6sc0PTfvq1Hi288?prefilled_email=" + user.Email
 
 	openaiExists, anthropicExists, mistralExists, groqExists, gooseaiExists, googleExists := getExistingKeys(c)
 	isPremium, isBasic := IsCurrentUserSubscribed(c)

Stripe.go

@@ -58,7 +58,7 @@ func generatePricingTableChatHTML(c *fiber.Ctx) string {
 	}
 	NextMessages = append(NextMessages, nextMsg)
 
-	botOut, err := botTmpl.Execute(pongo2.Context{"Messages": NextMessages, "ConversationAreaId": 0, "NotClickable": true, "notFlex": true})
+	botOut, err := botTmpl.Execute(pongo2.Context{"Messages": NextMessages, "ConversationAreaId": 0, "NotClickable": true, "notFlex": true, "DontShowName": true})
 	if err != nil {
 		fmt.Println("Error executing template")
 		panic(err)

views/partials/chat-input.html

@@ -1,4 +1,4 @@
-{% if IsSubscribed or not IsLimiteReached %}
+{% if IsSubscribed or not IsLimiteReached or not IsLogin %}
 <div class="chat-input-container mb-5">
     <div class="textarea-wrapper">
         <div class="control" id="textarea-control">

views/partials/explain-llm-conv-chat.html

@@ -1,34 +1,91 @@
-<h2>JADE is the first Multi-Models chatbot.</h2>
+<h2>JADE: The First Multi-Model Chatbot</h2>
-<p>It was build with simplicity in mind. The goal being to have a minimalist chatbot for all models.</p>
+<p>JADE was built with simplicity in mind. The goal is to have a minimalist chatbot that supports all models without
-<p>I don't want fancy stuff like importing files or images. I want the chatbot to be as simple as possible.</p>
+    unnecessary features like importing files or images. This focus on simplicity allows us to improve how we use AI
-<p>Following this philosophy, I was able to focus on other way to improve the current way we use AI chatbots.</p>
+    chatbots in other ways.</p>
-<p>My first complain was that there is a lot of models, and they are all good at different things.</p>
+
-<p>But if you want to use all of them, it get impractical and very expensive.</p>
+<p>One of my main concerns was the variety of models available, each excelling in different areas. Using all of them can
+    be impractical and very expensive.</p>
 
 <h2>Multi-Models</h2>
-<p>So I decided to focus my chatbot on this and created the first Multi-Models chatbot.</p>
+<p>To address this, I created the first Multi-Model chatbot. The idea is to use multiple models within the same
-<p>The idea is to use multiple models in the same conversation.</p>
+    conversation. Here are the key points:</p>
-<p>There is 2 things to understand about this:</p>
+<ol>
-<p>1. When asking a question, you can ask it to multiple models. You can them compare and pick the best one.</p>
+    <li>When asking a question, you can query multiple models and compare their responses to choose the best one.</li>
-<p>2. The next message will use the text of the selected message for all models. So the response from GPT4 can be then
+    <li>The selected response can be used as the basis for the next message across all models. For example, a response
-    use by Claude Haiku for example.</p>
+        from GPT-4 can be used by Claude Haiku in the next interaction.</li>
+</ol>
+
+<h2>API Keys</h2>
+<p>To use JADE, you need to sign up for an API key to providers. There is 5 providers available:</p>
+<ul>
+    <li>OpenAI</li>
+    <li>Anthropic</li>
+    <li>Mistral</li>
+    <li>Groq</li>
+    <li>Google</li>
+    <li>Custom endpoint (premium)</li>
+    <li>GooseAI (coming soon)</li>
+</ul>
+<p>You can enter an API key in the settings menu. One enter you get access to all models from this provider. Check the
+    appendix for more details about available models.</p>
 
 <h2>Bots</h2>
-<p>Once an API key enter, you have access to all models from that provider.</p>
+<p>Once you enter an API key, you gain access to all models from that provider. In the Bots menu (next to the send
-<p>If you open the Bots menu (next to send), you will find a list of all your Bots. A bot have a name, a model and some
+    button), you'll find a list of all your Bots.</p>
-    parameters.</p>
+<p>To create a new bot, click the "+" button, enter a name and a model, and optionally set a temperature and a system
-<p>You can create a new bot by clicking on the "+" button. And enter a name and a model. Additionaly, you can add choose
+    prompt. Once created, you can select a bot by clicking on it and reorder it by dragging. Hold SHIFT and click to
-    a temperature and a system prompt.</p>
+    select multiple bots. You can delete selected bots by clicking the trash can icon.</p>
-<p>Once created, you can select it by clicking on it and order it by draging it. You can keep SHIFT pressed and click on
-    2 Bots to select them and all in between.</p>
-<p>You can also delete selected Bots by clicking on the trash can.</p>
 
-<h2>Conversation</h2>
+<h2>Conversations</h2>
-<p>A conversation is a list of messages. You have a Default conversation that is created when you first sign in.</p>
+<p>A conversation is a list of messages. A Default conversation is created when you first sign in. You can create a new
-<p>You can create a new conversation by clicking on the "+" button. You can also delete a conversation by clicking on
+    conversation by clicking the "+" button and delete one by clicking the trash can icon. The Default conversation
-    the trash can.</p>
+    cannot be deleted but can be renamed.</p>
-<p>You can not delete the Default conversation but you can Archive it.</p>
 
 <h2>Usage</h2>
-<p>You can see the usage of your account in the Usage menu. You can see how many messages you have sent and received,
+<p>In the Usage menu, you can see the usage of your account, including the number of messages sent and received and the
-    and how much the API costed you.</p>
+    associated API costs.</p>
+
+<h2>Appendix</h2>
+<p>The following is a list of available models for each provider:</p>
+<ul>
+    <li>OpenAI:
+        <ul>
+            <li>gpt-3.5-turbo</li>
+            <li>gpt-4</li>
+            <li>gpt-4-turbo</li>
+            <li>gpt-4o</li>
+        </ul>
+    </li>
+    <li>Anthropic:
+        <ul>
+            <li>claude-3-haiku-20240307</li>
+            <li>claude-3-sonnet-20240229</li>
+            <li>claude-3-opus-20240229</li>
+        </ul>
+    </li>
+    <li>Mistral:
+        <ul>
+            <li>open-mistral-7b</li>
+            <li>open-mixtral-8x7b</li>
+            <li>open-mixtral-8x22b</li>
+            <li>mistral-small-latest</li>
+            <li>mistral-large-latest</li>
+            <li>codestral-latest</li>
+        </ul>
+    </li>
+    <li>Groq:
+        <ul>
+            <li>llama3-8b-8192</li>
+            <li>llama3-70b-8192</li>
+            <li>gemma-7b-it</li>
+        </ul>
+    </li>
+    <li>Google:
+        <ul>
+            <li>gemini-1.5-pro</li>
+            <li>gemini-1.5-flash</li>
+            <li>gemini-1.0-pro</li>
+        </ul>
+    </li>
+    <li>Inference Endpoints (More custom to come)</li>
+</ul>

views/partials/message-bot.html

@@ -1,5 +1,6 @@
 <div class="message-bot mt-3" id="msg-{{ ConversationAreaId }}">
     <div class="columns is-mobile">
+        {% if not DontShowName %}
         <div class="column is-narrow" id="icon-column">
             <!-- Left column with the icon -->
             {% if IsPlaceholder %}
@@ -21,6 +22,7 @@
 
             {% endif %}
         </div>
+        {% endif %}
 
         <div class="column" id="content-column" style="width: 100px;">
             {% if not IsPlaceholder %}
@@ -29,11 +31,13 @@
                     id="content-{{ ConversationAreaId }}">
                     {% for message in Messages %}
                     {% if not message.Hidden %}
+                    {% if not DontShowName %}
                     <div class="message-header">
                         <p>
                             <strong>{{ message.Name }}</strong> <small>{{ message.ModelID }}</small>
                         </p>
                     </div>
+                    {% endif %}
                     <div class="message-body">
                         <div class="content" style="overflow-x: auto; width: 100%;">
                             {{ message.Content | safe }}

views/partials/popover-settings.html

@@ -93,7 +93,7 @@
                     </form>
                     <p id="api-keys-status"></p>
                 </div>
-                {% if IsSub or isPremium %}
+                {% if isBasic or isPremium %}
                 <a class="button is-small mt-1" href="{{ StripeSubLink }}" target="_blank">
                     <span class="icon is-small" {% if isPremium %}style="color: #b00202" {%else%}style="color: #126d0f"
                         {% endif %}>

views/partials/welcome-chat.html

@@ -1,20 +1,89 @@
-<p>So you like chatGPT and want more GPT-4o but don't want to pay 20$/month?.</p>
+<h1>JADE: The First Multi-Model Chatbot</h1>
+<p>JADE was built with simplicity in mind. The goal is to have a minimalist chatbot that supports all models without
+    unnecessary features like importing files or images. This focus on simplicity allows us to improve how we use AI
+    chatbots in other ways.</p>
 
-<p><strong>JADE allows you to pay by the token.</strong> So if you use it a little, you pay near nothing.</p>
+<p>One of my main concerns was the variety of models available, each excelling in different areas. Unfortunately using
+    all of them can be impractical and very expensive.</p>
+
+<h2>Multi-Models</h2>
+<p>To address this, I created the first Multi-Model chatbot. The idea is to use multiple models within the same
+    conversation. Here are the key points:</p>
+<ol>
+    <li>When asking a question, you can query multiple models and compare their responses to choose the best one.</li>
+    <li>The selected response can be used as the basis for the next message across all models. For example, a response
+        from GPT-4 can be used by Claude Haiku in the next interaction.</li>
+</ol>
 
 <p>To start using JADE, please sign in.</p>
 
-<a class="button is-primary is-small" href="/signin">
+<a class="button is-primary mt-2 mb-2" href="/signin">
     Sign in
 </a>
 
-<p>You can find more informations about JADE bellow:</p>
+<br><br>
+
+<p>You can find more information about JADE below:</p>
 <ul>
-    <li>All Models</li>
+    <li>
-    <li>Multi-Models</li>
+        <h3>Variety of AI models from different providers.<button class="button ml-2 is-small is-primary is-outlined"
-    <li>Compare & Pick</li>
+                onclick="toggleDetails('all-models-details')">
-    <li>Reduce Hallucination</li>
+                <span class="icon is-small">
-    <li>Multi-Models</li>
+                    <i class="fa-solid fa-info"></i>
+                </span>
+            </button></h3>
+        <p id="all-models-details" style="display:none;">With JADE, you can easily switch between models like GPT 3.5 or
+            4o, Gemini, Llama, Mistral, Claude, and more. Even custom endpoint. This means you can choose the best model
+            for your specific needs, whether it's for general knowledge, creative writing, or technical expertise.
+            Having access to multiple models allows you to take advantage of their unique strengths and weaknesses,
+            ensuring you get the most accurate and relevant responses.<br><br></p>
+    </li>
+    <li>
+        <h3>Multiple models in a single conversation.<button class="button ml-2 is-small is-primary is-outlined"
+                onclick="toggleDetails('multi-models-details')">
+                <span class="icon is-small">
+                    <i class="fa-solid fa-info"></i>
+                </span>
+            </button></h3>
+        <p id="multi-models-details" style="display:none;">JADE allows you to engage multiple AI models within a single
+            conversation. This means you can ask a question and receive responses from several models at once, enabling
+            you to compare their answers and choose the most suitable one. This feature is particularly useful for
+            complex queries where different models might offer unique insights or solutions. It enhances the overall
+            conversational experience by providing a richer and more comprehensive set of responses.<br><br></p>
+    </li>
+    <li>
+        <h3>Reduce Hallucination.<button class="button is-small ml-2 is-primary is-outlined"
+                onclick="toggleDetails('reduce-hallucination-details')"><span class="icon is-small">
+                    <i class="fa-solid fa-info"></i>
+                </span>
+            </button></h3>
+        <p id="reduce-hallucination-details" style="display:none;">AI models sometimes generate information that is
+            inaccurate or misleading, a phenomenon known as "hallucination." By using multiple models, JADE helps you
+            cross-verify the information provided, significantly reducing the risk of such errors. This ensures that the
+            responses you receive are more reliable and trustworthy, making JADE a more dependable tool for your
+            conversational needs.<br><br></p>
+    </li>
+    <li>
+        <h3>Pay only for what you use.<button class="button ml-2 is-small is-primary is-outlined"
+                onclick="toggleDetails('flexible-pricing-details')">
+                <span class="icon is-small">
+                    <i class="fa-solid fa-info"></i>
+                </span>
+            </button></h3>
+        <p id="flexible-pricing-details" style="display:none;">JADE offers a flexible pricing model that allows you to
+            pay only for the tokens you use. This is particularly beneficial for users who may not need to use the
+            chatbot extensively. JADE starts with a free tier that allows you to send up to 200 messages a month. For
+            more intensive use, you can upgrade for just $0.95/month.<br><br></p>
+    </li>
 </ul>
 
-<p>JADE start with a free tier that allow you to use ask 200 messages a month. You can then upgrade for $0.95/month.</p>
+<script>
+    function toggleDetails(id) {
+        var element = document.getElementById(id);
+        if (element.style.display === "none") {
+            element.style.display = "block";
+        } else {
+            element.style.display = "none";
+        }
+    }
+</script>