(
-
+
-
+
),
],
};
export const Template = () => {
- const dispatch = useDispatch();
+ const { dispatch } = useContext(StoreContext);
const showSuccessToast = () => {
- dispatch(toastActions.success('This is success toast! This is success toast!'));
+ dispatch(actions.createToast({ type: 'success', message: 'This is success toast! This is success toast!' }));
};
const showErrorToast = () => {
- dispatch(toastActions.error('This is error toast! This is error toast!'));
+ dispatch(actions.createToast({ type: 'error', message: 'This is error toast! This is error toast!' }));
};
const showInfoToast = () => {
- dispatch(toastActions.info('This is info toast! This is info toast!'));
+ dispatch(actions.createToast({ type: 'info', message: 'This is info toast! This is info toast!' }));
};
const showWarningToast = () => {
- dispatch(toastActions.warning('This is warning toast! This is warning toast!'));
+ dispatch(actions.createToast({ type: 'warning', message: 'This is warning toast! This is warning toast!' }));
};
return (
diff --git a/src/layouts/main/header/components/user-menu/user-menu.jsx b/src/layouts/main/header/components/user-menu/user-menu.jsx
index 635362e..de8f18d 100644
--- a/src/layouts/main/header/components/user-menu/user-menu.jsx
+++ b/src/layouts/main/header/components/user-menu/user-menu.jsx
@@ -1,11 +1,11 @@
-import React from 'react';
+import React, { useContext } from 'react';
import cn from 'classnames';
import { Link, useHistory } from 'react-router-dom';
-import { useDispatch } from 'react-redux';
import { routes } from 'routes';
-import { userActions } from 'resources/user/user.slice';
+import { StoreContext } from 'resources/store/store';
+import actions from 'resources/store/actions';
import styles from './user-menu.styles.pcss';
@@ -17,8 +17,8 @@ const linksList = [
];
function UserMenu() {
- const dispatch = useDispatch();
const history = useHistory();
+ const { dispatch } = useContext(StoreContext);
const [isOpen, setIsOpen] = React.useState(false);
function toggleIsOpen() {
@@ -36,7 +36,7 @@ function UserMenu() {
}, []);
async function logout() {
- await dispatch(userActions.signOut());
+ await dispatch(actions.signOut());
history.push(routes.signIn.path);
}
diff --git a/src/pages/forgot/forgot.jsx b/src/pages/forgot/forgot.jsx
index 52a8bdb..1880797 100644
--- a/src/pages/forgot/forgot.jsx
+++ b/src/pages/forgot/forgot.jsx
@@ -1,12 +1,12 @@
-import React from 'react';
+import React, { useContext } from 'react';
import cn from 'classnames';
import { Link, Redirect } from 'react-router-dom';
-import { useDispatch, useSelector } from 'react-redux';
import { routes } from 'routes';
-import * as userSelectors from 'resources/user/user.selectors';
-import { userActions } from 'resources/user/user.slice';
+import { StoreContext } from 'resources/store/store';
+
+import * as api from 'resources/user/user.api';
import Input from 'components/input';
import Button from 'components/button';
@@ -15,18 +15,17 @@ import Form from 'components/form';
import styles from './forgot.pcss';
const Forgot = () => {
- const dispatch = useDispatch();
-
- const user = useSelector(userSelectors.selectUser);
+ const { state } = useContext(StoreContext);
+ const { user } = state;
const [values, setValues] = React.useState({});
const [pending, setPending] = React.useState(false);
const [submitted, setSubmitted] = React.useState(false);
- const handleSubmit = async (submitValues) => {
+ const handleSubmit = async ({ email }) => {
setPending(true);
- await dispatch(userActions.forgot(submitValues));
- setValues(submitValues);
+ await api.forgot({ email });
+ setValues({ email });
setSubmitted(true);
setPending(false);
};
diff --git a/src/pages/profile/profile.jsx b/src/pages/profile/profile.jsx
index 20aa13d..fda80d7 100644
--- a/src/pages/profile/profile.jsx
+++ b/src/pages/profile/profile.jsx
@@ -1,11 +1,12 @@
-import React, { useCallback, useState, useEffect } from 'react';
+import React, {
+ useCallback, useState, useEffect, useContext,
+} from 'react';
import * as yup from 'yup';
-import { useDispatch, useSelector } from 'react-redux';
import { useFormContext } from 'react-hook-form';
-import * as userSelectors from 'resources/user/user.selectors';
-import { userActions } from 'resources/user/user.slice';
-import { toastActions } from 'resources/toast/toast.slice';
+import { StoreContext } from 'resources/store/store';
+import actions from 'resources/store/actions';
+
import * as filesApi from 'resources/files/files.api';
import Input from 'components/input';
@@ -30,9 +31,8 @@ const schema = yup.object({
.email('Please enter a valid email address'),
});
-const CancelButton = ({ onCancel }) => { // eslint-disable-line react/prop-types
+const CancelButton = ({ onCancel, user }) => { // eslint-disable-line react/prop-types
const { reset } = useFormContext();
- const user = useSelector(userSelectors.selectUser);
const handleClick = () => {
onCancel();
@@ -52,16 +52,15 @@ const CancelButton = ({ onCancel }) => { // eslint-disable-line react/prop-types
};
const Profile = () => {
- const dispatch = useDispatch();
- const user = useSelector(userSelectors.selectUser);
- const { avatarFileKey: userAvatarFileKey } = user;
+ const { state: { user }, dispatch } = useContext(StoreContext);
+ const { avatarFileKey: userAvatarFileKey } = user || {};
const [avatarFileKey, setAvatarFileKey] = useState(userAvatarFileKey);
const [avatarUrl, setAvatarUrl] = useState(null);
const handleSubmit = useCallback(async (submitValues) => {
- await dispatch(userActions.updateCurrentUser({ ...submitValues, avatarFileKey }));
- dispatch(toastActions.success('User info updated!'));
+ await dispatch(actions.updateCurrentUser({ ...submitValues, avatarFileKey }));
+ dispatch(actions.createToast({ type: 'success', message: 'User info updated!' }));
}, [dispatch, avatarFileKey]);
const getAvatarUrl = useCallback(async (key) => {
@@ -70,8 +69,8 @@ const Profile = () => {
if (url) {
setAvatarUrl(url);
}
- } catch (error) {
- dispatch(toastActions.error(error));
+ } catch ({ data }) {
+ dispatch(actions.createToast({ type: 'error', message: data.errors.file[0] }));
}
}, [dispatch]);
@@ -80,8 +79,8 @@ const Profile = () => {
const file = files[0];
const { key } = await filesApi.upload(file);
setAvatarFileKey(key);
- } catch (error) {
- dispatch(toastActions.error(error));
+ } catch ({ data }) {
+ dispatch(actions.createToast({ type: 'error', message: data.errors.file[0] }));
}
};
@@ -162,6 +161,7 @@ const Profile = () => {