change export, use siblings first

src/lib/components/models/drawer/Drawer.svelte

@@ -8,11 +8,12 @@
   import { modelStore } from "$lib/stores/use-model";
   import UserIsLogged from '$lib/components/UserIsLogged.svelte';
   import Comments from '$lib/components/models/drawer/comments/Comments.svelte';
-	import { env } from '$env/dynamic/public';
-	import { browser } from '$app/environment';
 
   let { open, model } = get(modelStore);
 
+  let author = model?.id.split('/')[0];
+  let repo = model?.id.split('/')[1];
+
   modelStore.subscribe((value) => {
     open = value?.open;
     model = value?.model;
@@ -42,6 +43,11 @@
       handleClose();
     }
   };
+  const handleClickAuthor = () => {
+    $page.url.searchParams.set('search', author as string);
+    goto(`?${$page.url.searchParams.toString()}`);
+    handleClose()
+  }
 </script>
 
 <div
@@ -60,8 +66,8 @@
           <div class="flex items-center justify-start gap-3 lg:gap-6">
             <img src={model?.image} class="lg:w-16 lg:h-16 w-12 h-12 rounded-xl bg-neutral-800 object-cover" alt={model?.id} />
             <div>
-              <p class="text-white font-semibold text-lg lg:text-2xl mb-1 truncate">
-                {model?.id}
+              <p class="text-neutral-300 font-semibold text-lg lg:text-2xl mb-1 truncate">
+                <button class="underline text-white" on:click={handleClickAuthor}>{author}</button>/{repo}
               </p>
               <a href="https://huggingface.co/{model?.id}" target="_blank" class="text-neutral-400 underline hover:text-neutral-300 flex items-center justify-start gap-1">
                 <Icon icon="iconamoon:link-external-fill" class="w-4 h-4" /> 

src/routes/+page.svelte

@@ -1,7 +1,6 @@
 <script lang="ts">
 	import { browser } from "$app/environment";
 	import InfiniteScroll from "svelte-infinite-scroll";
-
 	import Button from "$lib/components/Button.svelte";
 	import Card from "$lib/components/models/Card.svelte";
 	import Input from "$lib/components/fields/Input.svelte";
@@ -11,13 +10,15 @@
 	import Dialog from "$lib/components/dialog/Dialog.svelte";
 	import SubmitModel from "$lib/components/models/Submit.svelte";
 	import Drawer from "$lib/components/models/drawer/Drawer.svelte";
+	import { page } from "$app/stores";
+	import { goto } from "$app/navigation";
 	// import UserIsLogged from "$lib/components/UserIsLogged.svelte";
 
 	export let data
 
 	let form = {
-		filter: "hotest",
-		search: "",
+		filter: data?.filter,
+		search: data?.search,
 		page: "0",
 	}
 	let submitModelDialog = false;
@@ -30,15 +31,20 @@
 	}
 	const handleChangeFilter = async (filter: string) => {
 		form = { ...form, filter, page: (0).toString()};
-		refetch(false)
+		$page.url.searchParams.set('filter', filter);
+		goto(`?${$page.url.searchParams.toString()}`);
 	}
 	let timeout: any;
 	const handleChangeSearch = async (search: string) => {
 		clearTimeout(timeout);
 		form = { ...form, search, page: (0).toString()};
-		timeout = setTimeout(() => refetch(false), 500);
+		timeout = setTimeout(() => {
+			if (search === "") $page.url.searchParams.delete('search');
+			else $page.url.searchParams.set('search', search);
+			goto(`?${$page.url.searchParams.toString()}`);
+		}, 500);
 	}
