From 21f6c98fadc65a89d6f92e80a5e173e489533001 Mon Sep 17 00:00:00 2001
From: Matz Hilven <hilvenmatz@gmail.com>
Date: Mon, 10 Jun 2024 14:47:07 +0200
Subject: [PATCH] fix: build errors

---
 src/app/projects/page.tsx | 20 ++++++++++++--------
 1 file changed, 12 insertions(+), 8 deletions(-)

diff --git a/src/app/projects/page.tsx b/src/app/projects/page.tsx
index d5aff24..ff6ec0e 100644
--- a/src/app/projects/page.tsx
+++ b/src/app/projects/page.tsx
@@ -3,7 +3,7 @@
 import React, { useState, useEffect, useMemo } from 'react'
 import { ProjectCard } from '@/components/ProjectCard'
 import projectsData from '../../../public/projects.json'
-import { projectsSchema, Project } from '@/typings/project'
+import { projectsSchema, Project, Tag } from '@/typings/project'
 import { useInView } from 'react-intersection-observer'
 
 const Page = () => {
@@ -18,7 +18,7 @@ const Page = () => {
 
   const [currentPage, setCurrentPage] = useState(1)
   const [itemsPerPage] = useState<number>(12)
-  const [filterTag, setFilterTag] = useState<string | null>(null)
+  const [filterTag, setFilterTag] = useState<Tag | null>(null)
   const [sortOrder, setSortOrder] = useState<'asc' | 'desc'>('asc')
 
   const { ref, inView } = useInView({
@@ -26,7 +26,9 @@ const Page = () => {
   })
 
   const handleFilterChange = (event: React.ChangeEvent<HTMLSelectElement>) => {
-    setFilterTag(event.target.value === 'All' ? null : event.target.value)
+    setFilterTag(
+      event.target.value === 'All' ? null : (event.target.value as Tag)
+    )
     setCurrentPage(1)
   }
 
@@ -72,11 +74,13 @@ const Page = () => {
           className="rounded border border-gray-300 bg-white p-2 text-gray-900 dark:border-gray-700 dark:bg-gray-800 dark:text-gray-100"
         >
           <option value="All">All Tags</option>
-          {[...new Set(projects.flatMap(project => project.tags))].map(tag => (
-            <option key={tag} value={tag}>
-              {tag}
-            </option>
-          ))}
+          {Array.from(new Set(projects.flatMap(project => project.tags))).map(
+            tag => (
+              <option key={tag} value={tag}>
+                {tag}
+              </option>
+            )
+          )}
         </select>
         <select
           onChange={handleSortChange}