Small code refactor

README.md

@@ -1,7 +1,9 @@
 # Rafael Barea Hidalgo
+
 ## Inicialización pre-mejora
 
 Para lanzar el proyecto:
+
 - Instalar las dependecias del proyecto ejecutando el comando **`npm install`** en una terminal en la carpeta del proyecto.
 - Tras instalra las dependecias iniciar el servidor en modo desarrollador con el comando **`npm start`**.
 - El servidor se abrirá en la dirección [http://localhost:3000](http://localhost:3000)

src/App.test.tsx

@@ -1,8 +1,8 @@
-import React from 'react';
-import { render } from '@testing-library/react';
-import App from './App';
+import React from "react";
+import { render } from "@testing-library/react";
+import App from "./App";
 
-test('renders learn react link', () => {
+test("renders learn react link", () => {
   const { getByText } = render(<App />);
   const linkElement = getByText(/learn react/i);
   expect(linkElement).toBeInTheDocument();

src/components/Central.tsx

@@ -1,9 +1,9 @@
 import React from "react";
-import Stepper from '@material-ui/core/Stepper';
-import Step from '@material-ui/core/Step';
-import StepLabel from '@material-ui/core/StepLabel';
-import Button from '@material-ui/core/Button';
-import Typography from '@material-ui/core/Typography';
+import Stepper from "@material-ui/core/Stepper";
+import Step from "@material-ui/core/Step";
+import StepLabel from "@material-ui/core/StepLabel";
+import Button from "@material-ui/core/Button";
+import Typography from "@material-ui/core/Typography";
 
 /*
 function Central(props: any) {
@@ -169,90 +169,99 @@ interface ICentralProps {
   setActiveStep: (arg0: number) => void;
 }
 
-interface ICentralState {
-
-}
+interface ICentralState {}
 
 class Centrals extends React.Component<ICentralProps, ICentralState> {
-  steps = ['Seleccionar oficina', 'Seleccionar Área', 'Datos del interesado', 'Datos del representante', 'Otros datos'];
+  steps = [
+    "Seleccionar oficina",
+    "Seleccionar Área",
+    "Datos del interesado",
+    "Datos del representante",
+    "Otros datos",
+  ];
 
   constructor(props: ICentralProps) {
     super(props);
   }
 
   isStepOptional(step: number) {
-    return step === 3
+    return step === 3;
   }
 
-  handleNext= ()=> {
-    console.log(this.props)
+  handleNext = () => {
+    console.log(this.props);
     this.props.setActiveStep(this.props.current + 1);
-    console.log(this.props.current)
+    console.log(this.props.current);
   };
 
-  handleBack=()=>{
+  handleBack = () => {
     this.props.setActiveStep(this.props.current - 1);
   };
   getStepContent(step: number) {
     switch (step) {
       case 0:
-        return 'Select campaign settings...';
+        return "Select campaign settings...";
       case 1:
-        return 'What is an ad group anyways?';
+        return "What is an ad group anyways?";
       case 2:
-        return 'This is the bit I really care about!';
-        case 3:
-        return '3!';
-        case 4:
-        return '4!';
+        return "This is the bit I really care about!";
+      case 3:
+        return "3!";
+      case 4:
+        return "4!";
       default:
-        return 'Unknown step';
+        return "Unknown step";
     }
   }
   render() {
-    return(
+    return (
       <div>
-      <Stepper activeStep={this.props.current}>
-        {this.steps.map((label, index) => {
-          const stepProps: { completed?: boolean } = {};
-          const labelProps: { optional?: React.ReactNode } = {};
-          if (this.isStepOptional(index)) {
-            labelProps.optional = <Typography variant="caption">Opcional</Typography>;
-          }
-          return (
-            <Step key={label} {...stepProps}>
-              <StepLabel {...labelProps}>{label}</StepLabel>
-            </Step>
-          );
-        })}
-      </Stepper>
-      <div>
-      {this.props.current === this.steps.length ? (
+        <Stepper activeStep={this.props.current}>
+          {this.steps.map((label, index) => {
+            const stepProps: { completed?: boolean } = {};
+            const labelProps: { optional?: React.ReactNode } = {};
+            if (this.isStepOptional(index)) {
+              labelProps.optional = (
+                <Typography variant="caption">Opcional</Typography>
+              );
+            }
+            return (
+              <Step key={label} {...stepProps}>
+                <StepLabel {...labelProps}>{label}</StepLabel>
+              </Step>
+            );
+          })}
+        </Stepper>
         <div>
-          <Typography>
-            Has completado todos los pasos
-          </Typography>
-        </div>
-      ) : (
-        <div>
-          <Typography>{this.getStepContent(this.props.current)}</Typography>
-          <div>
-            <Button disabled={this.props.current === 0} onClick={this.handleBack}>
-              Volver
-            </Button>
-            <Button
-              variant="contained"
-              color="primary"
-              onClick={this.handleNext}
-            >
-              {this.props.current === this.steps.length - 1 ? 'Finish' : 'Next'}
-            </Button>
-          </div>
+          {this.props.current === this.steps.length ? (
+            <div>
+              <Typography>Has completado todos los pasos</Typography>
+            </div>
+          ) : (
+            <div>
+              <Typography>{this.getStepContent(this.props.current)}</Typography>
+              <div>
+                <Button
+                  disabled={this.props.current === 0}
+                  onClick={this.handleBack}
+                >
+                  Volver
+                </Button>
+                <Button
+                  variant="contained"
+                  color="primary"
+                  onClick={this.handleNext}
+                >
+                  {this.props.current === this.steps.length - 1
+                    ? "Finish"
+                    : "Next"}
+                </Button>
+              </div>
+            </div>
+          )}
         </div>
-      )}
-    </div>
-    </div>
-    )
+      </div>
+    );
   }
 }
 

src/components/Header.tsx

@@ -16,8 +16,7 @@ function Header(props: IHeaderProps) {
     <div className={props.classes.cabecera}>
       <div className={props.classes.central}>
         <div className={props.classes.logo}></div>
-        <div className={props.classes.right}>
-        </div>
+        <div className={props.classes.right}></div>
       </div>
     </div>
   );

src/index.css

@@ -1,13 +1,13 @@
 body {
   margin: 0;
-  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
-    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen",
+    "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue",
     sans-serif;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
 }
 
 code {
-  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
+  font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New",
     monospace;
 }

src/index.tsx

@@ -1,14 +1,14 @@
-import React from 'react';
-import ReactDOM from 'react-dom';
-import './index.css';
-import App from './App';
-import * as serviceWorker from './serviceWorker';
+import React from "react";
+import ReactDOM from "react-dom";
+import "./index.css";
+import App from "./App";
+import * as serviceWorker from "./serviceWorker";
 
 ReactDOM.render(
   <React.StrictMode>
     <App />
   </React.StrictMode>,
-  document.getElementById('root')
+  document.getElementById("root")
 );
 
 // If you want your app to work offline and load faster, you can change

src/styledComponents/Header.js

@@ -2,5 +2,4 @@ import injectSheet from 'react-jss'
 import Header from '../components/Header'
 import classes from './Header-jss.ts'
 
-
 export default injectSheet(classes)(Header)