Skip to content

Commit

Permalink
chore(frontend/redux): begin migration to TypeScript
Browse files Browse the repository at this point in the history
  • Loading branch information
JoltCode committed Aug 20, 2024
1 parent 308df28 commit db6527a
Show file tree
Hide file tree
Showing 13 changed files with 265 additions and 135 deletions.
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
import { setItem, removeItem, getItem } from '../../utils/safe_storage';
import { pushToLocalJSONAPI, fetchLocalJSONAPI } from '../../network/genericJSONRequest';
import { setLoader } from './loader';
import { Dispatch } from 'redux';

export const types = {
REGISTER_USER: 'REGISTER_USER',
Expand All @@ -13,7 +14,7 @@ export const types = {
SET_TOKEN: 'SET_TOKEN',
SET_SESSION: 'SET_SESSION',
CLEAR_SESSION: 'CLEAR_SESSION',
};
} as const;

export function clearUserDetails() {
return {
Expand All @@ -38,7 +39,7 @@ export const updateUserEmail = (userDetails, token, relevant_fields) => (dispatc
});
};

export const logout = () => (dispatch) => {
export const logout = () => (dispatch: Dispatch) => {
removeItem('username');
removeItem('token');
removeItem('action');
Expand Down Expand Up @@ -106,41 +107,41 @@ export const setAuthDetails = (username, token, osm_oauth_token) => (dispatch) =
// UPDATES OSM INFORMATION OF THE USER
export const setUserDetails =
(username, encodedToken, update = false) =>
(dispatch) => {
// only trigger the loader if this function is not being triggered to update the user information
if (!update) dispatch(setLoader(true));
fetchLocalJSONAPI(`users/${username}/openstreetmap/`, encodedToken)
.then((osmInfo) => dispatch(updateOSMInfo(osmInfo)))
.catch((error) => {
console.log(error);
dispatch(setLoader(false));
});
// GET USER DETAILS
fetchLocalJSONAPI(`users/queries/${username}/`, encodedToken)
.then((userDetails) => {
dispatch(updateUserDetails(userDetails));
// GET USER ORGS INFO
fetchLocalJSONAPI(
`organisations/?omitManagerList=true&manager_user_id=${userDetails.id}`,
encodedToken,
)
.then((orgs) =>
dispatch(updateOrgsInfo(orgs.organisations.map((org) => org.organisationId))),
(dispatch) => {
// only trigger the loader if this function is not being triggered to update the user information
if (!update) dispatch(setLoader(true));
fetchLocalJSONAPI(`users/${username}/openstreetmap/`, encodedToken)
.then((osmInfo) => dispatch(updateOSMInfo(osmInfo)))
.catch((error) => {
console.log(error);
dispatch(setLoader(false));
});
// GET USER DETAILS
fetchLocalJSONAPI(`users/queries/${username}/`, encodedToken)
.then((userDetails) => {
dispatch(updateUserDetails(userDetails));
// GET USER ORGS INFO
fetchLocalJSONAPI(
`organisations/?omitManagerList=true&manager_user_id=${userDetails.id}`,
encodedToken,
)
.catch((error) => dispatch(updateOrgsInfo([])));
fetchLocalJSONAPI(
`teams/?omitMemberList=true&team_role=PROJECT_MANAGER&member=${userDetails.id}`,
encodedToken,
)
.then((teams) => dispatch(updatePMsTeams(teams.teams.map((team) => team.teamId))))
.catch((error) => dispatch(updatePMsTeams([])));
dispatch(setLoader(false));
})
.catch((error) => {
if (error.message === 'InvalidToken') dispatch(logout());
dispatch(setLoader(false));
});
};
.then((orgs) =>
dispatch(updateOrgsInfo(orgs.organisations.map((org) => org.organisationId))),
)
.catch((error) => dispatch(updateOrgsInfo([])));
fetchLocalJSONAPI(
`teams/?omitMemberList=true&team_role=PROJECT_MANAGER&member=${userDetails.id}`,
encodedToken,
)
.then((teams) => dispatch(updatePMsTeams(teams.teams.map((team) => team.teamId))))
.catch((error) => dispatch(updatePMsTeams([])));
dispatch(setLoader(false));
})
.catch((error) => {
if (error.message === 'InvalidToken') dispatch(logout());
dispatch(setLoader(false));
});
};

export const getUserDetails = (state) => (dispatch) => {
if (state.auth.userDetails.username) {
Expand All @@ -150,8 +151,8 @@ export const getUserDetails = (state) => (dispatch) => {

export const pushUserDetails =
(userDetails, token, update = false) =>
(dispatch) => {
pushToLocalJSONAPI(`users/me/actions/set-user/`, userDetails, token, 'PATCH').then((data) =>
dispatch(setUserDetails(getItem('username'), token, update)),
);
};
(dispatch) => {
pushToLocalJSONAPI(`users/me/actions/set-user/`, userDetails, token, 'PATCH').then((data) =>
dispatch(setUserDetails(getItem('username'), token, update)),
);
};
Original file line number Diff line number Diff line change
Expand Up @@ -4,4 +4,4 @@ export const types = {
NOTIFICATIONS_FAILURE: 'NOTIFICATIONS_FAILURE',
SET_UNREAD_COUNT: 'SET_UNREAD_COUNT',
DECREMENT_UNREAD_COUNT: 'DECREMENT_UNREAD_COUNT',
};
} as const;
Original file line number Diff line number Diff line change
@@ -1,25 +1,27 @@
import { Dispatch } from "redux";

export const types = {
SET_LOCKED_TASKS: 'SET_LOCKED_TASKS',
SET_PROJECT: 'SET_PROJECT',
SET_TASKS_STATUS: 'SET_TASKS_STATUS',
CLEAR_LOCKED_TASKS: 'CLEAR_LOCKED_TASKS',
};
} as const;

export function updateProject(project) {
export function updateProject(project: any) {
return {
type: types.SET_PROJECT,
project: project,
};
}

export function updateLockedTasks(tasks) {
export function updateLockedTasks(tasks: any) {
return {
type: types.SET_LOCKED_TASKS,
tasks: tasks,
};
}

export function updateTasksStatus(status) {
export function updateTasksStatus(status: any) {
return {
type: types.SET_TASKS_STATUS,
status: status,
Expand All @@ -32,11 +34,11 @@ export function clearLockedTasks() {
};
}

export const setLockedTasks = (tasks, projectId) => (dispatch) => {
export const setLockedTasks = (tasks, projectId) => (dispatch: Dispatch) => {
dispatch(updateLockedTasks(tasks));
dispatch(updateProject(projectId));
};

export const setTasksStatus = (status) => (dispatch) => {
export const setTasksStatus = (status) => (dispatch: Dispatch) => {
dispatch(updateTasksStatus(status));
};
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
import { Dispatch } from 'redux';
import { setItem } from '../../utils/safe_storage';

export const types = {
Expand All @@ -6,16 +7,16 @@ export const types = {
TOGGLE_MAP: 'TOGGLE_MAP',
TOGGLE_LIST_VIEW: 'TOGGLE_LIST_VIEW',
TOGGLE_CARD_VIEW: 'TOGGLE_CARD_VIEW',
};
} as const;

export function updateLocale(locale) {
export function updateLocale(locale: string) {
return {
type: types.SET_LOCALE,
locale: locale,
};
}

export const setLocale = (locale) => (dispatch) => {
export const setLocale = (locale: string) => (dispatch: Dispatch) => {
setItem('locale', locale);
dispatch(updateLocale(locale));
};
36 changes: 0 additions & 36 deletions frontend/src/store/index.js

This file was deleted.

35 changes: 35 additions & 0 deletions frontend/src/store/index.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,35 @@
import { applyMiddleware, createStore, compose } from 'redux';
import thunk from 'redux-thunk';

import { persistReducer, persistStore } from 'redux-persist';
import storage from 'redux-persist/lib/storage';

import { setItem } from '../utils/safe_storage';
import reducers from './reducers';
import { composeWithDevTools } from '@redux-devtools/extension';

const persistConfig = {
key: 'root',
storage,
blacklist: ['editor', 'orgBarVisibility'],
};

const persistedReducer = persistReducer<{
preferences: {
mapShown: boolean;
action: string;
projectListView: boolean;
}
}>(persistConfig, reducers);

const store = createStore(persistedReducer, undefined, composeWithDevTools((applyMiddleware(thunk))));

const persistor = persistStore(store);

store.subscribe(() => {
setItem('mapShown', store.getState().preferences.mapShown);
setItem('action', store.getState().preferences.action);
setItem('projectListView', store.getState().preferences.projectListView);
});

export { store, persistor };
38 changes: 0 additions & 38 deletions frontend/src/store/reducers/auth.js

This file was deleted.

79 changes: 79 additions & 0 deletions frontend/src/store/reducers/auth.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,79 @@
import { types } from '../actions/auth';

type UserData = {
userDetails: {
id: number;
username: string;
emailAddress: string;
role: string;
} | null,
token: string,
session: {
osm_oauth_token: string;
} | null,
osm: {
accountCreated: string;
} | null,
organisations: string[],
pmTeams: string[],
}

const initialState = {
userDetails: null,
token: '',
session: null,
osm: null,
organisations: [],
pmTeams: [],
} satisfies UserData;

type Actions = {
type: typeof types.SET_USER_DETAILS,
userDetails: UserData['userDetails'],
} | {
type: typeof types.SET_OSM,
osm: UserData['osm'],
} | {
type: typeof types.SET_ORGANISATIONS,
organisations: UserData['organisations'],
} | {
type: typeof types.SET_PM_TEAMS,
teams: UserData['pmTeams'],
} | {
type: typeof types.SET_TOKEN,
token: UserData['token'],
} | {
type: typeof types.SET_SESSION,
session: UserData['session'],
} | {
type: typeof types.CLEAR_SESSION,
session: null,
}

export function authorizationReducer(state = initialState, action: Actions) {
switch (action.type) {
case types.SET_USER_DETAILS: {
return { ...state, userDetails: action.userDetails };
}
case types.SET_OSM: {
return { ...state, osm: action.osm };
}
case types.SET_ORGANISATIONS: {
return { ...state, organisations: action.organisations };
}
case types.SET_PM_TEAMS: {
return { ...state, pmTeams: action.teams };
}
case types.SET_TOKEN: {
return { ...state, token: action.token };
}
case types.SET_SESSION: {
return { ...state, session: action.session };
}
case types.CLEAR_SESSION: {
return initialState;
}
default:
return state;
}
}
File renamed without changes.
Loading

0 comments on commit db6527a

Please sign in to comment.