add BasicInfoSettings container

src/client/js/components/Me/BasicInfoSettings.jsx

@@ -0,0 +1,40 @@
+
+import React, { Fragment } from 'react';
+import PropTypes from 'prop-types';
+import { withTranslation } from 'react-i18next';
+
+import { createSubscribedElement } from '../UnstatedUtils';
+
+import AppContainer from '../../services/AppContainer';
+import PersonalContainer from '../../services/PersonalContainer';
+
+class BasicInfoSettings extends React.Component {
+
+  render() {
+    const { t } = this.props;
+
+    return (
+      <Fragment>
+        <div className="form-group">
+          <label htmlFor="userForm[name]" className="col-sm-2 control-label">{ t('Name') }</label>
+          <div className="col-sm-4">
+            <input className="form-control" type="text" name="userForm[name]" value="{{ user.name }}" required />
+          </div>
+        </div>
+      </Fragment>
+    );
+  }
+
+}
+
+const BasicInfoSettingsWrapper = (props) => {
+  return createSubscribedElement(BasicInfoSettings, props, [AppContainer, PersonalContainer]);
+};
+
+BasicInfoSettings.propTypes = {
+  t: PropTypes.func.isRequired, // i18next
+  appContainer: PropTypes.instanceOf(AppContainer).isRequired,
+  personalContainer: PropTypes.instanceOf(PersonalContainer).isRequired,
+};
+
+export default withTranslation()(BasicInfoSettingsWrapper);

src/client/js/components/Me/PersonalSettings.jsx

@@ -3,8 +3,6 @@ import React, { Fragment } from 'react';
 import PropTypes from 'prop-types';
 import { withTranslation } from 'react-i18next';
 
-import { createSubscribedElement } from '../UnstatedUtils';
-import AppContainer from '../../services/AppContainer';
 import UserSettings from './UserSettings';
 
 class PersonalSettings extends React.Component {
@@ -53,13 +51,8 @@ class PersonalSettings extends React.Component {
 
 }
 
-const PersonalSettingsWrapper = (props) => {
-  return createSubscribedElement(PersonalSettings, props, [AppContainer]);
-};
-
 PersonalSettings.propTypes = {
   t: PropTypes.func.isRequired, // i18next
-  appContainer: PropTypes.instanceOf(AppContainer).isRequired,
 };
 
-export default withTranslation()(PersonalSettingsWrapper);
+export default withTranslation()(PersonalSettings);

src/client/js/components/Me/UserSettings.jsx

@@ -3,8 +3,7 @@ import React, { Fragment } from 'react';
 import PropTypes from 'prop-types';
 import { withTranslation } from 'react-i18next';
 
-import { createSubscribedElement } from '../UnstatedUtils';
-import AppContainer from '../../services/AppContainer';
+import BasicInfoSettings from './BasicInfoSettings';
 
 class UserSettings extends React.Component {
 
@@ -15,6 +14,12 @@ class UserSettings extends React.Component {
       <Fragment>
         <div className="mb-5 container-fluid">
           <h2 className="border-bottom">{t('Basic Info')}</h2>
+          <BasicInfoSettings />
+        </div>
+
+        <div className="mb-5 container-fluid">
+          <h2 className="border-bottom">{t('Set Profile Image')}</h2>
+          {/* TODO GW-1032 create component */}
         </div>
 
       </Fragment>
@@ -23,13 +28,9 @@ class UserSettings extends React.Component {
 
 }
 
-const UserSettingsWrapper = (props) => {
-  return createSubscribedElement(UserSettings, props, [AppContainer]);
-};
 
 UserSettings.propTypes = {
   t: PropTypes.func.isRequired, // i18next
-  appContainer: PropTypes.instanceOf(AppContainer).isRequired,
 };
 
-export default withTranslation()(UserSettingsWrapper);
+export default withTranslation()(UserSettings);