From f6f39544b29d91c08282faf8d70a739a3042a1a3 Mon Sep 17 00:00:00 2001
From: Joffrey BION <joffrey.bion@gmail.com>
Date: Sun, 5 May 2019 20:38:14 +0200
Subject: Migrate home components to TypeScript

---
 frontend/src/components/home/ChooseNameForm.jsx | 43 -------------------------
 frontend/src/components/home/ChooseNameForm.tsx | 42 ++++++++++++++++++++++++
 frontend/src/components/home/Home.jsx           | 13 --------
 frontend/src/components/home/Home.tsx           | 12 +++++++
 4 files changed, 54 insertions(+), 56 deletions(-)
 delete mode 100644 frontend/src/components/home/ChooseNameForm.jsx
 create mode 100644 frontend/src/components/home/ChooseNameForm.tsx
 delete mode 100644 frontend/src/components/home/Home.jsx
 create mode 100644 frontend/src/components/home/Home.tsx

diff --git a/frontend/src/components/home/ChooseNameForm.jsx b/frontend/src/components/home/ChooseNameForm.jsx
deleted file mode 100644
index 71279e35..00000000
--- a/frontend/src/components/home/ChooseNameForm.jsx
+++ /dev/null
@@ -1,43 +0,0 @@
-// @flow
-import { Button, Classes, InputGroup, Intent } from '@blueprintjs/core';
-import React, { Component } from 'react';
-import { connect } from 'react-redux';
-import { actions } from '../../redux/actions/user';
-
-type ChooseNameFormPresenterProps = {
-  chooseUsername: (username: string) => void,
-}
-
-class ChooseNameFormPresenter extends Component<ChooseNameFormPresenterProps> {
-  _username = '';
-
-  play = e => {
-    e.preventDefault();
-    if (this._username !== undefined) {
-      this.props.chooseUsername(this._username);
-    }
-  };
-
-  render() {
-    return (
-        <form onSubmit={this.play}>
-          <InputGroup
-            className={Classes.LARGE}
-            placeholder="Username"
-            onChange={e => (this._username = e.target.value)}
-            rightElement={this.renderSubmit()}
-          />
-        </form>
-    );
-  }
-
-  renderSubmit = () => (
-    <Button className={Classes.MINIMAL} onClick={this.play} intent={Intent.PRIMARY} icon="arrow-right" />
-  );
-}
-
-const mapDispatchToProps = {
-  chooseUsername: actions.chooseUsername,
-};
-
-export const ChooseNameForm = connect(null, mapDispatchToProps)(ChooseNameFormPresenter);
diff --git a/frontend/src/components/home/ChooseNameForm.tsx b/frontend/src/components/home/ChooseNameForm.tsx
new file mode 100644
index 00000000..8292150b
--- /dev/null
+++ b/frontend/src/components/home/ChooseNameForm.tsx
@@ -0,0 +1,42 @@
+import { Button, Classes, InputGroup, Intent } from '@blueprintjs/core';
+import React, { ChangeEvent, Component, SyntheticEvent } from 'react';
+import { connect } from 'react-redux';
+import { actions } from '../../redux/actions/user';
+
+type ChooseNameFormPresenterProps = {
+  chooseUsername: (username: string) => void,
+}
+
+class ChooseNameFormPresenter extends Component<ChooseNameFormPresenterProps> {
+  _username = '';
+
+  play = (e: SyntheticEvent<any>) => {
+    e.preventDefault();
+    if (this._username !== undefined) {
+      this.props.chooseUsername(this._username);
+    }
+  };
+
+  render() {
+    return (
+        <form onSubmit={this.play}>
+          <InputGroup
+            className={Classes.LARGE}
+            placeholder="Username"
+            onChange={(e: ChangeEvent<HTMLInputElement>) => (this._username = e.target.value)}
+            rightElement={this.renderSubmit()}
+          />
+        </form>
+    );
+  }
+
+  renderSubmit = () => (
+    <Button className={Classes.MINIMAL} onClick={this.play} intent={Intent.PRIMARY} icon="arrow-right" />
+  );
+}
+
+const mapDispatchToProps = {
+  chooseUsername: actions.chooseUsername,
+};
+
+export const ChooseNameForm = connect(null, mapDispatchToProps)(ChooseNameFormPresenter);
diff --git a/frontend/src/components/home/Home.jsx b/frontend/src/components/home/Home.jsx
deleted file mode 100644
index 91065ec7..00000000
--- a/frontend/src/components/home/Home.jsx
+++ /dev/null
@@ -1,13 +0,0 @@
-// @flow
-import * as React from 'react';
-import { Flex } from 'reflexbox';
-import { ChooseNameForm } from './ChooseNameForm';
-import './Home.css'
-import logo from './logo-7-wonders.png';
-
-export const Home = () => (
-  <Flex className='homeRoot fullscreen' column align='center' justify='center'>
-      <img src={logo} alt="Seven Wonders"/>
-      <ChooseNameForm/>
-  </Flex>
-);
diff --git a/frontend/src/components/home/Home.tsx b/frontend/src/components/home/Home.tsx
new file mode 100644
index 00000000..094db658
--- /dev/null
+++ b/frontend/src/components/home/Home.tsx
@@ -0,0 +1,12 @@
+import * as React from 'react';
+import { Flex } from 'reflexbox';
+import { ChooseNameForm } from './ChooseNameForm';
+import './Home.css'
+import logo from './logo-7-wonders.png';
+
+export const Home = () => (
+  <Flex className='homeRoot fullscreen' column align='center' justify='center'>
+      <img src={logo} alt="Seven Wonders"/>
+      <ChooseNameForm/>
+  </Flex>
+);
-- 
cgit