Merge branch 'develop' of github.com:earthpulse/eotdl into develop

earthpulse · Jul 29, 2024 · 3813c36 · 3813c36
2 parents a41f04b + 08ccabd
commit 3813c36
Show file tree

Hide file tree

Showing 4 changed files with 31 additions and 13 deletions.
diff --git a/ui/src/components/Tags.svelte b/ui/src/components/Tags.svelte
@@ -3,6 +3,8 @@
     export let selected_tags = [];
     export let onToggleTag = () => {};
 
+    let categories = [];
+
     const toggleTag = (tag) => {
         if (selected_tags.includes(tag)) {
             selected_tags = selected_tags.filter((t) => t !== tag);
@@ -11,17 +13,32 @@
         }
         onToggleTag(selected_tags);
     };
+
+    tags.forEach(tag => {
+        console.log(tag.category);
+        if(!categories.includes(tag.category)){
+            categories.push(tag.category);
+        }
+    })
+    console.log(categories);
 </script>
 
-<div class="flex flex-wrap gap-1 content-start">
-    {#each tags as tag}
-        <button
-            class="badge text-slate-400 text-xs {selected_tags.includes(
-                tag
-            ) ? 'badge badge-accent bg-green-100 text-slate-600 ' : 'badge-outline'}"
-            on:click={() => toggleTag(tag)}
-        >
-            {tag}
-        </button>
+<div class="flex flex-row flex-wrap gap-2 content-start justify-center">
+    {#each categories as category}    
+        <div class="w-full gap-2">
+            <h1 class="font-bold">{category.charAt(0).toUpperCase() + category.slice(1)}</h1>
+            {#each tags as tag}
+                {#if tag.category == category}                
+                <button
+                    class="badge text-slate-400 text-xs mx-[2px] {selected_tags.includes(
+                        tag
+                    ) ? 'badge badge-accent bg-green-100 text-slate-600 ' : 'badge-outline'}"
+                    on:click={() => toggleTag(tag)}
+                >
+                    {tag.name}
+                </button>
+                {/if}
+            {/each}
+        </div>
     {/each}
 </div>
diff --git a/ui/src/lib/tags/retrieveTags.js b/ui/src/lib/tags/retrieveTags.js
@@ -1,7 +1,7 @@
 import { PUBLIC_EOTDL_API } from '$env/static/public';
 
 export default async (fetch) => {
-	let url = `${PUBLIC_EOTDL_API}/tags`;
+	let url = `${PUBLIC_EOTDL_API}/tags/categories`;
   try {
     const res = await fetch(url);
     const data = await res.json();

diff --git a/ui/src/routes/datasets/+page.svelte b/ui/src/routes/datasets/+page.svelte
@@ -18,6 +18,7 @@
 	let selected_tags = [];
 
 	const load = async () => {
+
 		await datasets.retrieve(fetch);
 		loading = false;
 		show_liked = localStorage.getItem("show_liked") === "true";
@@ -36,7 +37,7 @@
 		filtered_datasets = $datasets.data
 			?.filter((dataset) => {
 				if (selected_tags.length === 0) return true;
-				return selected_tags.every((tag) => dataset.tags.includes(tag));
+				return selected_tags.every((tag) => dataset.tags.includes(tag.name));
 			})
 			.filter((dataset) => {
 				if (filterName.length === 0) return true;

diff --git a/ui/src/routes/models/+page.svelte b/ui/src/routes/models/+page.svelte
@@ -33,7 +33,7 @@
 		filtered_models = $models.data
 			?.filter((models) => {
 				if (selected_tags.length === 0) return true;
-				return selected_tags.every((tag) => models.tags.includes(tag));
+				return selected_tags.every((tag) => models.tags.includes(tag.name));
 			})
 			.filter((models) => {
 				if (filterName.length === 0) return true;