Skip to content

Commit a94d2a1

Browse files
authored
Merge pull request #211 from swiftss-org/feat/add-notification-change-password
feat: adds a notification when changing password and fixes some minor issues
2 parents 33d987a + 6241455 commit a94d2a1

File tree

10 files changed

+93
-74
lines changed

10 files changed

+93
-74
lines changed

src/App.style.ts

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -22,3 +22,8 @@ export const TopBar = styled.div`
2222
position: sticky;
2323
width: 100%;
2424
`;
25+
26+
export const IconWrapper = styled.div`
27+
cursor: pointer;
28+
z-index: 10;
29+
`;

src/components/Drawer/Drawer.tsx

Lines changed: 4 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import { useHistory } from 'react-router-dom';
66
import SwiftSSLogo from '../../assets/swiftss-logo.png';
77
import TSALogo from '../../assets/tsa-logo.png';
88
import { useIsLoggedIn } from '../../hooks/useIsLoggedIn';
9-
import urls from "../../routing/urls";
9+
import urls from '../../routing/urls';
1010
import { clearUserStorage } from '../../utils/storage';
1111
import { Container } from './Drawer.style';
1212
import Navigation from './Navigation/Navigation';
@@ -41,6 +41,7 @@ const Drawer: React.FC<Props> = (props) => {
4141
};
4242

4343
const handleSettings = () => {
44+
handleClick();
4445
history.push(urls.settings());
4546
};
4647

