add FLUX

src/routes/api/models/+server.ts

@@ -43,6 +43,9 @@ export async function GET(request : RequestEvent) {
       case "sd1":
         base_model_mapped = ['CompVis/stable-diffusion-v1-4', 'runwayml/stable-diffusion-v1-5']
         break;
+      case "flux":
+        base_model_mapped = ['black-forest-labs/FLUX.1-dev ']
+        break;
     }
   }
 

src/routes/models/+layout.svelte

@@ -92,11 +92,17 @@
 	{/if}
 </svelte:head>
 
-<main class="px-6 py-10 lg:px-10 lg:py-12">
+<main class="px-6 py-10 lg:px-10 lg:py-12 relative">
 	<Drawer onSearch={handleChangeSearch} />
 	<h1 class="text-white font-semibold text-2xl">
 		Explore Models ({data?.total_items ?? 0})
 	</h1>
+	<div class="bg-cyan-500/20 max-w-xl border-2 border-cyan-500/30 w-full p-3 text-white rounded-lg mt-4">
+		<p class="font-semibold">FLUX LoRAs are here! ✨</p>
+		<p class="opacity-70 text-sm">
+			We are excited to announce the arrival of the first FLUX models on LoRA Studio.
+		</p>
+	</div>
 	<div class="flex items-start sm:items-center justify-between mt-5 flex-col sm:flex-row gap-5 sm:justify-between">
 		<Radio
 			options={[
@@ -141,13 +147,20 @@
 	<div class="mt-5 max-w-sm flex items-center justify-start gap-5 w-full">
 		<Input value={form.search} className="lg:min-w-[300px]" placeholder="Filter by model name" onChange={handleChangeSearch} />
 		<div class="flex flex-col items-start justify-center gap-1.5">
-			<p class="text-xs text-white/60 whitespace-nowrap">
+			<p class="text-xs text-white/60 whitespace-nowrap flex items-center justify-start gap-2">
 				Filter by
+				<span class="relative">
+					<span class="w-2 h-2 rounded-full block bg-cyan-500"></span>
+					<span class="w-2 h-2 rounded-full block bg-cyan-500 animate-ping absolute top-0 left-0"></span>
+				</span>
 			</p>
 			<select value={form.base_model} class="text-white bg-transparent outline-none cursor-pointer" on:change={handleChangeBaseModel}>
 				<option value="">
 					All models
 				</option>
+				<option value="flux">
+					Flux
+				</option>
 				<option value="sd3">
 					Stable Diffusion 3
 				</option>