From 0036aa8969f33f4bc9c60a2e79a6912f54a08832 Mon Sep 17 00:00:00 2001
From: Raymen Deol <deol.raminder@gmail.com>
Date: Thu, 23 Sep 2021 00:15:16 -0700
Subject: [PATCH] feat(client): ts-migrate
 (/client/src/components/layouts/Certification.js) (#42939)

* change name to certification.tsx

* migrate certification.js to ts

* update ceritification import in index and fix prettier errors

* Update client/src/components/layouts/certification.tsx

Co-authored-by: Nicholas Carrigan (he/him) <nhcarrigan@gmail.com>

* Update client/src/components/layouts/certification.tsx

Co-authored-by: Oliver Eyton-Williams <ojeytonwilliams@gmail.com>

* Update client/src/components/layouts/certification.tsx

Co-authored-by: Oliver Eyton-Williams <ojeytonwilliams@gmail.com>

* Update client/src/components/layouts/certification.tsx

Co-authored-by: Nicholas Carrigan (he/him) <nhcarrigan@gmail.com>

* fix: reorder imports

Co-authored-by: Raymen Deol <raymen.deol@outlook.com>
Co-authored-by: Nicholas Carrigan (he/him) <nhcarrigan@gmail.com>
Co-authored-by: Tom <20648924+moT01@users.noreply.github.com>
Co-authored-by: Oliver Eyton-Williams <ojeytonwilliams@gmail.com>
---
 .../{Certification.js => certification.tsx}   | 27 ++++++++++---------
 client/src/components/layouts/index.ts        |  2 +-
 2 files changed, 15 insertions(+), 14 deletions(-)
 rename client/src/components/layouts/{Certification.js => certification.tsx} (64%)

diff --git a/client/src/components/layouts/Certification.js b/client/src/components/layouts/certification.tsx
similarity index 64%
rename from client/src/components/layouts/Certification.js
rename to client/src/components/layouts/certification.tsx
index a8350f4527..29aacc70d5 100644
--- a/client/src/components/layouts/Certification.js
+++ b/client/src/components/layouts/certification.tsx
@@ -1,4 +1,3 @@
-import PropTypes from 'prop-types';
 import React, { Component } from 'react';
 import Helmet from 'react-helmet';
 import { connect } from 'react-redux';
@@ -6,22 +5,33 @@ import { connect } from 'react-redux';
 import { createSelector } from 'reselect';
 import { fetchUser, isSignedInSelector, executeGA } from '../../redux';
 
+interface CertificationProps {
+  children?: React.ReactNode;
+  executeGA?: (args: { type: string; data: string }) => void;
+  fetchUser: () => void;
+  isSignedIn?: boolean;
+  pathname: string;
+}
+
 const mapStateToProps = createSelector(isSignedInSelector, isSignedIn => ({
   isSignedIn
 }));
 
 const mapDispatchToProps = { fetchUser, executeGA };
 
-class CertificationLayout extends Component {
+class CertificationLayout extends Component<CertificationProps> {
+  static displayName = 'CertificationLayout';
   componentDidMount() {
     const { isSignedIn, fetchUser, pathname } = this.props;
     if (!isSignedIn) {
       fetchUser();
     }
-    this.props.executeGA({ type: 'page', data: pathname });
+    if (this.props.executeGA) {
+      this.props.executeGA({ type: 'page', data: pathname });
+    }
   }
 
-  render() {
+  render(): JSX.Element {
     const { children } = this.props;
 
     return (
@@ -33,15 +43,6 @@ class CertificationLayout extends Component {
   }
 }
 
-CertificationLayout.displayName = 'CertificationLayout';
-CertificationLayout.propTypes = {
-  children: PropTypes.any,
-  executeGA: PropTypes.func,
-  fetchUser: PropTypes.func.isRequired,
-  isSignedIn: PropTypes.bool,
-  pathname: PropTypes.string.isRequired
-};
-
 export default connect(
   mapStateToProps,
   mapDispatchToProps
diff --git a/client/src/components/layouts/index.ts b/client/src/components/layouts/index.ts
index b66b5ece7d..a6f5e51958 100644
--- a/client/src/components/layouts/index.ts
+++ b/client/src/components/layouts/index.ts
@@ -1,3 +1,3 @@
-export { default as CertificationLayout } from './Certification';
+export { default as CertificationLayout } from './certification';
 export { default as DefaultLayout } from './Default';
 export { default as LearnLayout } from './learn';