feat(client): ts-migrate Challenges/components/ (#42582)

Co-authored-by: Parth Parth <thecodingaviator@users.noreply.github.com>

client/src/templates/Challenges/classic/Show.tsx

@@ -16,7 +16,7 @@ import LearnLayout from '../../../components/layouts/Learn';
 import MultifileEditor from './MultifileEditor';
 import Preview from '../components/Preview';
 import SidePanel from '../components/Side-Panel';
-import Output from '../components/Output';
+import Output from '../components/output';
 import CompletionModal from '../components/completion-modal';
 import HelpModal from '../components/HelpModal';
 import VideoModal from '../components/VideoModal';
@@ -290,6 +290,7 @@ class ShowClassic extends Component<ShowClassicProps, ShowClassicState> {
   renderEditor() {
     const { files } = this.props;
     const { description } = this.getChallenge();
+    // eslint-disable-next-line @typescript-eslint/no-unsafe-return
     return (
       files && (
         <MultifileEditor

client/src/templates/Challenges/components/output.tsx

@@ -1,17 +1,16 @@
 import React, { Component } from 'react';
-import PropTypes from 'prop-types';
 import sanitizeHtml from 'sanitize-html';
 
 import './output.css';
 import { isEmpty } from 'lodash-es';
 
-const propTypes = {
-  defaultOutput: PropTypes.string,
-  output: PropTypes.arrayOf(PropTypes.string)
-};
+interface OutputProps {
+  defaultOutput: string;
+  output: string[];
+}
 
-class Output extends Component {
-  render() {
+class Output extends Component<OutputProps> {
+  render(): JSX.Element {
     const { output, defaultOutput } = this.props;
     const message = sanitizeHtml(
       !isEmpty(output) ? output.join('\n') : defaultOutput,
@@ -28,7 +27,4 @@ class Output extends Component {
   }
 }
 
-Output.displayName = 'Output';
-Output.propTypes = propTypes;
-
 export default Output;

client/src/templates/Challenges/projects/backend/Show.tsx

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-unsafe-assignment */
 /* eslint-disable @typescript-eslint/no-unsafe-call */
 /* eslint-disable @typescript-eslint/no-unsafe-member-access */
 // Package Utilities
@@ -26,7 +27,7 @@ import LearnLayout from '../../../../components/layouts/Learn';
 import ChallengeTitle from '../../components/challenge-title';
 import ChallengeDescription from '../../components/Challenge-Description';
 import TestSuite from '../../components/Test-Suite';
-import Output from '../../components/Output';
+import Output from '../../components/output';
 import CompletionModal from '../../components/completion-modal';
 import HelpModal from '../../components/HelpModal';
 import ProjectToolPanel from '../Tool-Panel';
@@ -249,8 +250,6 @@ class BackEnd extends Component<BackEndProps> {
 *
 *
 */`}
-                  dimensions={this.state}
-                  height={150}
                   output={output}
                 />
                 <TestSuite tests={tests} />