diff --git a/src/App.test.tsx b/src/App.test.tsx
index e70a43f08..488f4fc8b 100644
--- a/src/App.test.tsx
+++ b/src/App.test.tsx
@@ -47,11 +47,11 @@ describe(' ', () => {
const tokenExpiryDate = new Date();
tokenExpiryDate.setDate(new Date().getDate() + 1);
- setAuthSession(
- '{"access_token":"access","renewal_token":"renew", "token_expiry_time":"' +
- tokenExpiryDate +
- '"}'
- );
+ setAuthSession({
+ access_token: 'access',
+ renewal_token: 'renew',
+ token_expiry_time: tokenExpiryDate,
+ });
setUserSession(JSON.stringify({ organization: { id: '1' }, roles: ['Staff'] }));
diff --git a/src/components/UI/Layout/Navigation/SideDrawer/SideDrawer.tsx b/src/components/UI/Layout/Navigation/SideDrawer/SideDrawer.tsx
index 3ff5a6c02..5300dc44f 100644
--- a/src/components/UI/Layout/Navigation/SideDrawer/SideDrawer.tsx
+++ b/src/components/UI/Layout/Navigation/SideDrawer/SideDrawer.tsx
@@ -16,6 +16,7 @@ import GlificLogo from 'assets/images/logo/Logo.svg';
import { getUserRolePermissions, getUserAccountMenus, getStaffManagementMenus } from 'context/role';
import { Tooltip } from 'components/UI/Tooltip/Tooltip';
import { WalletBalance } from 'containers/WalletBalance/WalletBalance';
+import { LastLogin } from 'containers/LastLogin/LastLogin';
import { isGreaterThanLgBreakpoint } from 'common/utils';
import SideMenus from '../SideMenus/SideMenus';
@@ -183,6 +184,7 @@ export const SideDrawer = () => {
{drawer}
+
diff --git a/src/config/apolloclient.ts b/src/config/apolloclient.ts
index 6999bb476..4b0540d11 100644
--- a/src/config/apolloclient.ts
+++ b/src/config/apolloclient.ts
@@ -53,7 +53,7 @@ const gqlClient = (navigate: any) => {
// in case of successful token renewal
if (response.data) {
// lets set the session
- setAuthSession(JSON.stringify(response.data.data));
+ setAuthSession(response.data.data);
// we need to return below as handleFetch expects it
tokenResponse[accessTokenField] = response.data.data.access_token;
diff --git a/src/containers/Auth/Login/Login.tsx b/src/containers/Auth/Login/Login.tsx
index 318d92dd7..788ec5ba3 100644
--- a/src/containers/Auth/Login/Login.tsx
+++ b/src/containers/Auth/Login/Login.tsx
@@ -122,10 +122,9 @@ export const Login = () => {
},
})
.then((response: any) => {
- const responseString = JSON.stringify(response.data.data);
getCurrentUser();
getOrganizationServices();
- setAuthSession(responseString);
+ setAuthSession(response.data.data);
})
.catch((error) => {
setAuthError(t('Invalid phone or password.'));
diff --git a/src/containers/LastLogin/LastLogin.module.css b/src/containers/LastLogin/LastLogin.module.css
new file mode 100644
index 000000000..cb8d5c168
--- /dev/null
+++ b/src/containers/LastLogin/LastLogin.module.css
@@ -0,0 +1,8 @@
+.lastLogin {
+ position: absolute;
+ bottom: 26px;
+ font-size: 12px;
+ padding-left: 22px;
+ color: #073f24;
+ font-weight: 500;
+}
diff --git a/src/containers/LastLogin/LastLogin.tsx b/src/containers/LastLogin/LastLogin.tsx
new file mode 100644
index 000000000..0a96bac95
--- /dev/null
+++ b/src/containers/LastLogin/LastLogin.tsx
@@ -0,0 +1,21 @@
+import moment from 'moment';
+import { useTranslation } from 'react-i18next';
+
+import { getAuthSession } from 'services/AuthService';
+import { DATE_TIME_FORMAT } from 'common/constants';
+
+import styles from './LastLogin.module.css';
+
+interface LastLoginProps {
+ drawerOpen: boolean;
+}
+
+export const LastLogin = ({ drawerOpen }: LastLoginProps) => {
+ const { t } = useTranslation();
+ const lastLogin = getAuthSession('last_login_time');
+ return drawerOpen ? (
+
+ {t('Last login')}: {moment(lastLogin).format(DATE_TIME_FORMAT)}
+
+ ) : null;
+};
diff --git a/src/i18n/en/en.json b/src/i18n/en/en.json
index eaad5da6b..68aaf4240 100644
--- a/src/i18n/en/en.json
+++ b/src/i18n/en/en.json
@@ -221,6 +221,7 @@
"Add New": "Add New",
"Add another list": "Add another list",
"Add another list item": "Add another list item",
+ "Last login": "Last login",
"Delete": "Delete",
"Sorry, no results found! Please try a different search.": "Sorry, no results found! Please try a different search.",
"Please create one.": "Please create one.",
diff --git a/src/services/AuthService.test.ts b/src/services/AuthService.test.ts
index b37203d69..58db14e8f 100644
--- a/src/services/AuthService.test.ts
+++ b/src/services/AuthService.test.ts
@@ -26,10 +26,11 @@ describe('AuthService', () => {
// let's create token expiry date for tomorrow
const tokenExpiryDate = new Date();
tokenExpiryDate.setDate(new Date().getDate() + 1);
- const session =
- '{"access_token":"access","renewal_token":"renew", "token_expiry_time":"' +
- tokenExpiryDate +
- '"}';
+ const session = {
+ access_token: 'access',
+ renewal_token: 'renew',
+ token_expiry_time: tokenExpiryDate,
+ };
test('testing renewAuthToken', async () => {
// set the session
@@ -69,11 +70,11 @@ describe('AuthService', () => {
// set the session
const expiredTokenDate = new Date();
expiredTokenDate.setDate(new Date().getDate() - 1);
- setAuthSession(
- '{"access_token":"access","renewal_token":"renew", "token_expiry_time":"' +
- expiredTokenDate +
- '"}'
- );
+ setAuthSession({
+ access_token: 'access',
+ renewal_token: 'renew',
+ token_expiry_time: expiredTokenDate,
+ });
const response = checkAuthStatusService();
expect(response).toBeFalsy();
});
diff --git a/src/services/AuthService.tsx b/src/services/AuthService.tsx
index 7cf550ba4..f1f1b5af6 100644
--- a/src/services/AuthService.tsx
+++ b/src/services/AuthService.tsx
@@ -28,6 +28,9 @@ export const getAuthSession = (element?: string) => {
case 'access_token':
returnValue = JSON.parse(session).access_token;
break;
+ case 'last_login_time':
+ returnValue = JSON.parse(session).last_login_time;
+ break;
default:
returnValue = session;
}
@@ -77,8 +80,14 @@ export const checkAuthStatusService = () => {
};
// set authentication session
-export const setAuthSession = (session: string) => {
- localStorage.setItem('glific_session', session);
+export const setAuthSession = (session: object) => {
+ const lastLoginTime = getAuthSession('last_login_time');
+ if (lastLoginTime) {
+ const existingSession = { ...session, last_login_time: lastLoginTime };
+ localStorage.setItem('glific_session', JSON.stringify(existingSession));
+ } else {
+ localStorage.setItem('glific_session', JSON.stringify(session));
+ }
};
// clear the authentication session
@@ -171,7 +180,7 @@ export const getOrganizationServices = (service: string) => {
};
export const setAuthHeaders = () => {
- // // add authorization header in all calls
+ // add authorization header in all calls
let renewTokenCalled = false;
let renewCallInProgress = false;
@@ -193,7 +202,7 @@ export const setAuthHeaders = () => {
const authToken = await renewAuthToken();
if (authToken.data) {
// update localstore
- setAuthSession(JSON.stringify(authToken.data.data));
+ setAuthSession(authToken.data.data);
renewTokenCalled = false;
}
if (parametersCopy[1]) {
@@ -255,7 +264,7 @@ export const setAuthHeaders = () => {
const authToken = await renewAuthToken();
if (authToken.data) {
// update localstore
- setAuthSession(JSON.stringify(authToken.data.data));
+ setAuthSession(authToken.data.data);
renewTokenCalled = false;
}
this.setRequestHeader('authorization', getAuthSession('access_token'));