From e294a1ece9adbca2941e8c641a8ab097cb8f079f Mon Sep 17 00:00:00 2001
From: jeafreezy <jolaiyaemmanuel@gmail.com>
Date: Wed, 30 Oct 2024 18:33:26 +0100
Subject: [PATCH] fix: fixed typescript bug

---
 frontend/src/components/map/draw-control.tsx                 | 1 +
 frontend/src/components/map/map.tsx                          | 3 ---
 frontend/src/components/ui/button/icon-button.tsx            | 5 ++++-
 frontend/src/config/index.ts                                 | 4 +++-
 .../features/models/components/filters/ordering-filter.tsx   | 1 +
 5 files changed, 9 insertions(+), 5 deletions(-)

diff --git a/frontend/src/components/map/draw-control.tsx b/frontend/src/components/map/draw-control.tsx
index 2a5dec47..a45c47f0 100644
--- a/frontend/src/components/map/draw-control.tsx
+++ b/frontend/src/components/map/draw-control.tsx
@@ -1,5 +1,6 @@
 import { Map } from "maplibre-gl";
 
+ // @ts-expect-error bad type definition
 const DrawControl = ({ map }: { map: Map | null }) => {
   const handleDraw = () => {};
 
diff --git a/frontend/src/components/map/map.tsx b/frontend/src/components/map/map.tsx
index 86160d7f..f8c96d71 100644
--- a/frontend/src/components/map/map.tsx
+++ b/frontend/src/components/map/map.tsx
@@ -52,9 +52,6 @@ const MapComponent: React.FC<MapComponentProps> = ({
   // Update basemap.
   useEffect(() => {
     if (!map) return;
-    {
-      /* @ts-expect-error bad type definition */
-    }
     map.setStyle(MAP_STYLES[selectedBasemap]);
   }, [selectedBasemap]);
 
diff --git a/frontend/src/components/ui/button/icon-button.tsx b/frontend/src/components/ui/button/icon-button.tsx
index 11d7dd6d..6a24f2f6 100644
--- a/frontend/src/components/ui/button/icon-button.tsx
+++ b/frontend/src/components/ui/button/icon-button.tsx
@@ -1,4 +1,4 @@
-import { ButtonVariant } from "@/types";
+import { ButtonSize, ButtonVariant } from "@/types";
 import { Button } from "@/components/ui/button";
 import { cn } from "@/utils";
 
@@ -12,6 +12,7 @@ type ButtonWithIconProps = {
   className?: string;
   iconClassName?: string;
   disabled?: boolean;
+  size?:ButtonSize
 };
 const ButtonWithIcon: React.FC<ButtonWithIconProps> = ({
   onClick,
@@ -23,6 +24,7 @@ const ButtonWithIcon: React.FC<ButtonWithIconProps> = ({
   className,
   iconClassName,
   disabled,
+  size 
 }) => {
   return (
     <div role="button">
@@ -32,6 +34,7 @@ const ButtonWithIcon: React.FC<ButtonWithIconProps> = ({
         capitalizeText={capitalizeText}
         className={className}
         disabled={disabled}
+        size={size}
       >
         {PrefixIcon && <PrefixIcon className={cn(`icon ${iconClassName}`)} />}
         <p>{label}</p>
diff --git a/frontend/src/config/index.ts b/frontend/src/config/index.ts
index a6e7d386..73252ff0 100644
--- a/frontend/src/config/index.ts
+++ b/frontend/src/config/index.ts
@@ -1,10 +1,12 @@
 // MAP SETTINGS
 
+import { StyleSpecification } from "maplibre-gl";
+
 // References -
 // - https://medium.com/@go2garret/free-basemap-tiles-for-maplibre-18374fab60cb
 // - https://codepen.io/g2g/pen/rNRJBZg
 
-export const MAP_STYLES = {
+export const MAP_STYLES: Record<string, string | StyleSpecification> = {
   OSM: {
     version: 8,
     sources: {
diff --git a/frontend/src/features/models/components/filters/ordering-filter.tsx b/frontend/src/features/models/components/filters/ordering-filter.tsx
index a0ad4ecb..85674f94 100644
--- a/frontend/src/features/models/components/filters/ordering-filter.tsx
+++ b/frontend/src/features/models/components/filters/ordering-filter.tsx
@@ -82,6 +82,7 @@ const OrderingFilter: React.FC<OrderingFilterProps> = ({
     <CheckboxGroup
       options={ORDERING_FIELDS}
       disabled={disabled}
+      // @ts-expect-error bad type definition
       onCheck={onSortSelect}
       defaultSelectedOption={
         ORDERING_FIELDS.find(