Merge pull request #161 from datagrove/updateFilters

Update filters
datagrove · Oct 1, 2024 · c37cd66 · c37cd66
2 parents 79fe374 + c14d32f
commit c37cd66
Show file tree

Hide file tree

Showing 34 changed files with 4,134 additions and 1,258 deletions.
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -1,3 +1,5 @@
 {
-    "prettier.printWidth": 250
-}
+    "prettier.printWidth": 250,
+    "deno.enable": true,
+    "deno.lint": true,
+}
diff --git a/src/components/common/Dropdown.tsx b/src/components/common/Dropdown.tsx
@@ -27,21 +27,21 @@ const Dropdown: Component<Props> = (Props: Props) => {
         <div class="relative inline-block w-full">
             {/* Dropdown button */}
             <button
-                class="flex w-full justify-between rounded border border-inputBorder1 bg-background1 text-ptext1 focus:border-2 focus:border-highlight1 focus:outline-none dark:border-inputBorder1-DM dark:bg-background2-DM dark:text-ptext2-DM dark:focus:border-highlight1-DM"
+                class="flex w-full items-center justify-between rounded border border-inputBorder1 bg-background1 text-ptext1 focus:border-2 focus:border-highlight1 focus:outline-none dark:border-inputBorder1-DM dark:bg-background2-DM dark:text-ptext2-DM dark:focus:border-highlight1-DM"
                 onClick={(e) => {
                     e.preventDefault();
                     setIsOpen(!isOpen());
                 }}
             >
-                <div class="ml-1 inline-block">
+                <div class="ml-1 flex min-h-[44px] items-center overflow-hidden text-lg">
                     {/* TODO: This should take a prop to define whether it is required or not and what label to use */}
-                    <span class="text-alert1">* </span>
+                    <div class="text-alert1">* </div>
                     {Props.selectedOption ||
                         t("formLabels.chooseTaxCode") ||
                         t("formLabels.dropdownDefault")}
                 </div>
                 {/* Dropdown icon */}
-                <div class="inline-block">
+                <div class="">
                     <svg
                         class={`inline-block h-5 w-5 transform transition-transform dark:fill-white 
                         ${isOpen() ? "rotate-180" : ""}`}

diff --git a/src/components/home/Home.tsx b/src/components/home/Home.tsx
@@ -6,6 +6,7 @@ import { windowSize } from "@components/common/WindowSizeStore";
 import { HomeCard } from "@components/home/HomeCard";
 import { HomeGradeCarousel } from "./HomeGradeCarousel";
 import { useTranslations } from "../../i18n/utils";
+import { debounce } from "@lib/utils/debounce";
 
 // const lang = getLangFromUrl(new URL(window.location.href));
 
@@ -15,7 +16,7 @@ interface Props {
     subjectCarousel: JSXElement;
 }
 
-async function fetchPosts({
+async function postRequest({
     lang,
     draft_status,
     listing_status,
@@ -40,6 +41,8 @@ async function fetchPosts({
     return data;
 }
 
+const fetchPosts = debounce(postRequest, 500);
+
 export const Home: Component<Props> = (props) => {
     const [lang, setLang] = createSignal<"en" | "es" | "fr">(props.lang);
     const [popularPosts, setPopularPosts] = createSignal<Array<Post>>([]);

diff --git a/src/components/home/HomeSubjectCarousel.tsx b/src/components/home/HomeSubjectCarousel.tsx
@@ -100,12 +100,13 @@ export const HomeSubjectCarousel: Component<Props> = (props) => {
             allCategoryInfo.push({
                 ...categoriesData[i],
                 ...categories.find(
-                    (itmInner) =>
-                        itmInner.id.toString() === categoriesData[i].id
+                    (itmInner) => itmInner.id === categoriesData[i].id
                 ),
             });
         }
 
+        allCategoryInfo.sort((a, b) => a.name.localeCompare(b.name));
+
         setSubjectData(allCategoryInfo);
         console.log(allCategoryInfo);
     });