refactor(client): full-width-row to TypeScript

client/src/client-only-routes/ShowUnsubscribed.js

@@ -5,7 +5,7 @@ import Helmet from 'react-helmet';
 import { useTranslation } from 'react-i18next';
 
 import envData from '../../../config/env.json';
-import FullWidthRow from '../components/helpers/FullWidthRow';
+import FullWidthRow from '../components/helpers/full-width-row';
 import { Spacer } from '../components/helpers';
 
 const { apiLocation } = envData;

client/src/components/helpers/full-width-row.tsx

@@ -1,8 +1,13 @@
 import React from 'react';
-import PropTypes from 'prop-types';
 import { Row, Col } from '@freecodecamp/react-bootstrap';
 
-function FullWidthRow({ children, className }) {
+function FullWidthRow({
+  children,
+  className
+}: {
+  children?: React.ReactNode;
+  className?: string;
+}): JSX.Element {
   return (
     <Row className={className}>
       <Col sm={8} smOffset={2} xs={12}>
@@ -13,9 +18,5 @@ function FullWidthRow({ children, className }) {
 }
 
 FullWidthRow.displayName = 'FullWidthRow';
-FullWidthRow.propTypes = {
-  children: PropTypes.any,
-  className: PropTypes.string
-};
 
 export default FullWidthRow;

client/src/components/helpers/index.js

@@ -1,5 +1,5 @@
 export { default as ButtonSpacer } from './ButtonSpacer';
-export { default as FullWidthRow } from './FullWidthRow';
+export { default as FullWidthRow } from './full-width-row';
 export { default as SlimWidthRow } from './slim-width-row';
 export { default as Loader } from './loader';
 export { default as SkeletonSprite } from './skeleton-sprite';

client/src/components/profile/components/HeatMap.js

@@ -9,7 +9,7 @@ import startOfDay from 'date-fns/startOfDay';
 import isEqual from 'date-fns/isEqual';
 import { useTranslation } from 'react-i18next';
 
-import FullWidthRow from '../../helpers/FullWidthRow';
+import FullWidthRow from '../../helpers/full-width-row';
 import Spacer from '../../helpers/spacer';
 
 import '@freecodecamp/react-calendar-heatmap/dist/styles.css';

client/src/components/settings/Email.js

@@ -17,7 +17,7 @@ import { Trans, withTranslation } from 'react-i18next';
 import { updateMyEmail } from '../../redux/settings';
 import { maybeEmailRE } from '../../utils';
 
-import FullWidthRow from '../helpers/FullWidthRow';
+import FullWidthRow from '../helpers/full-width-row';
 import Spacer from '../helpers/spacer';
 import SectionHeader from './SectionHeader';
 import BlockSaveButton from '../helpers/form/BlockSaveButton';

client/src/components/settings/Privacy.js

@@ -9,7 +9,7 @@ import { withTranslation } from 'react-i18next';
 import { userSelector } from '../../redux';
 import { submitProfileUI } from '../../redux/settings';
 
-import FullWidthRow from '../helpers/FullWidthRow';
+import FullWidthRow from '../helpers/full-width-row';
 import Spacer from '../helpers/spacer';
 import ToggleSetting from './ToggleSetting';
 import SectionHeader from './SectionHeader';

client/src/components/settings/SectionHeader.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 
-import FullWidthRow from '../helpers/FullWidthRow';
+import FullWidthRow from '../helpers/full-width-row';
 
 const propTypes = {
   children: PropTypes.oneOfType([

client/src/components/settings/Username.js

@@ -17,7 +17,7 @@ import {
   submitNewUsername
 } from '../../redux/settings';
 import BlockSaveButton from '../helpers/form/BlockSaveButton';
-import FullWidthRow from '../helpers/FullWidthRow';
+import FullWidthRow from '../helpers/full-width-row';
 import { isValidUsername } from '../../../../utils/validate';
 
 const propTypes = {

client/src/templates/Introduction/Intro.js

@@ -6,7 +6,7 @@ import { Grid, ListGroup, ListGroupItem } from '@freecodecamp/react-bootstrap';
 import { useTranslation } from 'react-i18next';
 
 import LearnLayout from '../../components/layouts/Learn';
-import FullWidthRow from '../../components/helpers/FullWidthRow';
+import FullWidthRow from '../../components/helpers/full-width-row';
 import ButtonSpacer from '../../components/helpers/ButtonSpacer';
 import { MarkdownRemark, AllChallengeNode } from '../../redux/prop-types';