SonarCloud fixes

src/components/Gallery/Gallery.tsx

@@ -40,7 +40,7 @@ const Gallery = ({
 
     cachedRef.addEventListener('scroll', scrollEvent);
 
-    return () => (cachedRef as HTMLDivElement).removeEventListener('scroll', scrollEvent);
+    return () => cachedRef.removeEventListener('scroll', scrollEvent);
   }, [scrollRef]);
 
   const imagesRefs = images.map((item) => ({

src/components/ListItem/ListItem.tsx

@@ -45,8 +45,10 @@ const ListItem = ({
     <p className={styles.description}>{description}</p>
   ) : null;
 
+  const categoryClass = category ? styles[`category-style-${category.style ?? 1}`] : null;
+
   const categoryElement = category ? (
-    <p className={`${styles.category} ${styles[`category-style-${category.style ?? 1}`]}`}>{category.text}</p>
+    <p className={`${styles.category} ${categoryClass}`}>{category.text}</p>
   ) : null;
 
   return (

src/helpers/getBottlenoseDolphinCatalogue.ts

@@ -49,18 +49,19 @@ const getCatalogueList = async ({
   page,
   search,
 }: GetCatalogueListOptions): Promise<CatalogueBottlenoseDolphinListAPIResponse> => {
-  // TODO: Type this properly
-  const query: any = {
+  const query = {
     content_type: ContentTypes.CatalogueBottlenoseDolphin,
     order: ['-fields.id'],
     limit: CATALOGUE_RESULTS_LIMIT,
     skip: CATALOGUE_RESULTS_LIMIT * (page - 1),
   };
 
   if (search) {
+    // @ts-ignore
     query['fields.slug[match]'] = search;
   }
 
+  // @ts-ignore
   const result = await contentfulDeliveryClient.getEntries<ContentTypeCatalogueBottlenoseDolphin>(query);
 
   const items = result.items.map((entry) => reduceCatalogueItem(entry));

src/layout/Header.tsx

@@ -229,7 +229,7 @@ const Header = () => {
 
       <Social />
 
-      <div
+      <button
         className="burger"
         onClick={toggleMenu}
         onKeyDown={toggleMenu}
@@ -241,18 +241,18 @@ const Header = () => {
           <path d="m0 34h64v14h-64z" fill="#000" />
           <path d="m2 34c2.03077 2.1662 5.46923 2.1662 7.5 0 2.0308-2.1662 5.4692-2.1662 7.5 0 2.0308 2.1662 5.4692 2.1662 7.5 0 2.0308-2.1662 5.4692-2.1662 7.5 0 2.0308 2.1662 5.4692 2.1662 7.5 0 2.0308-2.1662 5.4692-2.1662 7.5 0 2.0308 2.1662 5.4692 2.1662 7.5 0 2.0308-2.1662 5.4692-2.1662 7.5 0" stroke="#fff" strokeLinecap="round" strokeWidth="3" />
         </svg>
-      </div>
+      </button>
 
       {submenu !== Submenus.None && (
-        <div
+        <button
           className="back"
           onClick={() => setSubmenu(Submenus.None)}
           onKeyDown={() => setSubmenu(Submenus.None)}
         >
           <svg fill="none" height="64" viewBox="0 0 64 64" width="64" xmlns="http://www.w3.org/2000/svg">
             <path clipRule="evenodd" d="m49.6454 1.33894c1.8061 1.78525 1.8061 4.67972 0 6.46498l-24.4797 24.19608 24.4797 24.1961c1.8061 1.7852 1.8061 4.6797 0 6.465-1.8062 1.7852-4.7346 1.7852-6.5408 0l-27.75-27.4286c-1.8061-1.7853-1.8061-4.6797 0-6.465l27.75-27.42856c1.8062-1.785253 4.7346-1.785253 6.5408 0z" fill="#fff" fillRule="evenodd" />
           </svg>
-        </div>
+        </button>
       )}
     </header>
   );

src/pages/research/catalogues/bottlenose-dolphin/[slug].tsx

@@ -61,7 +61,7 @@ const Page: NextPage<PageProps> = ({
         <li>
           <Catalogue
             title={String(catalogueData.mother.id)}
-            subtitle={String(catalogueData.mother?.name) ?? undefined}
+            subtitle={catalogueData.mother?.name ? String(catalogueData.mother.name) : undefined}
             link={`/research/catalogues/bottlenose-dolphin/${catalogueData.mother.slug}`}
             image={image ?? undefined}
           />