link to chat (#19)

* link to chat

* fix env var link

Author: robmsmt

frontend/src/components/ui/ModelCard.svelte

@@ -15,11 +15,12 @@
       };
   }
   export let entry: ModelCardProps["entry"];
-  
-  // Get the logo URL for this model
+  export let chatAppUrl: string;
+
   const logoUrl = getModelLogo(entry.data.title);
   const metricsUrl = getModelMetricsUrl(entry.data.title);
   const tier = getModelTier(entry.data.title);
+  const chatUrl = `${chatAppUrl.replace(/\/$/, "")}/?models=${encodeURIComponent(entry.data.title)}`;
 
   let copied = false;
 
@@ -39,7 +40,9 @@
 </script>
 
 <a
-href=https://huggingface.co/{entry.data.title}
+href={chatUrl}
+target="_blank"
+rel="noopener noreferrer"
 class="relative group flex flex-nowrap py-3 px-4 pr-10 rounded-lg border border-black/15 dark:border-white/20 hover:bg-black/5 dark:hover:bg-white/5 hover:text-black dark:hover:text-white transition-colors duration-300 ease-in-out"
 >
 <div class="flex items-center gap-3 min-w-0">
@@ -171,6 +174,7 @@ class="relative group flex flex-nowrap py-3 px-4 pr-10 rounded-lg border border-
     cursor: help;
   }
 
+
   @keyframes check-bounce {
     0% {
       transform: scale(1);

frontend/src/components/ui/ModelList.svelte

@@ -4,6 +4,8 @@
     import { getApiUrl } from "../../lib/config";
     import { getModelTier } from "../../lib/modelMetrics";
 
+    export let chatAppUrl;
+
     let models = [];
     let modelCount = 0;
     let loading = true;
@@ -116,7 +118,7 @@
     {:else}
     <div class="model-list space-y-2">
         {#each filteredModels as model (model.data.title)}
-            <ModelCard entry={model} />
+            <ModelCard entry={model} {chatAppUrl} />
         {/each}
         {#if filteredModels.length === 0}
             <div class="text-center text-slate-500 dark:text-slate-400 py-6">

frontend/src/pages/index.astro

@@ -173,7 +173,7 @@ const sponsors = [
       <!-- Available Models Section -->
       <section class="animate space-y-8">
         <div class="card p-8">
-          <ModelList client:load />
+          <ModelList client:load chatAppUrl={chatAppUrl} />
         </div>
       </section>