Skip to content

Commit

Permalink
fix routing
Browse files Browse the repository at this point in the history 
* fix routing
* fix pagewrapper
* remove previous protected route features
  and reimplement (was defective)
* implement redirection feature (
  when you try to visit a protected route,
  you get redirected to the login page
  instead of the pagenotfound error,
  and after logging in you get redirected
  back to the protected page you initially
  wanted to visit)

Issue: #1127
Signed-off-by: Ndibe Raymond Olisaemeka <rolisaemeka-ctr@wikimedia.org>
  • Loading branch information
Ndibe Raymond Olisaemeka committed May 18, 2024
1 parent f4abd0c commit ee7e64f
Show file tree
Hide file tree
Showing 13 changed files with 610 additions and 1,374 deletions.
426 changes: 48 additions & 378 deletions zubhub_frontend/zubhub/src/App.js
View file

Large diffs are not rendered by default.

151 changes: 47 additions & 104 deletions zubhub_frontend/zubhub/src/api/api.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,8 +11,8 @@ class API {
*/
this.domain =
process.env.REACT_APP_NODE_ENV === 'production'
? process.env.REACT_APP_BACKEND_PRODUCTION_URL + '/api/'
: process.env.REACT_APP_BACKEND_DEVELOPMENT_URL + '/api/';
? `${process.env.REACT_APP_BACKEND_PRODUCTION_URL}/api/`
: `${process.env.REACT_APP_BACKEND_DEVELOPMENT_URL}/api/`;
}

