diff --git a/app/gabsocial/actions/me.js b/app/gabsocial/actions/me.js
index 679ee0397..1d0054845 100644
--- a/app/gabsocial/actions/me.js
+++ b/app/gabsocial/actions/me.js
@@ -25,7 +25,6 @@ export function fetchMe() {
api(getState).get('/api/v1/accounts/verify_credentials').then(response => {
dispatch(fetchMeSuccess(response.data));
- dispatch(importFetchedAccount(response.data));
}).catch(error => {
dispatch(fetchMeFail(error));
});
@@ -34,6 +33,7 @@ export function fetchMe() {
export function patchMe(params) {
return (dispatch, getState) => {
+ dispatch(patchMeRequest());
return api(getState)
.patch('/api/v1/accounts/update_credentials', params)
.then(response => {
@@ -51,9 +51,12 @@ export function fetchMeRequest() {
}
export function fetchMeSuccess(me) {
- return {
- type: ME_FETCH_SUCCESS,
- me,
+ return (dispatch, getState) => {
+ dispatch(importFetchedAccount(me));
+ dispatch({
+ type: ME_FETCH_SUCCESS,
+ me,
+ });
};
}
diff --git a/app/gabsocial/features/edit_profile/index.js b/app/gabsocial/features/edit_profile/index.js
new file mode 100644
index 000000000..16a774a83
--- /dev/null
+++ b/app/gabsocial/features/edit_profile/index.js
@@ -0,0 +1,87 @@
+import React from 'react';
+import { connect } from 'react-redux';
+import { defineMessages, injectIntl } from 'react-intl';
+import ImmutablePureComponent from 'react-immutable-pure-component';
+import PropTypes from 'prop-types';
+import ImmutablePropTypes from 'react-immutable-proptypes';
+import Column from '../ui/components/column';
+import {
+ SimpleForm,
+ FieldsGroup,
+ TextInput,
+} from 'gabsocial/features/forms';
+import { patchMe } from 'gabsocial/actions/me';
+
+const messages = defineMessages({
+ heading: { id: 'column.edit_profile', defaultMessage: 'Edit profile' },
+});
+
+const mapStateToProps = state => {
+ const me = state.get('me');
+ return {
+ account: state.getIn(['accounts', me]),
+ };
+};
+
+export default @connect(mapStateToProps)
+@injectIntl
+class EditProfile extends ImmutablePureComponent {
+
+ static propTypes = {
+ dispatch: PropTypes.func.isRequired,
+ intl: PropTypes.object.isRequired,
+ account: ImmutablePropTypes.map,
+ };
+
+ constructor(props) {
+ super(props);
+ this.state = { isLoading: false };
+ }
+
+ getFormData = (form) => {
+ return Object.fromEntries(
+ new FormData(form).entries()
+ );
+ }
+
+ handleSubmit = (event) => {
+ const { dispatch } = this.props;
+ const formData = this.getFormData(event.target);
+ dispatch(patchMe(formData)).then(() => {
+ this.setState({ isLoading: false });
+ }).catch((error) => {
+ this.setState({ isLoading: false });
+ });
+ this.setState({ isLoading: true });
+ event.preventDefault();
+ }
+
+ render() {
+ const { account, intl } = this.props;
+
+ return (
+