From 3272ac336da52364ace5ed76d8f609d4088ffc06 Mon Sep 17 00:00:00 2001
From: Armand Philippot <git@armandphilippot.com>
Date: Thu, 28 Sep 2023 18:19:00 +0200
Subject: refactor(components): make Logo component ESlint compliant

I also renamed the title prop to heading because title already exists
as HTML attribute.
---
 src/components/molecules/images/flipping-logo.tsx | 23 +++++++++++++++--------
 1 file changed, 15 insertions(+), 8 deletions(-)

(limited to 'src/components/molecules/images/flipping-logo.tsx')

diff --git a/src/components/molecules/images/flipping-logo.tsx b/src/components/molecules/images/flipping-logo.tsx
index 64e69ca..703d5d6 100644
--- a/src/components/molecules/images/flipping-logo.tsx
+++ b/src/components/molecules/images/flipping-logo.tsx
@@ -1,5 +1,9 @@
-import Image, { type ImageProps } from 'next/image';
-import { ForwardedRef, forwardRef, ForwardRefRenderFunction } from 'react';
+import NextImage, { type ImageProps } from 'next/image';
+import {
+  type ForwardedRef,
+  forwardRef,
+  type ForwardRefRenderFunction,
+} from 'react';
 import { Logo, type LogoProps } from '../../atoms';
 import styles from './flipping-logo.module.scss';
 
@@ -15,7 +19,7 @@ export type FlippingLogoProps = {
   /**
    * Logo image title.
    */
-  logoTitle?: LogoProps['title'];
+  logoTitle?: LogoProps['heading'];
   /**
    * Photo url.
    */
@@ -29,20 +33,23 @@ const FlippingLogoWithRef: ForwardRefRenderFunction<
   { className = '', altText, logoTitle, photo, ...props },
   ref: ForwardedRef<HTMLDivElement>
 ) => {
+  const wrapperClass = `${styles.logo} ${className}`;
+  const size = 100;
+
   return (
-    <div className={`${styles.logo} ${className}`} ref={ref}>
+    <div className={wrapperClass} ref={ref}>
       <div className={styles.logo__front}>
-        <Image
+        <NextImage
           {...props}
           alt={altText}
-          height="100"
+          height={size}
           src={photo}
           style={{ objectFit: 'cover' }}
-          width="100"
+          width={size}
         />
       </div>
       <div className={styles.logo__back}>
-        <Logo title={logoTitle} />
+        <Logo heading={logoTitle} />
       </div>
     </div>
   );
-- 
cgit v1.2.3