/**
Expand All @@ -26,13 +26,7 @@ class API {
* @param {string} content_type - content type to be used for the request
* @returns {Promise<>}
*/
request = ({
url = '/',
method = 'GET',
token,
body,
content_type = 'application/json',
}) => {
request = ({ url = '/', method = 'GET', token, body, content_type = 'application/json' }) => {
if (method === 'GET' && !token) {
return fetch(this.domain + url, {
method,
Expand All @@ -52,14 +46,14 @@ class API {
withCredentials: 'true',
headers: content_type
? new Headers({
Authorization: `Token ${token}`,
'Content-Type': content_type,
'Accept-Language': `${i18next.language},en;q=0.5`,
})
Authorization: `Token ${token}`,
'Content-Type': content_type,
'Accept-Language': `${i18next.language},en;q=0.5`,
})
: new Headers({
Authorization: `Token ${token}`,
'Accept-Language': `${i18next.language},en;q=0.5`,
}),
Authorization: `Token ${token}`,
'Accept-Language': `${i18next.language},en;q=0.5`,
}),
body,
});
} else if (token) {
Expand Down Expand Up @@ -124,9 +118,6 @@ class API {
* @todo - describe method's signature
*/
logout = token => {
const initialUrl = window.location.href
sessionStorage.setItem('initialUrl', initialUrl)

const url = 'rest-auth/logout/';
const method = 'POST';
return this.request({ url, method, token }).then(res => res.json());
Expand All @@ -138,17 +129,7 @@ class API {
*
* @todo - describe method's signature
*/
signup = ({
username,
email,
phone,
dateOfBirth,
user_location,
password1,
password2,
bio,
subscribe,
}) => {
signup = ({ username, email, phone, dateOfBirth, user_location, password1, password2, bio, subscribe }) => {
const url = 'creators/register/';
const method = 'POST';
const body = JSON.stringify({
Expand Down Expand Up @@ -296,7 +277,7 @@ class API {
const url = `creators/${groupname}/remove-member/${username}/`;
const method = 'DELETE';
if (token) {
return this.request({ url, method ,token }).then(res => res.json());
return this.request({ url, method, token }).then(res => res.json());
} else {
return this.request({ url, method }).then(res => res.json());
}
Expand All @@ -312,7 +293,7 @@ class API {
const url = `creators/${groupname}/toggle-follow/${username}/`;
const method = 'GET';
if (token) {
return this.request({ url, method ,token }).then(res => res.json());
return this.request({ url, method, token }).then(res => res.json());
} else {
return this.request({ url, method }).then(res => res.json());
}
Expand All @@ -328,7 +309,7 @@ class API {
const url = `creators/${groupname}/members/`;
const method = 'GET';
if (token) {
return this.request({ url, method ,token }).then(res => res.json());
return this.request({ url, method, token }).then(res => res.json());
} else {
return this.request({ url, method }).then(res => res.json());
}
Expand All @@ -340,7 +321,7 @@ class API {
*
* @todo - describe method's signature
*/
teamMembersId = ( id ) => {
teamMembersId = id => {
const url = `creators/id/${id}/`;
const method = 'GET';
return this.request({ url, method }).then(res => res.json());
Expand All @@ -356,7 +337,7 @@ class API {
const url = `creators/${groupname}/delete-group/`;
const method = 'DELETE';
if (token) {
return this.request({ url, method ,token }).then(res => res.json());
return this.request({ url, method, token }).then(res => res.json());
} else {
return this.request({ url, method }).then(res => res.json());
}
Expand All @@ -372,7 +353,7 @@ class API {
const url = `creators/${groupname}/group-followers/`;
const method = 'GET';
if (token) {
return this.request({ url, method ,token }).then(res => res.json());
return this.request({ url, method, token }).then(res => res.json());
} else {
return this.request({ url, method }).then(res => res.json());
}
Expand All @@ -388,7 +369,7 @@ class API {
const url = `creators/groups/${username}/`;
const method = 'GET';
if (token) {
return this.request({ url, method ,token }).then(res => res.json());
return this.request({ url, method, token }).then(res => res.json());
} else {
return this.request({ url, method }).then(res => res.json());
}
Expand All @@ -404,7 +385,7 @@ class API {
const url = `creators/teams/`;
const method = 'GET';
if (token) {
return this.request({ url, method ,token }).then(res => res.json());
return this.request({ url, method, token }).then(res => res.json());
} else {
return this.request({ url, method }).then(res => res.json());
}
Expand All @@ -422,7 +403,7 @@ class API {
const content_type = false;
const body = data;
if (token) {
return this.request({ url, method ,token, body, content_type }).then(res => res.json());
return this.request({ url, method, token, body, content_type }).then(res => res.json());
} else {
return this.request({ url, method }).then(res => res.json());
}
Expand All @@ -439,7 +420,7 @@ class API {
const method = 'POST';
const content_type = 'application/json';
const body = JSON.stringify(data);

if (token) {
return this.request({ url, method, token, body, content_type }).then(res => res.json());
} else {
Expand All @@ -459,7 +440,7 @@ class API {
const content_type = 'application/json';
const body = JSON.stringify(data);
if (token) {
return this.request({ url, method ,token, body, content_type }).then(res => res.json());
return this.request({ url, method, token, body, content_type }).then(res => res.json());
} else {
return this.request({ url, method }).then(res => res.json());
}
Expand All @@ -474,14 +455,14 @@ class API {
*/
getUserProjects = ({ username, page, limit, token, project_to_omit }) => {
let url = `creators/${username}/projects`;
let queryParams = sanitizeObject({ page, limit, project_to_omit })
const queryParams = sanitizeObject({ page, limit, project_to_omit });
const searchParams = new URLSearchParams(queryParams);
url = `${url}?${searchParams}`;
return this.request({ url, token }).then(res => res.json());
};

getUserActivity = (username, page) => {
let url = `activitylog/${username}/?page=${page}`;
const url = `activitylog/${username}/?page=${page}`;

return this.request({ url }).then(res => res.json());
};
Expand Down Expand Up @@ -574,9 +555,7 @@ class API {
* @todo - describe method's signature
*/
getFollowers = ({ page, username }) => {
const url = page
? `creators/${username}/followers/?${page}`
: `creators/${username}/followers/`;
const url = page ? `creators/${username}/followers/?${page}` : `creators/${username}/followers/`;

return this.request({ url }).then(res => res.json());
};
Expand All @@ -588,9 +567,7 @@ class API {
* @todo - describe method's signature
*/
getFollowing = ({ page, username }) => {
const url = page
? `creators/${username}/following/?${page}`
: `creators/${username}/following/`;
const url = page ? `creators/${username}/following/?${page}` : `creators/${username}/following/`;

return this.request({ url }).then(res => res.json());
};
Expand All @@ -614,8 +591,7 @@ class API {
* @todo - describe method's signature
*/
editUserProfile = props => {
const { token, username, email, phone, dateOfBirth, bio, user_location } =
props;
const { token, username, email, phone, dateOfBirth, bio, user_location } = props;

const url = 'creators/edit-creator/';
const method = 'PUT';
Expand Down Expand Up @@ -663,9 +639,7 @@ class API {
* @todo - describe method's signature
*/
getMembers = ({ page, username }) => {
const url = page
? `creators/${username}/members/?${page}`
: `creators/${username}/members/`;
const url = page ? `creators/${username}/members/?${page}` : `creators/${username}/members/`;

return this.request({ url }).then(res => res.json());
};
Expand All @@ -681,9 +655,7 @@ class API {
const method = 'POST';
const content_type = false;
const body = data;
return this.request({ url, method, token, body, content_type }).then(res =>
res.json(),
);
return this.request({ url, method, token, body, content_type }).then(res => res.json());
};

/**
Expand Down Expand Up @@ -731,18 +703,7 @@ class API {
*
* @todo - describe method's signature
*/
createProject = ({
token,
title,
description,
video,
images,
materials_used,
category,
tags,
publish,
activity,
}) => {
createProject = ({ token, title, description, video, images, materials_used, category, tags, publish, activity }) => {
const url = 'projects/create/';
const method = 'POST';
const body = JSON.stringify({
Expand All @@ -765,18 +726,7 @@ class API {
*
* @todo - describe method's signature
*/
updateProject = ({
token,
id,
title,
description,
video,
images,
materials_used,
category,
tags,
publish,
}) => {
updateProject = ({ token, id, title, description, video, images, materials_used, category, tags, publish }) => {
const url = `projects/${id}/update/`;
const method = 'PATCH';

Expand Down Expand Up @@ -830,9 +780,7 @@ class API {
const method = 'PATCH';
const body = JSON.stringify({});
return this.request({ url, method, token, body }).then(res =>
Promise.resolve(
res.status === 200 ? res.json() : { details: 'unknown error' },
),
Promise.resolve(res.status === 200 ? res.json() : { details: 'unknown error' }),
);
};

Expand Down Expand Up @@ -862,11 +810,11 @@ class API {
};

/**
* @method getActivity
* @author Yaya Mamoudou <yayamamoudou0@gmail.com>
*
* @todo - describe method's signature
*/
* @method getActivity
* @author Yaya Mamoudou <yayamamoudou0@gmail.com>
*
* @todo - describe method's signature
*/
getActivity = ({ token, id }) => {
const url = `activities/${id}`;
return this.request({ token, url }).then(res => res.json());
Expand Down Expand Up @@ -912,9 +860,7 @@ class API {
* @todo - describe method's signature
*/
getStaffPick = ({ token, page, id }) => {
const url = page
? `projects/staff-picks/${id}/?page=${page}`
: `projects/staff-picks/${id}`;
const url = page ? `projects/staff-picks/${id}/?page=${page}` : `projects/staff-picks/${id}`;

return this.request({ token, url }).then(res => res.json());
};
Expand Down Expand Up @@ -1024,10 +970,10 @@ class API {
};

/**
* @method getChallenge
* @author Suchakra Sharma <suchakra@unstructured.studio>
*
*/
* @method getChallenge
* @author Suchakra Sharma <suchakra@unstructured.studio>
*
*/
getChallenge = () => {
const url = `challenge/`;

Expand Down Expand Up @@ -1065,9 +1011,7 @@ class API {
* @todo - describe method's signature
*/
getAmbassadors = ({ token, page }) => {
const url = page
? `ambassadors/?page=${page}`
: `ambassadors`;
const url = page ? `ambassadors/?page=${page}` : `ambassadors`;

return this.request({ token, url }).then(res => res.json());
};
Expand All @@ -1079,7 +1023,7 @@ class API {
* @returns the user's notifications
*/
getNotifications = (page, token) => {
const url = 'notifications/?' + new URLSearchParams({ page }).toString();
const url = `notifications/?${new URLSearchParams({ page }).toString()}`;

return this.request({ url, token }).then(res => res.json());
};
Expand Down Expand Up @@ -1127,7 +1071,7 @@ class API {

const body = JSON.stringify(args);
return this.request({ url, method, token, body });
//.then(res => res.json());
// .then(res => res.json());
};

deleteActivity = ({ token, id }) => {
Expand All @@ -1136,9 +1080,8 @@ class API {
return this.request({ url, method, token });
};

getActivities = (params) => {

let queryParams = sanitizeObject(params)
getActivities = params => {
const queryParams = sanitizeObject(params);
const searchParams = new URLSearchParams(queryParams);
let url = `activities`;
url = `${url}?${searchParams}`;
Expand Down
Loading

0 comments on commit ee7e64f

Please sign in to comment.