@@ -60,20 +61,14 @@ const Drawer: React.FC<Props> = (props) => {
6061
onMouseLeave={() => isSmallDesktop && props.setExpanded(false)}
6162
>
6263
<Header>
63-
{/*{isLoggedIn && (*/}
64-
{/* <UserContainer>*/}
65-
{/* <Icon name={'account'} />*/}
66-
{/* {getUserStorageItem(__EMAIL__)}*/}
67-
{/* </UserContainer>*/}
68-
{/*)}*/}
6964
{isLoggedIn && (
7065
<UserContainer>
7166
<Button
7267
transparent
7368
filled={false}
7469
buttonType={'button'}
7570
color={'lightGray-100'}
76-
onClick={() => handleSettings()}
71+
onClick={handleSettings}
7772
>
7873
Settings
7974
</Button>
@@ -82,7 +77,7 @@ const Drawer: React.FC<Props> = (props) => {
8277
filled={false}
8378
buttonType={'button'}
8479
color={'lightGray-100'}
85-
onClick={() => handleLogout()}
80+
onClick={handleLogout}
8681
>
8782
Logout
8883
</Button>

src/pages/EpisodeDetails/EpisodeDetails.tsx

Lines changed: 11 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22
import React from 'react';
33

44
import { Icon } from '@orfium/ictinus';
5+
import { IconWrapper } from 'App.style';
56
import { useHistory, useRouteMatch } from 'react-router-dom';
67

78
import { PageTitle } from '../../common.style';
@@ -36,14 +37,16 @@ const EpisodeDetails: React.FC = () => {
3637
return (
3738
<PageWrapper isDesktop={isDesktop}>
3839
<PageTitle>
39-
<Icon
40-
name="fatArrowLeft"
41-
size={24}
42-
color={'lightGray-700'}
43-
onClick={() => {
44-
history.replace(`${urls.patients()}/${hospitalID}/${patientID}`);
45-
}}
46-
/>
40+
<IconWrapper>
41+
<Icon
42+
name="fatArrowLeft"
43+
size={24}
44+
color={'lightGray-700'}
45+
onClick={() => {
46+
history.replace(`${urls.patients()}/${hospitalID}/${patientID}`);
47+
}}
48+
/>
49+
</IconWrapper>
4750
Episode Details
4851
</PageTitle>
4952
{episode && (

src/pages/Login/Login.tsx

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,13 @@
11
/** @jsxImportSource @emotion/react */
22
import React from 'react';
33

4-
import Notifications from 'components/Notifications';
5-
64
import LoginForm from './components/LoginForm';
75
import { Subtitle, TextContainer, Title, Wrapper } from './Login.style';
86

97
const Login: React.FC = () => {
108
return (
119
<Wrapper>
12-
<Notifications />
10+
{/*<Notifications />*/}
1311
<TextContainer>
1412
<Title>Welcome!</Title>
1513
<Subtitle>Please sign in using your credentials to access your account.</Subtitle>

src/pages/PatientDetails/PatientDetails.tsx

Lines changed: 11 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22
import React, { useState } from 'react';
33

44
import { Button, Icon } from '@orfium/ictinus';
5+
import { IconWrapper } from 'App.style';
56
import { useGetHospital, useGetPatient } from 'hooks/api/patientHooks';
67
import { useHistory, useRouteMatch } from 'react-router-dom';
78

@@ -35,14 +36,16 @@ const PatientDetails: React.FC = () => {
3536
return (
3637
<PageWrapper isDesktop={isDesktop}>
3738
<PageTitle>
38-
<Icon
39-
name="fatArrowLeft"
40-
size={24}
41-
color={'lightGray-700'}
42-
onClick={() => {
43-
history.push(urls.patients());
44-
}}
45-
/>
39+
<IconWrapper>
40+
<Icon
41+
name="fatArrowLeft"
42+
size={24}
43+
color={'lightGray-700'}
44+
onClick={() => {
45+
history.push(urls.patients());
46+
}}
47+
/>
48+
</IconWrapper>
4649
Patient Details
4750
</PageTitle>
4851
<Tabs

src/pages/PatientDirectory/PatientDirectory.tsx

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ import { getHospitalOptions } from 'pages/RegisterPatient/utils';
1010
import { useHistory } from 'react-router';
1111
import urls from 'routing/urls';
1212

13+
import Notifications from '../../components/Notifications';
1314
import { useResponsiveLayout } from '../../hooks/useResponsiveSidebar';
1415
import PatientCard from './components/PatientCard';
1516
import SortingOptions from './components/SortingOptions';
@@ -49,6 +50,7 @@ const PatientDirectory: React.FC<{ searchTerm?: string }> = ({ searchTerm }) =>
4950
return (
5051
<>
5152
<PageWrapper isDesktop={isDesktop}>
53+
<Notifications />
5254
<PageTitle>Patients directory</PageTitle>
5355
<OptionsWrapper>
5456
<Filter

src/pages/RegisterEpisode/RegisterEpisode.tsx

Lines changed: 15 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22
import React, { useState } from 'react';
33

44
import { Button, Icon } from '@orfium/ictinus';
5+
import { IconWrapper } from 'App.style';
56
import { ButtonContainer, PageSubtitle, PageTitle, PageWrapper } from 'common.style';
67
import ConfirmationModal from 'components/ConfirmationModal';
78
import arrayMutators from 'final-form-arrays';
@@ -72,18 +73,20 @@ const RegisterEpisode: React.FC = () => {
7273
<>
7374
<PageWrapper isDesktop={isDesktop}>
7475
<PageTitle>
75-
<Icon
76-
name="fatArrowLeft"
77-
size={24}
78-
color={'lightGray-700'}
79-
onClick={() => {
80-
if (isFormDirty) {
81-
setShowWarningModal(true);
82-
} else {
83-
history.push(urls.patients());
84-
}
85-
}}
86-
/>
76+
<IconWrapper>
77+
<Icon
78+
name="fatArrowLeft"
79+
size={24}
80+
color={'lightGray-700'}
81+
onClick={() => {
82+
if (isFormDirty) {
83+
setShowWarningModal(true);
84+
} else {
85+
history.push(urls.patients());
86+
}
87+
}}
88+
/>
89+
</IconWrapper>
8790
Register an Episode
8891
</PageTitle>
8992
<PageSubtitle>

src/pages/RegisterPatient/RegisterPatient.tsx

Lines changed: 15 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22
import React, { useState } from 'react';
33

44
import { Button, Icon } from '@orfium/ictinus';
5+
import { IconWrapper } from 'App.style';
56
import { ButtonContainer, PageTitle, PageWrapper } from 'common.style';
67
import ConfirmationModal from 'components/ConfirmationModal';
78
import { Form } from 'react-final-form';
@@ -32,18 +33,20 @@ const RegisterPatient: React.FC = () => {
3233
<>
3334
<PageWrapper isDesktop={isDesktop}>
3435
<PageTitle>
35-
<Icon
36-
name="fatArrowLeft"
37-
size={24}
38-
color={'lightGray-700'}
39-
onClick={() => {
40-
if (isFormDirty) {
41-
setShowWarningModal(true);
42-
} else {
43-
history.push(urls.patients());
44-
}
45-
}}
46-
/>
36+
<IconWrapper>
37+
<Icon
38+
name="fatArrowLeft"
39+
size={24}
40+
color={'lightGray-700'}
41+
onClick={() => {
42+
if (isFormDirty) {
43+
setShowWarningModal(true);
44+
} else {
45+
history.push(urls.patients());
46+
}
47+
}}
48+
/>
49+
</IconWrapper>
4750
Add new patient
4851
</PageTitle>
4952
<Form onSubmit={handleSubmit} validate={formValidation}>

src/pages/Settings/Settings.tsx

Lines changed: 18 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -2,18 +2,17 @@
22
import React, { useState } from 'react';
33

44
import { Icon } from '@orfium/ictinus';
5+
import { IconWrapper } from 'App.style';
6+
import { PageTitle, PageWrapper } from 'common.style';
7+
import { Tabs } from 'components/Tabs';
8+
import { useResponsiveLayout } from 'hooks/useResponsiveSidebar';
59
import { useHistory } from 'react-router-dom';
10+
import urls from 'routing/urls';
611

7-
import { PageTitle, PageWrapper } from '../../common.style';
8-
import { Tabs } from '../../components/Tabs';
9-
import { useResponsiveLayout } from '../../hooks/useResponsiveSidebar';
10-
import urls from '../../routing/urls';
1112
import { ComponentWrapper } from '../PatientDetails/PatientDetails.style';
12-
import ChangePasswordForm from "./components/ChangePasswordForm";
13+
import ChangePasswordForm from './components/ChangePasswordForm';
1314

14-
const tabs = [
15-
{ label: 'Change Password', value: 'change-password' },
16-
];
15+
const tabs = [{ label: 'Change Password', value: 'change-password' }];
1716

1817
const Settings: React.FC = () => {
1918
const { isDesktop } = useResponsiveLayout();
@@ -24,14 +23,16 @@ const Settings: React.FC = () => {
2423
return (
2524
<PageWrapper isDesktop={isDesktop}>
2625
<PageTitle>
27-
<Icon
28-
name="fatArrowLeft"
29-
size={24}
30-
color={'lightGray-700'}
31-
onClick={() => {
32-
history.push(urls.settings());
33-
}}
34-
/>
26+
<IconWrapper>
27+
<Icon
28+
name="fatArrowLeft"
29+
size={24}
30+
color={'lightGray-700'}
31+
onClick={() => {
32+
history.push(urls.patients());
33+
}}
34+
/>
35+
</IconWrapper>
3536
Settings
3637
</PageTitle>
3738
<Tabs
@@ -43,11 +44,7 @@ const Settings: React.FC = () => {
4344
shouldDisplayTabs
4445
/>
4546
<ComponentWrapper>
46-
{activeTab === 'change-password' ? (
47-
<ChangePasswordForm />
48-
) : (
49-
<div />
50-
)}
47+
{activeTab === 'change-password' ? <ChangePasswordForm /> : <div />}
5148
</ComponentWrapper>
5249
</PageWrapper>
5350
);

src/pages/Settings/components/ChangePasswordForm/ChangePasswordForm.tsx

Lines changed: 11 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,16 +6,26 @@ import { FieldsContainer, FieldWrapper, LongFieldWrapper } from 'common.style';
66
import { useChangePassword } from 'hooks/api/userHooks';
77
import { ChangePasswordFormType } from 'models/apiTypes';
88
import { Field, Form } from 'react-final-form';
9+
import { useHistory } from 'react-router-dom';
910

11+
import { useSetNotification } from '../../../../hooks/useSetNotification';
1012
import { ButtonContainer } from '../../../Login/components/LoginForm/LoginForm.style';
1113

1214
const ChangePasswordForm: React.FC = () => {
1315
const { mutateAsync, isLoading } = useChangePassword();
1416

17+
const setNotification = useSetNotification();
18+
19+
const history = useHistory();
20+
1521
const handleSubmit = (form: ChangePasswordFormType) => {
1622
return new Promise((resolve) => {
1723
mutateAsync(form)
18-
.then(() => resolve(true))
24+
.then(() => {
25+
setNotification('Password changed successfully', 'success', true, true);
26+
history.push('/');
27+
resolve(true);
28+
})
1929
.catch((error) => {
2030
resolve(error.errors);
2131
});

0 commit comments

Comments
 (0)