style: LanguageSelectorWrapped extracted into separate component

client/src/components/shared/Layout/LanguageSelectorWrapped/LanguageSelectorWrapped.module.scss

@@ -0,0 +1,3 @@
+.root {
+  height: 5.28rem;
+}

client/src/components/shared/Layout/LanguageSelectorWrapped/LanguageSelectorWrapped.tsx

@@ -0,0 +1,15 @@
+import cx from 'classnames';
+import React, { FC } from 'react';
+
+import LanguageSelector from 'components/shared/LanguageSelector';
+
+import styles from './LanguageSelectorWrapped.module.scss';
+import LanguageSelectorWrappedProps from './types';
+
+const LanguageSelectorWrapped: FC<LanguageSelectorWrappedProps> = ({ className }) => (
+  <div className={cx(styles.root, className)}>
+    <LanguageSelector />
+  </div>
+);
+
+export default LanguageSelectorWrapped;

client/src/components/shared/Layout/LanguageSelectorWrapped/index.ts

@@ -0,0 +1,2 @@
+// eslint-disable-next-line no-restricted-exports
+export { default } from './LanguageSelectorWrapped';

client/src/components/shared/Layout/LanguageSelectorWrapped/types.ts

@@ -0,0 +1,3 @@
+export default interface LanguageSelectorWrappedProps {
+  className?: string;
+}

client/src/components/shared/Layout/LayoutFooter/LayoutFooter.module.scss

@@ -100,8 +100,6 @@
 }
 
 .languageSelector {
-  height: 5.28rem;
-
   @media #{$phone-down} {
     align-self: flex-start;
     margin-top: 4rem;

client/src/components/shared/Layout/LayoutFooter/LayoutFooter.tsx

@@ -1,8 +1,8 @@
 import cx from 'classnames';
-import React, { FC, memo, ReactElement, useLayoutEffect, useRef } from 'react';
+import React, { FC, memo, useLayoutEffect, useRef } from 'react';
 import { Trans, useTranslation } from 'react-i18next';
 
-import LanguageSelector from 'components/shared/LanguageSelector';
+import LanguageSelectorWrapped from 'components/shared/Layout/LanguageSelectorWrapped';
 import Svg from 'components/ui/Svg';
 import {
   BLOG_POST,
@@ -23,12 +23,6 @@ import { octantSemiTransparent } from 'svg/logo';
 import styles from './LayoutFooter.module.scss';
 import LayoutFooterProps from './types';
 
-const LanguageSelectorWrapped = (): ReactElement => (
-  <div className={styles.languageSelector}>
-    <LanguageSelector />
-  </div>
-);
-
 const LayoutFooter: FC<LayoutFooterProps> = ({ className }) => {
   const { t } = useTranslation('translation', { keyPrefix: 'layout.footer' });
   const { isDesktop, isMobile } = useMediaQuery();