From d75b9a1e150ab211c1052fb49bede9bd16320aca Mon Sep 17 00:00:00 2001
From: Armand Philippot <git@armandphilippot.com>
Date: Sat, 7 Oct 2023 18:44:14 +0200
Subject: feat(components): add a generic Flip component

The flipping animation is used at several places so it makes sense to
use a single component to handle the animation. It will avoid styles
duplication.
---
 src/components/molecules/images/flipping-logo.tsx | 63 -----------------------
 1 file changed, 63 deletions(-)
 delete mode 100644 src/components/molecules/images/flipping-logo.tsx

(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
deleted file mode 100644
index 703d5d6..0000000
--- a/src/components/molecules/images/flipping-logo.tsx
+++ /dev/null
@@ -1,63 +0,0 @@
-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';
-
-export type FlippingLogoProps = {
-  /**
-   * Set additional classnames to the logo wrapper.
-   */
-  className?: string;
-  /**
-   * Photo alternative text.
-   */
-  altText: string;
-  /**
-   * Logo image title.
-   */
-  logoTitle?: LogoProps['heading'];
-  /**
-   * Photo url.
-   */
-  photo: ImageProps['src'];
-};
-
-const FlippingLogoWithRef: ForwardRefRenderFunction<
-  HTMLDivElement,
-  FlippingLogoProps
-> = (
-  { className = '', altText, logoTitle, photo, ...props },
-  ref: ForwardedRef<HTMLDivElement>
-) => {
-  const wrapperClass = `${styles.logo} ${className}`;
-  const size = 100;
-
-  return (
-    <div className={wrapperClass} ref={ref}>
-      <div className={styles.logo__front}>
-        <NextImage
-          {...props}
-          alt={altText}
-          height={size}
-          src={photo}
-          style={{ objectFit: 'cover' }}
-          width={size}
-        />
-      </div>
-      <div className={styles.logo__back}>
-        <Logo heading={logoTitle} />
-      </div>
-    </div>
-  );
-};
-
-/**
- * FlippingLogo component
- *
- * Render a logo and a photo with a flipping effect.
- */
-export const FlippingLogo = forwardRef(FlippingLogoWithRef);
-- 
cgit v1.2.3

