feat(client): ts-migrate layoutSelector component (#42748)

client/gatsby-browser.js

@@ -6,7 +6,7 @@ import { I18nextProvider } from 'react-i18next';
 import i18n from './i18n/config';
 import { createStore } from './src/redux/createStore';
 import AppMountNotifier from './src/components/app-mount-notifier';
-import layoutSelector from './utils/gatsby/layoutSelector';
+import layoutSelector from './utils/gatsby/layout-selector';
 
 const store = createStore();
 

client/gatsby-ssr.js

@@ -5,7 +5,7 @@ import { I18nextProvider } from 'react-i18next';
 
 import i18n from './i18n/config';
 import { createStore } from './src/redux/createStore';
-import layoutSelector from './utils/gatsby/layoutSelector';
+import layoutSelector from './utils/gatsby/layout-selector';
 import { getheadTagComponents, getPostBodyComponents } from './utils/tags';
 
 const store = createStore();

client/utils/gatsby/layout-selector.tsx

@@ -1,6 +1,4 @@
 import React from 'react';
-import PropTypes from 'prop-types';
-
 import {
   CertificationLayout,
   DefaultLayout
@@ -8,7 +6,21 @@ import {
 import FourOhFourPage from '../../src/pages/404';
 import { isChallenge } from '../../src/utils/path-parsers';
 
-export default function layoutSelector({ element, props }) {
+interface Location {
+  pathname: string;
+}
+
+interface LayoutSelectorProps {
+  props: {
+    location: Location;
+  };
+  element: React.ReactElement;
+}
+
+export default function layoutSelector({
+  element,
+  props
+}: LayoutSelectorProps): React.ReactElement {
   const {
     location: { pathname }
   } = props;
@@ -37,9 +49,3 @@ export default function layoutSelector({ element, props }) {
     );
   }
 }
-
-layoutSelector.propTypes = {
-  element: PropTypes.any,
-  location: PropTypes.objectOf({ pathname: PropTypes.string }),
-  props: PropTypes.any
-};

client/utils/gatsby/layoutSelector.test.js

@@ -2,7 +2,7 @@ import React from 'react';
 import { Provider } from 'react-redux';
 import ShallowRenderer from 'react-test-renderer/shallow';
 
-import layoutSelector from './layoutSelector';
+import layoutSelector from './layout-selector';
 import { createStore } from '../../src/redux/createStore';
 import FourOhFourPage from '../../src/pages/404';
 import Learn from '../../src/pages/learn';