Chore: Upgrade dependencies

archiver/archive.ts

@@ -16,7 +16,7 @@ interface LegacyShowList {
  * Archive S3 bucket API
  */
 export const fetchArchivedShowlist = async (
-  showlistId: string
+  showlistId: string,
 ): Promise<ShowsByDate> => {
   if (!showlistBaseUrl) {
     console.error('Arkiston polkua ei ole määritetty');

archiver/archiveCrawlers.ts

@@ -43,7 +43,7 @@ const ARCHIVE_SOURCE_URL = process.env.ARCHIVE_SOURCE_URL || '';
 const archiveGogleSheet = async (
   config: GoogleConfigSheets,
   name: string,
-  showStartTime: string
+  showStartTime: string,
 ) => {
   const archivePath = getArchivePath(name);
   const pictureFolder = path.join(archivePath, 'pictures');

components/ShoutBox/nameformatter.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import Image from 'next/image';
+import Image from 'next/legacy/image';
 import { format } from 'date-fns';
 
 interface NameFormatterProps {

components/ShoutBox/shoutbox.tsx

@@ -63,10 +63,10 @@ const Chat = ({ limit, isOpen }: ShoutBoxProps) => {
       webSocket.current.send(
         JSON.stringify({
           type: 'reload',
-        })
+        }),
       );
 
-      if (!!name) {
+      if (name) {
         handleSubmitName(name);
       }
 

components/button.tsx

@@ -35,15 +35,14 @@ const LinkButton: FC<LinkButtonProps> = ({
   const rel = isExternal ? 'noopener noreferrer' : null;
 
   return (
-    <Link href={href}>
-      <a
-        target={target}
-        rel={rel}
-        className={`${buttonStyle} ${className || ''}`}
-        {...props}
-      >
-        {children}
-      </a>
+    <Link
+      href={href}
+      target={target}
+      rel={rel}
+      className={`${buttonStyle} ${className || ''}`}
+      {...props}
+    >
+      {children}
     </Link>
   );
 };

components/footer.tsx

@@ -1,12 +1,12 @@
+import Image from 'next/legacy/image';
+import Link from 'next/link';
 import {
   AiFillFacebook,
   AiFillGithub,
   AiOutlineInstagram,
   AiOutlineMail,
 } from 'react-icons/ai';
 import { FaDiscord, FaTelegramPlane } from 'react-icons/fa';
-import Image from 'next/image';
-import Link from 'next/link';
 
 import { NavigationItem } from '@/contentful/client';
 
@@ -27,12 +27,13 @@ const Footer = ({ navigationItems }: FooterProps) => {
               alt="Logo of Turun Wappuradio ry"
             />
           </div>
-          <Link href="/tietosuojaseloste">
-            <a className="mt-6 text-sm text-white opacity-50">
-              © Turun Wappuradio ry
-              <br />
-              Tietosuojaseloste
-            </a>
+          <Link
+            href="/tietosuojaseloste"
+            className="mt-6 text-sm text-white opacity-50"
+          >
+            © Turun Wappuradio ry
+            <br />
+            Tietosuojaseloste
           </Link>
         </div>
       </div>
@@ -64,8 +65,8 @@ interface NavLinkProps {
 
 const NavLink = ({ slug, name }: NavLinkProps) => (
   <li key={slug} className="my-3">
-    <Link href={'/' + slug}>
-      <a className="font-bold hover:underline">{name}</a>
+    <Link href={'/' + slug} className="font-bold hover:underline">
+      {name}
     </Link>
   </li>
 );

components/hamburger/hamburger.module.css

@@ -14,7 +14,9 @@
 
 .line {
   fill: none;
-  transition: stroke-dasharray 400ms, stroke-dashoffset 400ms;
+  transition:
+    stroke-dasharray 400ms,
+    stroke-dashoffset 400ms;
   stroke: #fff;
   stroke-width: 5.5;
   stroke-linecap: round;
@@ -33,7 +35,9 @@
 .bottom {
   stroke-dasharray: 40 85;
   transform-origin: 50%;
-  transition: transform 400ms, stroke-dashoffset 400ms;
+  transition:
+    transform 400ms,
+    stroke-dashoffset 400ms;
 }
 
 .top_active {

components/hero.tsx

@@ -1,6 +1,6 @@
-import { FC, useState } from 'react';
-import Image from 'next/image';
+import Image from 'next/legacy/image';
 import Link from 'next/link';
+import { FC, useState } from 'react';
 
 import { NavigationItem } from '@/contentful/client';
 import { contentfulImageLoader } from '@/contentful/contentfulImageLoader';
@@ -131,8 +131,11 @@ const Hero: FC<HeroProps> = ({
 
 const NavLink = ({ href, name }: { href: string; name: string }) => (
   <li className="p-4">
-    <Link href={href}>
-      <a className="text-xl text-white transition hover:text-coral">{name}</a>
+    <Link
+      href={href}
+      className="text-xl text-white transition hover:text-coral"
+    >
+      {name}
     </Link>
   </li>
 );

components/menu.tsx

@@ -19,23 +19,21 @@ const Menu = ({ navigationItems, isOpen, closeMenu }: MenuProps) => (
   >
     <ul className="px-8 pt-24">
       <li>
-        <Link href="/">
-          <a className="p-2 text-2xl">Radio</a>
+        <Link href="/" className="p-2 text-2xl">
+          Radio
         </Link>
       </li>
 
       {navigationItems.map(({ name, slug }) => (
         <li key={slug} className="my-5">
-          <Link href={`/${slug}`}>
-            <a className="p-2 text-2xl" onClick={closeMenu}>
-              {name}
-            </a>
+          <Link href={`/${slug}`} className="p-2 text-2xl" onClick={closeMenu}>
+            {name}
           </Link>
         </li>
       ))}
       <li>
-        <Link href="/arkisto">
-          <a className="p-2 text-2xl">Arkisto</a>
+        <Link href="/arkisto" className="p-2 text-2xl">
+          Arkisto
         </Link>
       </li>
     </ul>

components/player.tsx

@@ -1,6 +1,6 @@
+import Image from 'next/legacy/image';
 import { useEffect, useState } from 'react';
 import { FiMessageSquare, FiPause, FiPlay, FiVideo } from 'react-icons/fi';
-import Image from 'next/image';
 import { format } from 'date-fns';
 
 import useShoutBoxAndVideo from '@/hooks/useShoutboxAndVideo';

components/responsiveShowlist.tsx

@@ -67,7 +67,7 @@ export const ResponsiveShowlist = ({
   const [selectedDate, setSelectedDate] = useState<string>(
     Object.keys(showsByDate).includes(format(new Date(), 'y.M.dd'))
       ? format(new Date(), 'y.M.dd')
-      : Object.keys(showsByDate)[0]
+      : Object.keys(showsByDate)[0],
   );
 
   const setDateAndScroll = (date: string) => {

components/richtext.tsx

@@ -1,10 +1,10 @@
 import React, { FC } from 'react';
-import Image from 'next/image';
 import {
   documentToReactComponents,
   Options,
 } from '@contentful/rich-text-react-renderer';
 import { BLOCKS, INLINES, MARKS } from '@contentful/rich-text-types';
+import Image from 'next/legacy/image';
 
 import { contentfulImageLoader } from '../contentful/contentfulImageLoader';
 import { LinkButton } from './button';
@@ -63,7 +63,7 @@ const renderOptions = (links?: any): Options => {
         if (
           React.Children.map(
             children,
-            (child: any) => child?.type === 'u'
+            (child: any) => child?.type === 'u',
           ).every(Boolean)
         ) {
           return (
@@ -72,7 +72,7 @@ const renderOptions = (links?: any): Options => {
                 {React.Children.map(children, (child: any) =>
                   React.cloneElement(child, {
                     className: 'no-underline',
-                  })
+                  }),
                 )}
               </LinkButton>
             </span>

components/showcard.tsx

@@ -1,7 +1,7 @@
 import { useState } from 'react';
-import Image from 'next/image';
 import { format } from 'date-fns';
 import fi from 'date-fns/locale/fi';
+import Image from 'next/legacy/image';
 
 import { Show } from '@/scripts/google/showlistHelpers';
 import placeholderImage from '../public/kuva_puuttuu_v2.jpeg';

components/showlistMap.tsx

@@ -92,7 +92,7 @@ export const ShowlistMap = ({ showsByDate }: ShowlistMapProps) => {
                       key={i}
                       showLength={differenceInMinutes(
                         new Date(show.end),
-                        new Date(show.start)
+                        new Date(show.start),
                       )}
                       text={show?.name}
                       color={show?.color}

contentful/client.ts

@@ -22,14 +22,14 @@ export interface NavigationItem {
 
 const fetchNavigationItems = async (): Promise<NavigationItem[]> => {
   const navigationItems = await fetchContent<NavigationItemsQuery>(
-    NavigationItemsDocument
+    NavigationItemsDocument,
   );
   return navigationItems.navigationCollection.items[0].pagesCollection.items;
 };
 
 const fetchContent = async <T>(
   query: DocumentNode,
-  variables?: any
+  variables?: any,
 ): Promise<T> => {
   try {
     const _apolloClient = apolloClient ?? createApolloClient();
@@ -38,7 +38,7 @@ const fetchContent = async <T>(
     return data;
   } catch (error) {
     console.error(
-      `There was a problem retrieving entries with the query ${query}`
+      `There was a problem retrieving entries with the query ${query}`,
     );
     console.error(error);
   }