Split GameBrowser into multiple connected components

1 files changed, 27 insertions, 0 deletions

diff --git a/frontend/src/components/PlayerInfo.jsx b/frontend/src/components/PlayerInfo.jsx
new file mode 100644
index 00000000..42d3142a
--- /dev/null
+++ b/frontend/src/components/PlayerInfo.jsx
@@ -0,0 +1,27 @@
+// @flow
+import { Text } from '@blueprintjs/core';
+import React from 'react';
+import { connect } from 'react-redux';
+import type { Player } from '../models/players';
+import { getCurrentPlayer } from '../redux/players';
+
+export type PlayerInfoProps = {
+  player: ?Player,
+}
+
+const PlayerInfoPresenter = ({player}: PlayerInfoProps) => (
+    <Text>
+      <b>Username:</b>
+      {' '}
+      {player && player.displayName}
+    </Text>
+);
+
+const mapStateToProps = state => ({
+  player: getCurrentPlayer(state),
+});
+
+const mapDispatchToProps = {
+};
+
+export const PlayerInfo = connect(mapStateToProps, mapDispatchToProps)(PlayerInfoPresenter);