-
+	
 	const refetch = async (add: boolean) => {
 		const request = await fetch(`/api/models?${new URLSearchParams(form)}`);
 		const response = await request.json();

src/routes/+page.ts

@@ -2,6 +2,8 @@ import { modelStore } from "$lib/stores/use-model";
 
 export async function load({ fetch, url }) {
   const model_param = url.searchParams.get("model")
+  const search_param = url.searchParams.get("search") ?? ""
+  const filter_param = url.searchParams.get("filter") ?? "hotest"
 
   if (model_param) {
     const model_request = await fetch(`/api/models/${model_param?.replace("/", "@")}?full=true`, {
@@ -17,7 +19,13 @@ export async function load({ fetch, url }) {
     });
   }
 
-  const response = await fetch("/api/models?page=0&filter=hotest", {
+  const data = {
+    filter: filter_param,
+    page: "0",
+    search: search_param ?? ""
+  }
+
+  const response = await fetch(`/api/models?${new URLSearchParams(data)}`, {
     method: "GET",
     headers: {
       "Content-Type": "application/json"
@@ -27,6 +35,8 @@ export async function load({ fetch, url }) {
   return {
     models: models?.cards ?? [],
     total_items: models?.total_items ?? 0,
+    search: search_param ?? "",
+    filter: filter_param,
     // model: model?.model ?? null
   }
 }

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

@@ -20,25 +20,30 @@ export async function POST({ request }) {
   let index = 0;
   for (const model of responseData) {
     if (index % 50 === 0) {
-      await new Promise(resolve => setTimeout(resolve, 4000));
+      await new Promise(resolve => setTimeout(resolve, 2000));
     }
 
-    const hasReadme = model?.siblings?.find((sibling: Record<string, string>) => sibling?.rfilename === "README.md")
-    if (hasReadme) {
-      const readmeRes = await fetch(`https://huggingface.co/${model.id}/raw/main/README.md`)
-      const readme = await readmeRes.text().catch(() => null)
-      if (!readme) {
-        continue
+    const hasImages = model?.siblings?.filter((sibling: Record<string, string>) => sibling?.rfilename.endsWith(".png") || sibling?.rfilename.endsWith(".jpeg") || sibling?.rfilename.endsWith(".jpg"))
+    if (hasImages.length > 0) {
+      model.image = hasImages[1]?.rfilename ? `https://huggingface.co/${model.id}/resolve/main/${hasImages[1]?.rfilename}` : `https://huggingface.co/${model.id}/resolve/main/${hasImages[0]?.rfilename}`
+    } else {
+      const hasReadme = model?.siblings?.find((sibling: Record<string, string>) => sibling?.rfilename === "README.md")
+      if (hasReadme) {
+        const readmeRes = await fetch(`https://huggingface.co/${model.id}/raw/main/README.md`)
+        const readme = await readmeRes.text().catch(() => null)
+        if (!readme) {
+          continue
+        }
+        const imageRegex = /!\[.*\]\((.*)\)/
+        let image = readme.match(imageRegex)?.[1]
+    
+        if (!image) {
+          continue
+        }
+        image = image.replace(/&#x2F;/g, "/")
+        if (image.startsWith("http")) model.image = image
+        else model.image = `https://huggingface.co/${model.id}/resolve/main/${image.replace("./", "")}`
       }
-      const imageRegex = /!\[.*\]\((.*)\)/
-      let image = readme.match(imageRegex)?.[1]
-
-      if (!image) {
-        continue
-      }
-      image = image.replace(/&#x2F;/g, "/")
-      if (image.startsWith("http")) model.image = image
-      else model.image = `https://huggingface.co/${model.id}/resolve/main/${image.replace("./", "")}`
     }
 
     await prisma.model.create({

src/routes/api/scrap-models/[slug]/+server.ts

@@ -18,7 +18,11 @@ export async function POST({ request, params }) {
   const response = await fetch(`https://huggingface.co/api/models/${slug}`)
   const model = await response.json();
 
-  const hasReadme = model?.siblings?.find((sibling: Record<string, string>) => sibling?.rfilename === "README.md")
+  const hasImages = model?.siblings?.filter((sibling: Record<string, string>) => sibling?.rfilename.endsWith(".png") || sibling?.rfilename.endsWith(".jpeg") || sibling?.rfilename.endsWith(".jpg"))
+  if (hasImages.length > 0) {
+    model.image = hasImages[1]?.rfilename ? `https://huggingface.co/${model.id}/resolve/main/${hasImages[1]?.rfilename}` : `https://huggingface.co/${model.id}/resolve/main/${hasImages[0]?.rfilename}`
+  } else {
+    const hasReadme = model?.siblings?.find((sibling: Record<string, string>) => sibling?.rfilename === "README.md")
     if (hasReadme) {
       const readmeRes = await fetch(`https://huggingface.co/${model.id}/raw/main/README.md`)
       const readme = await readmeRes.text().catch(() => null)
@@ -29,27 +33,28 @@ export async function POST({ request, params }) {
       }
       const imageRegex = /!\[.*\]\((.*)\)/
       let image = readme.match(imageRegex)?.[1]
-
+  
       if (!image) {
         return json({
-          message: "No readme"
+          message: "No image found"
         }, { status: 404 })
       }
       image = image.replace(/&#x2F;/g, "/")
       if (image.startsWith("http")) model.image = image
       else model.image = `https://huggingface.co/${model.id}/resolve/main/${image.replace("./", "")}`
     }
+  }
 
-    await prisma.model.create({
-      data: {
-        id: model.id,
-        image: model.image,
-        likes: model.likes,
-        downloads: model.downloads,
-        isPublic: true,
-        instance_prompt: model?.cardData?.instance_prompt,
-      }
-    }).catch(() => {})
+  await prisma.model.create({
+    data: {
+      id: model.id,
+      image: model.image,
+      likes: model.likes,
+      downloads: model.downloads,
+      isPublic: true,
+      instance_prompt: model?.cardData?.instance_prompt,
+    }
+  }).catch(() => {})
 
   return json({
     message: `Successfully added the model ${model.id}`,