From 63f26db3360811097e240482c04e186626f19392 Mon Sep 17 00:00:00 2001 From: Moshe Date: Fri, 9 Jul 2021 10:50:11 +0300 Subject: [PATCH] refactor(client): Replace tags to <> (#42796) * refactor(40115): Replace tags to <> --- client/src/assets/icons/API-icon.tsx | 6 +- client/src/assets/icons/D3-icon.tsx | 6 +- client/src/assets/icons/JavaScript-icon.tsx | 6 +- client/src/assets/icons/React-icon.tsx | 6 +- client/src/assets/icons/Tensorflow-icon.tsx | 6 +- client/src/assets/icons/algorithm.tsx | 6 +- client/src/assets/icons/analytics.tsx | 6 +- client/src/assets/icons/clipboard.tsx | 6 +- client/src/assets/icons/cup.tsx | 6 +- .../src/assets/icons/donate-with-PayPal.tsx | 6 +- .../src/assets/icons/green-not-completed.tsx | 4 +- client/src/assets/icons/green-pass.tsx | 6 +- client/src/assets/icons/heart.tsx | 6 +- client/src/assets/icons/intro-information.tsx | 6 +- client/src/assets/icons/python-icon.tsx | 6 +- client/src/assets/icons/responsive-design.tsx | 6 +- client/src/assets/icons/shield.tsx | 6 +- client/src/assets/icons/spacer.tsx | 6 +- client/src/assets/icons/toggle-check.tsx | 6 +- .../src/client-only-routes/show-settings.tsx | 4 +- .../client-only-routes/show-unsubscribed.tsx | 6 +- client/src/client-only-routes/show-user.tsx | 6 +- .../components/Donation/assets/ApplePay.js | 6 +- .../components/Donation/assets/GooglePay.js | 6 +- .../src/components/helpers/toggle-button.tsx | 68 +++++---- client/src/components/landing/index.js | 6 +- .../src/components/layouts/Certification.js | 6 +- client/src/components/layouts/learn.tsx | 6 +- client/src/components/profile/Profile.tsx | 18 +-- .../components/search/WithInstantSearch.js | 6 +- client/src/components/settings/internet.tsx | 6 +- client/src/components/settings/portfolio.tsx | 6 +- .../components/settings/toggle-setting.tsx | 4 +- client/src/components/settings/username.tsx | 48 ++++--- client/src/resources/honesty-policy.tsx | 6 +- .../Challenges/classic/DesktopLayout.js | 129 +++++++++--------- .../Challenges/classic/MobileLayout.js | 6 +- .../components/Challenge-Description.tsx | 6 +- .../Challenges/components/Tool-Panel.js | 94 +++++++------ 39 files changed, 272 insertions(+), 283 deletions(-) diff --git a/client/src/assets/icons/API-icon.tsx b/client/src/assets/icons/API-icon.tsx index 8e14713fc7..366620534f 100644 --- a/client/src/assets/icons/API-icon.tsx +++ b/client/src/assets/icons/API-icon.tsx @@ -1,4 +1,4 @@ -import React, { Fragment } from 'react'; +import React from 'react'; import { useTranslation } from 'react-i18next'; function APIIcon( @@ -7,12 +7,12 @@ function APIIcon( const { t } = useTranslation(); return ( - + <> {t('icons.api')} - + ); } diff --git a/client/src/assets/icons/D3-icon.tsx b/client/src/assets/icons/D3-icon.tsx index 8793dd6722..bb2745b3ae 100644 --- a/client/src/assets/icons/D3-icon.tsx +++ b/client/src/assets/icons/D3-icon.tsx @@ -1,4 +1,4 @@ -import React, { Fragment } from 'react'; +import React from 'react'; import { useTranslation } from 'react-i18next'; function D3Icon( @@ -7,7 +7,7 @@ function D3Icon( const { t } = useTranslation(); return ( - + <> {t('icons.d3')} - + ); } diff --git a/client/src/assets/icons/JavaScript-icon.tsx b/client/src/assets/icons/JavaScript-icon.tsx index 08b41ad8d0..37e3be6967 100644 --- a/client/src/assets/icons/JavaScript-icon.tsx +++ b/client/src/assets/icons/JavaScript-icon.tsx @@ -1,4 +1,4 @@ -import React, { Fragment } from 'react'; +import React from 'react'; import { useTranslation } from 'react-i18next'; function JavaScriptIcon( @@ -7,12 +7,12 @@ function JavaScriptIcon( const { t } = useTranslation(); return ( - + <> {t('icons.javascript')} - + ); } diff --git a/client/src/assets/icons/React-icon.tsx b/client/src/assets/icons/React-icon.tsx index a170d652de..e98039db91 100644 --- a/client/src/assets/icons/React-icon.tsx +++ b/client/src/assets/icons/React-icon.tsx @@ -1,4 +1,4 @@ -import React, { Fragment } from 'react'; +import React from 'react'; import { useTranslation } from 'react-i18next'; function ReactIcon( @@ -7,12 +7,12 @@ function ReactIcon( const { t } = useTranslation(); return ( - + <> {t('icons.react')} - + ); } diff --git a/client/src/assets/icons/Tensorflow-icon.tsx b/client/src/assets/icons/Tensorflow-icon.tsx index 341d1c64ac..650c0d87d5 100644 --- a/client/src/assets/icons/Tensorflow-icon.tsx +++ b/client/src/assets/icons/Tensorflow-icon.tsx @@ -1,4 +1,4 @@ -import React, { Fragment } from 'react'; +import React from 'react'; import { useTranslation } from 'react-i18next'; function TensorflowIcon( @@ -7,12 +7,12 @@ function TensorflowIcon( const { t } = useTranslation(); return ( - + <> {t('icons.tensorflow')} - + ); } diff --git a/client/src/assets/icons/algorithm.tsx b/client/src/assets/icons/algorithm.tsx index e92de43686..eeaf12a0dc 100644 --- a/client/src/assets/icons/algorithm.tsx +++ b/client/src/assets/icons/algorithm.tsx @@ -1,4 +1,4 @@ -import React, { Fragment } from 'react'; +import React from 'react'; import { useTranslation } from 'react-i18next'; function Algorithm( @@ -7,12 +7,12 @@ function Algorithm( const { t } = useTranslation(); return ( - + <> {t('icons.algorithm')} - + ); } diff --git a/client/src/assets/icons/analytics.tsx b/client/src/assets/icons/analytics.tsx index 39aef5ef00..cd5ceef277 100644 --- a/client/src/assets/icons/analytics.tsx +++ b/client/src/assets/icons/analytics.tsx @@ -1,4 +1,4 @@ -import React, { Fragment } from 'react'; +import React from 'react'; import { useTranslation } from 'react-i18next'; function Analytics( @@ -7,12 +7,12 @@ function Analytics( const { t } = useTranslation(); return ( - + <> {t('icons.analytics')} - + ); } diff --git a/client/src/assets/icons/clipboard.tsx b/client/src/assets/icons/clipboard.tsx index e8bbdf5560..3ec7ca99f4 100644 --- a/client/src/assets/icons/clipboard.tsx +++ b/client/src/assets/icons/clipboard.tsx @@ -1,4 +1,4 @@ -import React, { Fragment } from 'react'; +import React from 'react'; import { useTranslation } from 'react-i18next'; function Clipboard( @@ -7,12 +7,12 @@ function Clipboard( const { t } = useTranslation(); return ( - + <> {t('icons.clipboard')} - + ); } diff --git a/client/src/assets/icons/cup.tsx b/client/src/assets/icons/cup.tsx index 673a973bab..6d58423a0f 100644 --- a/client/src/assets/icons/cup.tsx +++ b/client/src/assets/icons/cup.tsx @@ -1,4 +1,4 @@ -import React, { Fragment } from 'react'; +import React from 'react'; import { useTranslation } from 'react-i18next'; function Cup( @@ -7,7 +7,7 @@ function Cup( const { t } = useTranslation(); return ( - + <> {t('icons.gold-cup')} - + ); } diff --git a/client/src/assets/icons/donate-with-PayPal.tsx b/client/src/assets/icons/donate-with-PayPal.tsx index c0af22775e..4c6e3e6234 100644 --- a/client/src/assets/icons/donate-with-PayPal.tsx +++ b/client/src/assets/icons/donate-with-PayPal.tsx @@ -1,4 +1,4 @@ -import React, { Fragment } from 'react'; +import React from 'react'; import { useTranslation } from 'react-i18next'; function DonateWithPayPal( @@ -7,7 +7,7 @@ function DonateWithPayPal( const { t } = useTranslation(); return ( - + <> {t('icons.donate')} - + ); } diff --git a/client/src/assets/icons/green-not-completed.tsx b/client/src/assets/icons/green-not-completed.tsx index 52cf480ee7..2351628e4d 100644 --- a/client/src/assets/icons/green-not-completed.tsx +++ b/client/src/assets/icons/green-not-completed.tsx @@ -7,7 +7,7 @@ function GreenNotCompleted( const { t } = useTranslation(); return ( - + <> {t('icons.not-passed')} - + ); } diff --git a/client/src/assets/icons/green-pass.tsx b/client/src/assets/icons/green-pass.tsx index e2ff150bd4..c4075c6b5e 100644 --- a/client/src/assets/icons/green-pass.tsx +++ b/client/src/assets/icons/green-pass.tsx @@ -1,4 +1,4 @@ -import React, { Fragment } from 'react'; +import React from 'react'; import { useTranslation } from 'react-i18next'; function GreenPass( @@ -7,7 +7,7 @@ function GreenPass( const { t } = useTranslation(); return ( - + <> {t('icons.passed')} - + ); } diff --git a/client/src/assets/icons/heart.tsx b/client/src/assets/icons/heart.tsx index 93d0d25070..6e5678ee2a 100644 --- a/client/src/assets/icons/heart.tsx +++ b/client/src/assets/icons/heart.tsx @@ -1,4 +1,4 @@ -import React, { Fragment } from 'react'; +import React from 'react'; import { useTranslation } from 'react-i18next'; function Heart( @@ -7,7 +7,7 @@ function Heart( const { t } = useTranslation(); return ( - + <> {t('icons.heart')} - + ); } diff --git a/client/src/assets/icons/intro-information.tsx b/client/src/assets/icons/intro-information.tsx index 79ff1c56ca..dc369dc3dd 100644 --- a/client/src/assets/icons/intro-information.tsx +++ b/client/src/assets/icons/intro-information.tsx @@ -1,4 +1,4 @@ -import React, { Fragment } from 'react'; +import React from 'react'; import { useTranslation } from 'react-i18next'; function IntroInformation( @@ -7,7 +7,7 @@ function IntroInformation( const { t } = useTranslation(); return ( - + <> {t('icons.info')} - + ); } diff --git a/client/src/assets/icons/python-icon.tsx b/client/src/assets/icons/python-icon.tsx index 5d1188488a..9f53e2aa96 100644 --- a/client/src/assets/icons/python-icon.tsx +++ b/client/src/assets/icons/python-icon.tsx @@ -1,4 +1,4 @@ -import React, { Fragment } from 'react'; +import React from 'react'; import { useTranslation } from 'react-i18next'; function PythonIcon( @@ -7,12 +7,12 @@ function PythonIcon( const { t } = useTranslation(); return ( - + <> {t('icons.python')} - + ); } diff --git a/client/src/assets/icons/responsive-design.tsx b/client/src/assets/icons/responsive-design.tsx index 0e5e398954..c74eb96ac3 100644 --- a/client/src/assets/icons/responsive-design.tsx +++ b/client/src/assets/icons/responsive-design.tsx @@ -1,4 +1,4 @@ -import React, { Fragment } from 'react'; +import React from 'react'; import { useTranslation } from 'react-i18next'; function ResponsiveDesign( @@ -7,12 +7,12 @@ function ResponsiveDesign( const { t } = useTranslation(); return ( - + <> {t('icons.responsive-design')} - + ); } diff --git a/client/src/assets/icons/shield.tsx b/client/src/assets/icons/shield.tsx index cb6c408abb..751c450571 100644 --- a/client/src/assets/icons/shield.tsx +++ b/client/src/assets/icons/shield.tsx @@ -1,4 +1,4 @@ -import React, { Fragment } from 'react'; +import React from 'react'; import { useTranslation } from 'react-i18next'; function Shield( @@ -7,12 +7,12 @@ function Shield( const { t } = useTranslation(); return ( - + <> {t('icons.shield')} - + ); } diff --git a/client/src/assets/icons/spacer.tsx b/client/src/assets/icons/spacer.tsx index f4daee9ba1..9d91b61e71 100644 --- a/client/src/assets/icons/spacer.tsx +++ b/client/src/assets/icons/spacer.tsx @@ -1,4 +1,4 @@ -import React, { Fragment } from 'react'; +import React from 'react'; import { useTranslation } from 'react-i18next'; interface SpacerPropTypes { @@ -9,7 +9,7 @@ function Spacer(props: SpacerPropTypes): JSX.Element { const { t } = useTranslation(); return ( - + <> {t('icons.spacer')} - + ); } diff --git a/client/src/assets/icons/toggle-check.tsx b/client/src/assets/icons/toggle-check.tsx index 7e3e341d56..8c2fb184e6 100644 --- a/client/src/assets/icons/toggle-check.tsx +++ b/client/src/assets/icons/toggle-check.tsx @@ -1,4 +1,4 @@ -import React, { Fragment } from 'react'; +import React from 'react'; import { useTranslation } from 'react-i18next'; function ToggleCheck( @@ -7,7 +7,7 @@ function ToggleCheck( const { t } = useTranslation(); return ( - + <> {t('icons.toggle')} - + ); } diff --git a/client/src/client-only-routes/show-settings.tsx b/client/src/client-only-routes/show-settings.tsx index 2a58d8621a..6a9c228a9f 100644 --- a/client/src/client-only-routes/show-settings.tsx +++ b/client/src/client-only-routes/show-settings.tsx @@ -129,7 +129,7 @@ export function ShowSettings(props: IShowSettingsProps): JSX.Element { } return ( - + <>
@@ -197,7 +197,7 @@ export function ShowSettings(props: IShowSettingsProps): JSX.Element {
- + ); } diff --git a/client/src/client-only-routes/show-unsubscribed.tsx b/client/src/client-only-routes/show-unsubscribed.tsx index 9a130c7ebc..4b22879012 100644 --- a/client/src/client-only-routes/show-unsubscribed.tsx +++ b/client/src/client-only-routes/show-unsubscribed.tsx @@ -1,4 +1,4 @@ -import React, { Fragment } from 'react'; +import React from 'react'; import { Grid, Panel, Button } from '@freecodecamp/react-bootstrap'; import Helmet from 'react-helmet'; import { useTranslation } from 'react-i18next'; @@ -16,7 +16,7 @@ function ShowUnsubscribed({ }): JSX.Element { const { t } = useTranslation(); return ( - + <> {t('metaTags:youre-unsubscribed')} | freeCodeCamp.org @@ -45,7 +45,7 @@ function ShowUnsubscribed({ - + ); } diff --git a/client/src/client-only-routes/show-user.tsx b/client/src/client-only-routes/show-user.tsx index 835852ebfb..d199e89791 100644 --- a/client/src/client-only-routes/show-user.tsx +++ b/client/src/client-only-routes/show-user.tsx @@ -1,4 +1,4 @@ -import React, { Component, Fragment } from 'react'; +import React, { Component } from 'react'; import { connect } from 'react-redux'; import { createSelector } from 'reselect'; import { @@ -120,7 +120,7 @@ class ShowUser extends Component { const { textarea } = this.state; const placeholderText = t('report.details'); return ( - + <> {t('report.portfolio')} | freeCodeCamp.org @@ -157,7 +157,7 @@ class ShowUser extends Component { {/* eslint-disable @typescript-eslint/unbound-method */} - + ); } } diff --git a/client/src/components/Donation/assets/ApplePay.js b/client/src/components/Donation/assets/ApplePay.js index ae321fca4a..70d2427318 100644 --- a/client/src/components/Donation/assets/ApplePay.js +++ b/client/src/components/Donation/assets/ApplePay.js @@ -1,11 +1,11 @@ /* eslint-disable max-len */ -import React, { Fragment } from 'react'; +import React from 'react'; const propTypes = {}; function ApplePay(props) { return ( - + <> Apple Pay Logo - + ); } diff --git a/client/src/components/Donation/assets/GooglePay.js b/client/src/components/Donation/assets/GooglePay.js index d285043c8b..bbea2fe4e4 100644 --- a/client/src/components/Donation/assets/GooglePay.js +++ b/client/src/components/Donation/assets/GooglePay.js @@ -1,11 +1,11 @@ /* eslint-disable max-len */ -import React, { Fragment } from 'react'; +import React from 'react'; const propTypes = {}; function GooglePay(props) { return ( - + <> Google Pay Logo - + ); } diff --git a/client/src/components/helpers/toggle-button.tsx b/client/src/components/helpers/toggle-button.tsx index c2f3a93458..7657175490 100644 --- a/client/src/components/helpers/toggle-button.tsx +++ b/client/src/components/helpers/toggle-button.tsx @@ -1,4 +1,4 @@ -import React, { Fragment } from 'react'; +import React from 'react'; import { ToggleButtonGroup as BSBG, ToggleButton as TB @@ -36,40 +36,38 @@ export default function ToggleButton({ width: '20px' }; return ( - - - - {value ? ( - - ) : ( - - )} - {onLabel} - - - {offLabel} - {!value ? ( - - ) : ( - - )} - - - + + + {value ? ( + + ) : ( + + )} + {onLabel} + + + {offLabel} + {!value ? ( + + ) : ( + + )} + + ); } diff --git a/client/src/components/landing/index.js b/client/src/components/landing/index.js index 20d44e90d7..e0a6c6f015 100644 --- a/client/src/components/landing/index.js +++ b/client/src/components/landing/index.js @@ -1,4 +1,4 @@ -import React, { Fragment } from 'react'; +import React from 'react'; import { Grid } from '@freecodecamp/react-bootstrap'; import Helmet from 'react-helmet'; import PropTypes from 'prop-types'; @@ -19,7 +19,7 @@ export const Landing = ({ page = 'landing' }) => { const { t } = useTranslation(); return ( - + <> {t('metaTags:title')} @@ -35,7 +35,7 @@ export const Landing = ({ page = 'landing' }) => { - + ); }; diff --git a/client/src/components/layouts/Certification.js b/client/src/components/layouts/Certification.js index 5b31a4457d..cc02f20593 100644 --- a/client/src/components/layouts/Certification.js +++ b/client/src/components/layouts/Certification.js @@ -1,4 +1,4 @@ -import React, { Fragment, Component } from 'react'; +import React, { Component } from 'react'; import PropTypes from 'prop-types'; import { connect } from 'react-redux'; @@ -25,10 +25,10 @@ class CertificationLayout extends Component { const { children } = this.props; return ( - + <> {children} - + ); } } diff --git a/client/src/components/layouts/learn.tsx b/client/src/components/layouts/learn.tsx index bde898e350..4c64dcdc72 100644 --- a/client/src/components/layouts/learn.tsx +++ b/client/src/components/layouts/learn.tsx @@ -1,4 +1,4 @@ -import React, { Fragment, Component } from 'react'; +import React, { Component } from 'react'; import { createSelector } from 'reselect'; import { connect } from 'react-redux'; import { Helmet } from 'react-helmet'; @@ -83,7 +83,7 @@ class LearnLayout extends Component { } return ( - + <> @@ -91,7 +91,7 @@ class LearnLayout extends Component { {/* eslint-disable-next-line @typescript-eslint/ban-ts-comment */ /* @ts-ignore */} - + ); } } diff --git a/client/src/components/profile/Profile.tsx b/client/src/components/profile/Profile.tsx index 87a263661e..0899cbc778 100644 --- a/client/src/components/profile/Profile.tsx +++ b/client/src/components/profile/Profile.tsx @@ -1,4 +1,4 @@ -import React, { Fragment } from 'react'; +import React from 'react'; import { Grid, Row } from '@freecodecamp/react-bootstrap'; import Helmet from 'react-helmet'; import { TFunction, useTranslation } from 'react-i18next'; @@ -58,7 +58,7 @@ function renderMessage( t: TFunction<'translation'> ): JSX.Element { return isSessionUser ? ( - + <>

{t('profile.you-not-public')}

 @@ -66,9 +66,9 @@ function renderMessage(

{t('profile.you-change-privacy')}

- + ) : ( - + <>

{t('profile.username-not-public', { username: username })} @@ -84,7 +84,7 @@ function renderMessage( {t('buttons.take-me')} - + ); } @@ -124,7 +124,7 @@ function renderProfile(user: IProfileProps['user']): JSX.Element { isDonating } = user; return ( - + <> ) : null} - + ); } @@ -164,7 +164,7 @@ function Profile({ user, isSessionUser }: IProfileProps): JSX.Element { } = user; return ( - + <> {t('buttons.profile')} | freeCodeCamp.org @@ -182,7 +182,7 @@ function Profile({ user, isSessionUser }: IProfileProps): JSX.Element { )} - + ); } diff --git a/client/src/components/search/WithInstantSearch.js b/client/src/components/search/WithInstantSearch.js index 8505611e4b..619f4712c4 100644 --- a/client/src/components/search/WithInstantSearch.js +++ b/client/src/components/search/WithInstantSearch.js @@ -1,4 +1,4 @@ -import React, { Component, Fragment } from 'react'; +import React, { Component } from 'react'; import { Location } from '@reach/router'; import PropTypes from 'prop-types'; import { connect } from 'react-redux'; @@ -139,14 +139,14 @@ class InstantSearchRoot extends Component { {this.isSearchPage() ? ( ) : ( - + <> - + )} {this.props.children} diff --git a/client/src/components/settings/internet.tsx b/client/src/components/settings/internet.tsx index ab85769a36..676795db02 100644 --- a/client/src/components/settings/internet.tsx +++ b/client/src/components/settings/internet.tsx @@ -1,4 +1,4 @@ -import React, { Fragment, Component } from 'react'; +import React, { Component } from 'react'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { faCheck } from '@fortawesome/free-solid-svg-icons'; import { @@ -190,7 +190,7 @@ class InternetSettings extends Component { this.getValidationStateFor(website); return ( - + <> {t('settings.headings.internet')}
@@ -255,7 +255,7 @@ class InternetSettings extends Component { />
- + ); } } diff --git a/client/src/components/settings/portfolio.tsx b/client/src/components/settings/portfolio.tsx index 3798362c75..7c235b05ca 100644 --- a/client/src/components/settings/portfolio.tsx +++ b/client/src/components/settings/portfolio.tsx @@ -1,4 +1,4 @@ -import React, { Component, FormEvent, Fragment } from 'react'; +import React, { Component, FormEvent } from 'react'; import { nanoid } from 'nanoid'; import { Button, @@ -303,11 +303,11 @@ class PortfolioSettings extends Component { {index + 1 !== arr.length && ( - + <>
- + )} diff --git a/client/src/components/settings/toggle-setting.tsx b/client/src/components/settings/toggle-setting.tsx index d49497a346..2026d55e02 100644 --- a/client/src/components/settings/toggle-setting.tsx +++ b/client/src/components/settings/toggle-setting.tsx @@ -31,7 +31,7 @@ export default function ToggleSetting({ ...restProps }: ToggleSettingProps): JSX.Element { return ( - + <>
@@ -51,7 +51,7 @@ export default function ToggleSetting({
- + ); } diff --git a/client/src/components/settings/username.tsx b/client/src/components/settings/username.tsx index 122ab54a55..d077d76ef0 100644 --- a/client/src/components/settings/username.tsx +++ b/client/src/components/settings/username.tsx @@ -1,5 +1,5 @@ /* eslint-disable @typescript-eslint/unbound-method */ -import React, { Component, Fragment } from 'react'; +import React, { Component } from 'react'; import { bindActionCreators } from 'redux'; import { connect } from 'react-redux'; import { createSelector } from 'reselect'; @@ -203,31 +203,29 @@ class UsernameSettings extends Component { const { isValidUsername, t, validating } = this.props; return ( - -
- - - - {t('settings.labels.username')} - - - - - {!isFormPristine && - this.renderAlerts(validating, error, isValidUsername)} - - + + + + {t('settings.labels.username')} + + - - -
+ + + {!isFormPristine && + this.renderAlerts(validating, error, isValidUsername)} + + + + ); } } diff --git a/client/src/resources/honesty-policy.tsx b/client/src/resources/honesty-policy.tsx index aea9e190b4..dea6b82c46 100644 --- a/client/src/resources/honesty-policy.tsx +++ b/client/src/resources/honesty-policy.tsx @@ -1,4 +1,4 @@ -import React, { Fragment } from 'react'; +import React from 'react'; import { Trans, useTranslation } from 'react-i18next'; const HonestyPolicy = (): JSX.Element => { @@ -6,7 +6,7 @@ const HonestyPolicy = (): JSX.Element => { const email = 'team@freecodecamp.org'; return ( - + <>

{t('settings.honesty.p1')}

{t('settings.honesty.p2')}

{t('settings.honesty.p3')}

@@ -19,7 +19,7 @@ const HonestyPolicy = (): JSX.Element => {

test

- + ); }; diff --git a/client/src/templates/Challenges/classic/DesktopLayout.js b/client/src/templates/Challenges/classic/DesktopLayout.js index 67939aff3e..3f627614b3 100644 --- a/client/src/templates/Challenges/classic/DesktopLayout.js +++ b/client/src/templates/Challenges/classic/DesktopLayout.js @@ -1,4 +1,4 @@ -import React, { Component, Fragment } from 'react'; +import React, { Component } from 'react'; import { ReflexContainer, ReflexSplitter, ReflexElement } from 'react-reflex'; import PropTypes from 'prop-types'; import { first } from 'lodash-es'; @@ -83,82 +83,77 @@ class DesktopLayout extends Component { layoutState; return ( - - - {projectBasedChallenge && ( - - )} - - - {!projectBasedChallenge && ( - - {instructions} - - )} - {!projectBasedChallenge && ( - - )} - + + {projectBasedChallenge && ( + + )} + + + {!projectBasedChallenge && ( - {challengeFile && - showUpcomingChanges && - !hasEditableBoundries && } - {challengeFile && ( - + )} + {!projectBasedChallenge && ( + + )} + + + {challengeFile && + showUpcomingChanges && + !hasEditableBoundries && } + {challengeFile && ( + + + {editor} + + {isConsoleDisplayable && ( + + )} + {isConsoleDisplayable && ( - {editor} + {testOutput} - {isConsoleDisplayable && ( - - )} - {isConsoleDisplayable && ( - - {testOutput} - - )} - - )} + )} + + )} + + {isPreviewDisplayable && ( + + )} + {isPreviewDisplayable && ( + + {preview} - {isPreviewDisplayable && ( - - )} - {isPreviewDisplayable && ( - - {preview} - - )} - - - - + )} + + + ); } } diff --git a/client/src/templates/Challenges/classic/MobileLayout.js b/client/src/templates/Challenges/classic/MobileLayout.js index 29ea12dc36..dd8d9af2d3 100644 --- a/client/src/templates/Challenges/classic/MobileLayout.js +++ b/client/src/templates/Challenges/classic/MobileLayout.js @@ -1,4 +1,4 @@ -import React, { Component, Fragment } from 'react'; +import React, { Component } from 'react'; import PropTypes from 'prop-types'; import { TabPane, Tabs } from '@freecodecamp/react-bootstrap'; import { connect } from 'react-redux'; @@ -60,7 +60,7 @@ class MobileLayout extends Component { }; return ( - + <> - + ); } } diff --git a/client/src/templates/Challenges/components/Challenge-Description.tsx b/client/src/templates/Challenges/components/Challenge-Description.tsx index 60173e29c8..6f07d7f566 100644 --- a/client/src/templates/Challenges/components/Challenge-Description.tsx +++ b/client/src/templates/Challenges/components/Challenge-Description.tsx @@ -1,4 +1,4 @@ -import React, { Fragment } from 'react'; +import React from 'react'; import PrismFormatted from './prism-formatted'; import './challenge-description.css'; @@ -18,10 +18,10 @@ function ChallengeDescription(challenge: Challenge): JSX.Element { > {challenge.description && } {challenge.instructions && ( - + <>
- + )}
diff --git a/client/src/templates/Challenges/components/Tool-Panel.js b/client/src/templates/Challenges/components/Tool-Panel.js index 1c0581f539..23afc5e5e7 100644 --- a/client/src/templates/Challenges/components/Tool-Panel.js +++ b/client/src/templates/Challenges/components/Tool-Panel.js @@ -1,4 +1,4 @@ -import React, { Fragment } from 'react'; +import React from 'react'; import PropTypes from 'prop-types'; import { bindActionCreators } from 'redux'; import { connect } from 'react-redux'; @@ -49,59 +49,57 @@ function ToolPanel({ }; const { t } = useTranslation(); return ( - -
+ + - - - {guideUrl ? ( - - {t('buttons.get-hint')} - - ) : null} - {videoUrl ? ( - - {t('buttons.watch-video')} - - ) : null} + {isMobile ? t('buttons.reset') : t('buttons.reset-code')} + + + {guideUrl ? ( - {t('buttons.ask-for-help')} + {t('buttons.get-hint')} - -
- + ) : null} + {videoUrl ? ( + + {t('buttons.watch-video')} + + ) : null} + + {t('buttons.ask-for-help')} + + + ); }