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

client/utils/gatsby/layout-selector.tsx

@@ -0,0 +1,51 @@
+import React from 'react';
+import {
+  CertificationLayout,
+  DefaultLayout
+} from '../../src/components/layouts';
+import FourOhFourPage from '../../src/pages/404';
+import { isChallenge } from '../../src/utils/path-parsers';
+
+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;
+
+  if (element.type === FourOhFourPage) {
+    return (
+      <DefaultLayout pathname={pathname} showFooter={true}>
+        {element}
+      </DefaultLayout>
+    );
+  } else if (/\/certification\//.test(pathname)) {
+    return (
+      <CertificationLayout pathname={pathname}>{element}</CertificationLayout>
+    );
+  } else if (isChallenge(pathname)) {
+    return (
+      <DefaultLayout pathname={pathname} showFooter={false}>
+        {element}
+      </DefaultLayout>
+    );
+  } else {
+    return (
+      <DefaultLayout pathname={pathname} showFooter={true}>
+        {element}
+      </DefaultLayout>
+    );
+  }
+}