diff --git a/src/actions/user/reducer.actions.js b/src/actions/user/reducer.actions.js
index 03bf61f..33e4a47 100644
--- a/src/actions/user/reducer.actions.js
+++ b/src/actions/user/reducer.actions.js
@@ -9,7 +9,8 @@ import {
SET_COMPLETE_REGISTRATION_CLIENT_OR_PROVIDER,
SET_FORM_PHONE_NUMBER,
SET_FORM_BUSINESS_NUMBER,
- SET_FORM_SOCIAL_INSURANCE_NUMBER
+ SET_FORM_SOCIAL_INSURANCE_NUMBER,
+ SET_EDIT_PROFILE_TAB_ACTIVE_INDEX
} from "../../constants/user.constants";
import { parseError } from "../common.actions";
@@ -94,3 +95,10 @@ export function setFormSocialInsuranceNumber(socialInsuranceNumber) {
data: socialInsuranceNumber
};
}
+
+export function setEditProfileTabActiveIndex(indexVal) {
+ return {
+ type: SET_EDIT_PROFILE_TAB_ACTIVE_INDEX,
+ data: indexVal
+ };
+}
diff --git a/src/components/App.jsx b/src/components/App.jsx
index cad0395..19bc87c 100644
--- a/src/components/App.jsx
+++ b/src/components/App.jsx
@@ -8,6 +8,7 @@ import ResetPassword from "./Auth/ResetPassword";
import Settings from "./Auth/Settings";
import VerifyEmail from "./Auth/VerifyEmail";
import CompleteRegistration from "./User/CompleteRegistration";
+import EditProfile from "./User/EditProfile";
import Profile from "./User/Profile";
import PrivateRoute from "./Shared/PrivateRoute";
import About from "./Static/About";
@@ -45,6 +46,7 @@ class App extends Component {
path="/auth/reset-password/:uid/:token"
component={ResetPassword}
/>
+
diff --git a/src/components/User/EditClientForm.jsx b/src/components/User/EditClientForm.jsx
new file mode 100644
index 0000000..b0666bd
--- /dev/null
+++ b/src/components/User/EditClientForm.jsx
@@ -0,0 +1,59 @@
+import React, { Component } from "react";
+import { connect } from "react-redux";
+
+import {
+ clearUserRequestError,
+ clearUserRequestSuccess,
+ setFormBusinessNumber
+} from "../../actions/user/reducer.actions";
+import { updateClientRequest } from "../../actions/user/saga.actions";
+import ClientFormView from "./ClientFormView";
+
+class EditClientForm extends Component {
+ changeBusinessNumber = event => {
+ this.props.dispatch(setFormBusinessNumber(event.target.value));
+ this.props.dispatch(clearUserRequestError());
+ this.props.dispatch(clearUserRequestSuccess());
+ };
+
+ onSubmitClient = event => {
+ event.preventDefault();
+ const { selfUser, businessNumber } = this.props;
+ const businessNumberVal =
+ businessNumber || (selfUser.client || {}).business_number;
+ this.props.dispatch(
+ updateClientRequest({
+ username: selfUser.username,
+ business_number: businessNumberVal
+ })
+ );
+ };
+
+ render() {
+ const {
+ isSendingUserRequest,
+ userRequestError,
+ userRequestSuccess,
+ businessNumber,
+ selfUser
+ } = this.props;
+ const businessNumberVal =
+ businessNumber || (selfUser.client || {}).business_number;
+ return (
+
+ );
+ }
+}
+
+function mapStateToProps(state) {
+ return { ...state.user };
+}
+
+export default connect(mapStateToProps)(EditClientForm);
diff --git a/src/components/User/EditProfile.jsx b/src/components/User/EditProfile.jsx
new file mode 100644
index 0000000..fd3b064
--- /dev/null
+++ b/src/components/User/EditProfile.jsx
@@ -0,0 +1,59 @@
+import React, { Component } from "react";
+import { connect } from "react-redux";
+import { Container, Header, Tab } from "semantic-ui-react";
+
+import {
+ setEditProfileTabActiveIndex,
+ clearUserRequestError,
+ clearUserRequestSuccess
+} from "../../actions/user/reducer.actions";
+import EditClientForm from "./EditClientForm";
+import EditProviderForm from "./EditProviderForm";
+import EditUserInfoForm from "./EditUserInfoForm";
+
+class EditProfile extends Component {
+ onTabChange = (event, { activeIndex }) => {
+ if (this.props.editProfileActiveIndex !== activeIndex) {
+ this.props.dispatch(clearUserRequestError());
+ this.props.dispatch(clearUserRequestSuccess());
+ }
+ this.props.dispatch(setEditProfileTabActiveIndex(activeIndex));
+ };
+
+ render() {
+ const { selfUser, editProfileActiveIndex } = this.props;
+ const panes = [
+ {
+ menuItem: "User Information",
+ render: () =>
+ }
+ ];
+ if (selfUser.client) {
+ panes.push({
+ menuItem: "Client Information",
+ render: () =>
+ });
+ } else if (selfUser.provider) {
+ panes.push({
+ menuItem: "Provider Information",
+ render: () =>
+ });
+ }
+ return (
+
+
+
+
+ );
+ }
+}
+
+function mapStateToProps(state) {
+ return { ...state.user };
+}
+
+export default connect(mapStateToProps)(EditProfile);
diff --git a/src/components/User/EditProviderForm.jsx b/src/components/User/EditProviderForm.jsx
new file mode 100644
index 0000000..f14a511
--- /dev/null
+++ b/src/components/User/EditProviderForm.jsx
@@ -0,0 +1,56 @@
+import React, { Component } from "react";
+import { connect } from "react-redux";
+
+import {
+ clearUserRequestError,
+ clearUserRequestSuccess,
+ setFormSocialInsuranceNumber
+} from "../../actions/user/reducer.actions";
+import { updateProviderRequest } from "../../actions/user/saga.actions";
+import ProviderFormView from "./ProviderFormView";
+
+class EditProviderForm extends Component {
+ changeSocialInsuranceNumber = event => {
+ this.props.dispatch(setFormSocialInsuranceNumber(event.target.value));
+ this.props.dispatch(clearUserRequestError());
+ this.props.dispatch(clearUserRequestSuccess());
+ };
+
+ onSubmitProvider = event => {
+ event.preventDefault();
+ const { selfUser, socialInsuranceNumber } = this.props;
+ const socialInsuranceNumberVal =
+ socialInsuranceNumber || (selfUser.provider || {}).sin;
+ this.props.dispatch(
+ updateProviderRequest({ username: selfUser.username, sin: socialInsuranceNumberVal })
+ );
+ };
+
+ render() {
+ const {
+ isSendingUserRequest,
+ userRequestError,
+ userRequestSuccess,
+ socialInsuranceNumber,
+ selfUser
+ } = this.props;
+ const socialInsuranceNumberVal =
+ socialInsuranceNumber || (selfUser.provider || {}).sin;
+ return (
+
+ );
+ }
+}
+
+function mapStateToProps(state) {
+ return { ...state.user };
+}
+
+export default connect(mapStateToProps)(EditProviderForm);
diff --git a/src/components/User/EditUserInfoForm.jsx b/src/components/User/EditUserInfoForm.jsx
new file mode 100644
index 0000000..f79fb7d
--- /dev/null
+++ b/src/components/User/EditUserInfoForm.jsx
@@ -0,0 +1,62 @@
+import React, { Component } from "react";
+import { connect } from "react-redux";
+
+import {
+ clearUserRequestError,
+ clearUserRequestSuccess,
+ setFormPhoneNumber
+} from "../../actions/user/reducer.actions";
+import { updateUserInfoRequest } from "../../actions/user/saga.actions";
+
+import UserInfoFormView from "./UserInfoFormView";
+
+class EditUserInfoForm extends Component {
+ changePhoneNumber = event => {
+ this.props.dispatch(setFormPhoneNumber(event.target.value));
+ this.props.dispatch(clearUserRequestError());
+ this.props.dispatch(clearUserRequestSuccess());
+ };
+
+ onSubmitUserInfo = event => {
+ event.preventDefault();
+ const { selfUser, phoneNumber } = this.props;
+ const phoneNumberVal =
+ phoneNumber || (selfUser.userinfo || {}).phone_number;
+
+ this.props.dispatch(
+ updateUserInfoRequest({
+ ...selfUser.userinfo,
+ username: selfUser.username,
+ phone_number: phoneNumberVal
+ })
+ );
+ };
+
+ render() {
+ const {
+ isSendingUserRequest,
+ userRequestError,
+ userRequestSuccess,
+ selfUser,
+ phoneNumber
+ } = this.props;
+ const phoneNumberVal =
+ phoneNumber || (selfUser.userinfo || {}).phone_number;
+ return (
+
+ );
+ }
+}
+
+function mapStateToProps(state) {
+ return { ...state.user };
+}
+
+export default connect(mapStateToProps)(EditUserInfoForm);
diff --git a/src/components/User/Profile.jsx b/src/components/User/Profile.jsx
index 590952c..c25bcc1 100644
--- a/src/components/User/Profile.jsx
+++ b/src/components/User/Profile.jsx
@@ -1,5 +1,6 @@
import React, { Component } from "react";
import { connect } from "react-redux";
+import { Link } from "react-router-dom";
import { Card, Container, Header, Label, List } from "semantic-ui-react";
class Profile extends Component {
@@ -16,10 +17,17 @@ function mapStateToProps(state) {
const ProfileView = ({ user }) => (
-
+
{user.username || "No username!"}
- {user.email || "No email!"}
+
+ {user.client && }
+ {user.provider && }
+
+ {" "}{user.email || "No email!"}
+
{!user.client &&
@@ -56,11 +64,7 @@ const ProfileView = ({ user }) => (
- {user.client && }
- {user.provider && }
-
+ Edit Profile
diff --git a/src/components/User/UserInfoFormView.jsx b/src/components/User/UserInfoFormView.jsx
index b906ad2..76055fa 100644
--- a/src/components/User/UserInfoFormView.jsx
+++ b/src/components/User/UserInfoFormView.jsx
@@ -22,7 +22,7 @@ const UserInfoFormView = ({