[homework-8]-AndrewKoldyrev

package.json

@@ -46,6 +46,7 @@
     "@storybook/addons": "^5.3.18",
     "@storybook/react": "^5.3.18",
     "@testing-library/react-hooks": "^3.2.1",
+    "@types/babel__core": "^7.20.0",
     "@types/enzyme": "^3.10.5",
     "@types/jest": "^25.1.4",
     "@types/ramda": "^0.27.6",

src/App.tsx

@@ -7,28 +7,28 @@ import { UserScreen } from "@/screens/UserScreen";
 
 export const App: React.FC<{}> = () => (
   <Router>
-      <nav>
-        <ul>
-          <li>
-            <Link to="/login">Login</Link>
-          </li>
-          <li>
-            <Link to="/field">Field</Link>
-          </li>
-          <li>
-            <Link to="/user/Nick">Nick</Link>
-          </li>
-        </ul>
-      </nav>
-      <Switch>
-        <Route path="/login">
-          <LoginScreen />
-        </Route>
-        <Route path="/field" render={() => <FieldScreen />} />
-        <Route path="/user/:name" component={UserScreen} />
-        <Route path="*">
-          <NoMatchScreen />
-        </Route>
-      </Switch>
+    <nav>
+      <ul>
+        <li>
+          <Link to="/login">Login</Link>
+        </li>
+        <li>
+          <Link to="/field">Field</Link>
+        </li>
+        <li>
+          <Link to="/user/Nick">Nick</Link>
+        </li>
+      </ul>
+    </nav>
+    <Switch>
+      <Route path="/login">
+        <LoginScreen />
+      </Route>
+      <Route path="/field" render={() => <FieldScreen />} />
+      <Route path="/user/:name" component={UserScreen} />
+      <Route path="*">
+        <NoMatchScreen />
+      </Route>
+    </Switch>
   </Router>
 );

src/api/auth.ts

@@ -1,4 +1,4 @@
-import { sleep } from '@/utils/sleep';
+import { sleep } from "@/utils/sleep";
 
 export const login = async (name: string) => {
   await sleep(1000);

src/components/GameSettingsForm/GameSettingsFormRef.tsx

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-non-null-assertion */
 import React from "react";
 import { GameSettingsFormProps } from "./interfaces";
 import { SYMBOL_OPTIONS } from "./constants";

src/components/GameSettingsForm/GameSettingsFormState.tsx

@@ -1,4 +1,4 @@
-import React, { FormEvent } from "react";
+import React, { FormEvent, Component } from "react";
 import { GameSettingsFormProps } from "./interfaces";
 import { SYMBOL_OPTIONS } from "./constants";
 import { InputColor, InputText } from "./components";
@@ -13,7 +13,7 @@ interface GameSettingsFormStateState {
   player2Symbol: string;
 }
 
-export class GameSettingsFormState extends React.Component<
+export class GameSettingsFormState extends Component<
   GameSettingsFormProps,
   GameSettingsFormStateState
 > {
@@ -42,16 +42,13 @@ export class GameSettingsFormState extends React.Component<
     });
   };
 
-  componentDidUpdate() {
-    console.log("@@GameSettingsFormState.componentDidUpdate");
-  }
-
   handleFormInputChange = (ev: FormEvent<HTMLInputElement>) => {
     this.setState({
       [(ev.target as HTMLInputElement).getAttribute(
         "name"
       ) as keyof GameSettingsFormStateState]: (ev.target as HTMLInputElement)
         .value,
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
     } as any);
   };
 

src/components/GameSettingsForm/components/Input.stories.tsx

@@ -1,6 +1,5 @@
 import React from "react";
-import { action } from "@storybook/addon-actions";
-import { withKnobs, object } from "@storybook/addon-knobs";
+import { withKnobs } from "@storybook/addon-knobs";
 
 import { InputText, InputColor } from "./";
 
@@ -9,8 +8,6 @@ export default {
   decorators: [withKnobs],
 };
 
-const elementClicked = action("Cell clicked (element)");
-
 export const inputText = () => [
   <InputText key="jsx" placeholder="textInput" />,
 ];

src/components/GameSettingsForm/components/InputText.jsx

@@ -0,0 +1,7 @@
+import React from "react";
+
+export const InputText =
+  React.Component >
+  ((props, ref) => <input ref={ref} type="text" {...props} />);
+
+InputText.displayName = "InputText";

src/lesson-13/homework/immutability.test.ts

@@ -1,4 +1,11 @@
-import { OriginalTeam, ExpectedTeam } from "./immutability";
+import {
+  SomeArray,
+  OriginalTeam,
+  ExpectedTeam,
+  originalTeamToExpectedTeam,
+  originalArrayToExpectedArray,
+  originalTeamToExpectedTeamDeep,
+} from "./immutability";
 
 // Задание 1
 test("team to team", () => {
@@ -9,21 +16,21 @@ test("team to team", () => {
   });
 
   const expectedTeam: ExpectedTeam = {
-    name: "New York Badgers",
+    name: "Tampa Bay Roosters",
     league: "Minor",
     roster: 25,
   };
 
-  expect(originalTeamToExpectedTeam(originalTeam)).toBe(expectedTeam);
+  expect(originalTeamToExpectedTeam(originalTeam)).toEqual(expectedTeam);
 });
 
 // Задание 2
 test("array to array", () => {
-  const originalArray = Object.freeze([1, 2, 3, 4]);
+  const originalArray = Object.freeze([1, 2, 3, 4]) as SomeArray;
 
   const expectedArray = ["two", 3, 4, 5];
 
-  expect(originalArrayToExpectedArray(originalArray)).toBe(expectedArray);
+  expect(originalArrayToExpectedArray(originalArray)).toEqual(expectedArray);
 });
 
 // Задание 3
@@ -44,5 +51,5 @@ test("team to team deep", () => {
     },
   };
 
-  expect(originalTeamToExpectedTeam(originalTeam)).toBe(expectedTeam);
+  expect(originalTeamToExpectedTeamDeep(originalTeam)).toEqual(expectedTeam);
 });