From 13321e51bc6ea18072b3e4e9bdecfa43f4fe2286 Mon Sep 17 00:00:00 2001 From: Keiffer Acoba Date: Fri, 17 Jul 2020 02:17:38 -0400 Subject: [PATCH 1/6] Create Error components --- .../ViewActivities/ErrorComponents.js | 73 +++++++++++++++++++ 1 file changed, 73 insertions(+) create mode 100644 frontend/src/components/ViewActivities/ErrorComponents.js diff --git a/frontend/src/components/ViewActivities/ErrorComponents.js b/frontend/src/components/ViewActivities/ErrorComponents.js new file mode 100644 index 00000000..73e68196 --- /dev/null +++ b/frontend/src/components/ViewActivities/ErrorComponents.js @@ -0,0 +1,73 @@ +import React from 'react'; +import { useHistory } from 'react-router-dom'; + +import Button from 'react-bootstrap/Button'; + +import { VIEW_TRIPS } from '../../constants/routes'; + +/** + * A simple Button component that redirects the user back to the VIEW_TRIPS page + * that is rendered with each of this file's error components. + */ +const GoToTripsButton = () => { + const history = useHistory(); + + function goToTrips() { + history.push(VIEW_TRIPS); + } + + return ( + + ); +} + +/** + * Error component for any general error that occurs, such as failure fetching + * from Firebase. + */ +class ErrorGeneral extends React.Component { + /** @inheritdoc */ + render() { + return ( +
+

+ Oops, looks like something went wrong. Please wait a few minutes and + try again. +

+ +
+ ); + } +} + +class ErrorNotCollaborator extends React.Component { + /** @inheritdoc */ + render() { + return ( +
+

Sorry, you're not authorized to view this trip.

+ +
+ ); + } +} + +class ErrorTripNotFound extends React.Component { + /** @inheritdoc */ + render() { + return ( +
+

Sorry, we couldn't find the trip you were looking for.

+ +
+ ); + } +} + +export { + ErrorGeneral, + ErrorNotCollaborator, + ErrorTripNotFound +}; From af4ec41eb089fa297d0a84e6d12a7381ee9a169a Mon Sep 17 00:00:00 2001 From: Keiffer Acoba Date: Fri, 17 Jul 2020 02:21:59 -0400 Subject: [PATCH 2/6] Address Issue #74 by using the error components --- frontend/src/components/ViewActivities/index.js | 15 ++++----------- 1 file changed, 4 insertions(+), 11 deletions(-) diff --git a/frontend/src/components/ViewActivities/index.js b/frontend/src/components/ViewActivities/index.js index 6ee2425d..4093576a 100644 --- a/frontend/src/components/ViewActivities/index.js +++ b/frontend/src/components/ViewActivities/index.js @@ -2,6 +2,7 @@ import React from 'react'; import app from '../Firebase'; import { getUserUid } from '../AuthUtils'; import ActivityList from './activitylist.js'; +import * as ErrorComponents from './ErrorComponents.js'; import * as DB from '../../constants/database.js'; @@ -52,13 +53,7 @@ class ViewActivities extends React.Component { render() { // Case where there was a Firebase error. if (this.state.error !== undefined) { - // TODO (Issue #74): Redirect to an error page instead. - return ( -
- Oops, looks like something went wrong. Please wait a few minutes and - try again. -
- ); + return
; } // Case where the trip details are still being fetched. if (this.state.isLoading) { @@ -68,13 +63,11 @@ class ViewActivities extends React.Component { } // Case where the trip could not be found. else if (this.state.collaborators === undefined) { - // TODO (Issue #74): Redirect to an error page instead. - return
Sorry, we couldn't find the trip you were looking for.
; + return
; } // Case where the current user is not authorized to view the page else if (!this.state.collaborators.includes(getUserUid())) { - // TODO (Issue #74): Redirect to an error page instead. - return
Sorry, you're not authorized to view this trip.
; + return
; } else { return ( From edc125c23759dceb6ae36c2f4dff33fa4e0fe8e9 Mon Sep 17 00:00:00 2001 From: Keiffer Acoba Date: Tue, 21 Jul 2020 19:21:08 -0400 Subject: [PATCH 3/6] Move ErrorComponents to a separate directory --- .../{ViewActivities/ErrorComponents.js => Errors/index.js} | 0 frontend/src/components/ViewActivities/index.js | 2 +- 2 files changed, 1 insertion(+), 1 deletion(-) rename frontend/src/components/{ViewActivities/ErrorComponents.js => Errors/index.js} (100%) diff --git a/frontend/src/components/ViewActivities/ErrorComponents.js b/frontend/src/components/Errors/index.js similarity index 100% rename from frontend/src/components/ViewActivities/ErrorComponents.js rename to frontend/src/components/Errors/index.js diff --git a/frontend/src/components/ViewActivities/index.js b/frontend/src/components/ViewActivities/index.js index 4093576a..949e3cdf 100644 --- a/frontend/src/components/ViewActivities/index.js +++ b/frontend/src/components/ViewActivities/index.js @@ -2,7 +2,7 @@ import React from 'react'; import app from '../Firebase'; import { getUserUid } from '../AuthUtils'; import ActivityList from './activitylist.js'; -import * as ErrorComponents from './ErrorComponents.js'; +import * as ErrorComponents from '../Errors'; import * as DB from '../../constants/database.js'; From 00f0945c1ccdc56c72b90bd42ed19e9aee050eff Mon Sep 17 00:00:00 2001 From: Keiffer Acoba Date: Tue, 21 Jul 2020 19:41:19 -0400 Subject: [PATCH 4/6] Abstract error components into separate files --- .../src/components/Errors/ErrorGeneral.js | 23 ++++++ .../components/Errors/ErrorNotCollaborator.js | 20 ++++++ .../components/Errors/ErrorTripNotFound.js | 20 ++++++ .../src/components/Errors/GoToTripsButton.js | 26 +++++++ frontend/src/components/Errors/index.js | 70 +------------------ 5 files changed, 92 insertions(+), 67 deletions(-) create mode 100644 frontend/src/components/Errors/ErrorGeneral.js create mode 100644 frontend/src/components/Errors/ErrorNotCollaborator.js create mode 100644 frontend/src/components/Errors/ErrorTripNotFound.js create mode 100644 frontend/src/components/Errors/GoToTripsButton.js diff --git a/frontend/src/components/Errors/ErrorGeneral.js b/frontend/src/components/Errors/ErrorGeneral.js new file mode 100644 index 00000000..1b8e7fd8 --- /dev/null +++ b/frontend/src/components/Errors/ErrorGeneral.js @@ -0,0 +1,23 @@ +import React from 'react'; +import GoToTripsButton from './GoToTripsButton.js'; + +/** + * Error component for any general error that occurs, such as failure fetching + * from Firebase. + */ +class ErrorGeneral extends React.Component { + /** @inheritdoc */ + render() { + return ( +
+

+ Oops, looks like something went wrong. Please wait a few minutes and + try again. +

+ +
+ ); + } +} + +export default ErrorGeneral diff --git a/frontend/src/components/Errors/ErrorNotCollaborator.js b/frontend/src/components/Errors/ErrorNotCollaborator.js new file mode 100644 index 00000000..03e732bd --- /dev/null +++ b/frontend/src/components/Errors/ErrorNotCollaborator.js @@ -0,0 +1,20 @@ +import React from 'react'; +import GoToTripsButton from './GoToTripsButton.js'; + +/** + * Error component displayed for when the current user is not listed as a + * collaborator for the trip they are trying to access. + */ +class ErrorNotCollaborator extends React.Component { + /** @inheritdoc */ + render() { + return ( +
+

Sorry, you're not authorized to view this trip.

+ +
+ ); + } +} + +export default ErrorNotCollaborator; diff --git a/frontend/src/components/Errors/ErrorTripNotFound.js b/frontend/src/components/Errors/ErrorTripNotFound.js new file mode 100644 index 00000000..9a61fa18 --- /dev/null +++ b/frontend/src/components/Errors/ErrorTripNotFound.js @@ -0,0 +1,20 @@ +import React from 'react'; +import GoToTripsButton from './GoToTripsButton.js'; + +/** + * Error component displayed when a nonexistent trip is queried for in the + * database. + */ +class ErrorTripNotFound extends React.Component { + /** @inheritdoc */ + render() { + return ( +
+

Sorry, we couldn't find the trip you were looking for.

+ +
+ ); + } +} + +export default ErrorTripNotFound; diff --git a/frontend/src/components/Errors/GoToTripsButton.js b/frontend/src/components/Errors/GoToTripsButton.js new file mode 100644 index 00000000..7c3ae2fa --- /dev/null +++ b/frontend/src/components/Errors/GoToTripsButton.js @@ -0,0 +1,26 @@ +import React from 'react'; +import { useHistory } from 'react-router-dom'; + +import Button from 'react-bootstrap/Button'; + +import { VIEW_TRIPS } from '../../constants/routes'; + +/** + * A simple Button component that redirects the user back to the VIEW_TRIPS page + * that is rendered with each of this file's error components. + */ +const GoToTripsButton = () => { + const history = useHistory(); + + function goToTrips() { + history.push(VIEW_TRIPS); + } + + return ( + + ); +} + +export default GoToTripsButton; diff --git a/frontend/src/components/Errors/index.js b/frontend/src/components/Errors/index.js index 73e68196..20278b46 100644 --- a/frontend/src/components/Errors/index.js +++ b/frontend/src/components/Errors/index.js @@ -1,70 +1,6 @@ -import React from 'react'; -import { useHistory } from 'react-router-dom'; - -import Button from 'react-bootstrap/Button'; - -import { VIEW_TRIPS } from '../../constants/routes'; - -/** - * A simple Button component that redirects the user back to the VIEW_TRIPS page - * that is rendered with each of this file's error components. - */ -const GoToTripsButton = () => { - const history = useHistory(); - - function goToTrips() { - history.push(VIEW_TRIPS); - } - - return ( - - ); -} - -/** - * Error component for any general error that occurs, such as failure fetching - * from Firebase. - */ -class ErrorGeneral extends React.Component { - /** @inheritdoc */ - render() { - return ( -
-

- Oops, looks like something went wrong. Please wait a few minutes and - try again. -

- -
- ); - } -} - -class ErrorNotCollaborator extends React.Component { - /** @inheritdoc */ - render() { - return ( -
-

Sorry, you're not authorized to view this trip.

- -
- ); - } -} - -class ErrorTripNotFound extends React.Component { - /** @inheritdoc */ - render() { - return ( -
-

Sorry, we couldn't find the trip you were looking for.

- -
- ); - } -} +import ErrorGeneral from './ErrorGeneral.js'; +import ErrorNotCollaborator from './ErrorNotCollaborator.js'; +import ErrorTripNotFound from './ErrorTripNotFound.js'; export { ErrorGeneral, From 5546e385911741cc48dc74180292fb72af7d800f Mon Sep 17 00:00:00 2001 From: Keiffer Acoba Date: Mon, 27 Jul 2020 01:31:30 -0400 Subject: [PATCH 5/6] Remove ErrorNotCollaborator and have the functionality handled by ErrorTripNotFound --- .../components/Errors/ErrorNotCollaborator.js | 20 ------------------- frontend/src/components/Errors/index.js | 2 -- .../src/components/ViewActivities/index.js | 10 ++++------ 3 files changed, 4 insertions(+), 28 deletions(-) delete mode 100644 frontend/src/components/Errors/ErrorNotCollaborator.js diff --git a/frontend/src/components/Errors/ErrorNotCollaborator.js b/frontend/src/components/Errors/ErrorNotCollaborator.js deleted file mode 100644 index 03e732bd..00000000 --- a/frontend/src/components/Errors/ErrorNotCollaborator.js +++ /dev/null @@ -1,20 +0,0 @@ -import React from 'react'; -import GoToTripsButton from './GoToTripsButton.js'; - -/** - * Error component displayed for when the current user is not listed as a - * collaborator for the trip they are trying to access. - */ -class ErrorNotCollaborator extends React.Component { - /** @inheritdoc */ - render() { - return ( -
-

Sorry, you're not authorized to view this trip.

- -
- ); - } -} - -export default ErrorNotCollaborator; diff --git a/frontend/src/components/Errors/index.js b/frontend/src/components/Errors/index.js index 20278b46..41f411b8 100644 --- a/frontend/src/components/Errors/index.js +++ b/frontend/src/components/Errors/index.js @@ -1,9 +1,7 @@ import ErrorGeneral from './ErrorGeneral.js'; -import ErrorNotCollaborator from './ErrorNotCollaborator.js'; import ErrorTripNotFound from './ErrorTripNotFound.js'; export { ErrorGeneral, - ErrorNotCollaborator, ErrorTripNotFound }; diff --git a/frontend/src/components/ViewActivities/index.js b/frontend/src/components/ViewActivities/index.js index 949e3cdf..7b0ba78a 100644 --- a/frontend/src/components/ViewActivities/index.js +++ b/frontend/src/components/ViewActivities/index.js @@ -61,14 +61,12 @@ class ViewActivities extends React.Component { // deployed build lol. return
Loading Part 2: Electric Boogaloo
; } - // Case where the trip could not be found. - else if (this.state.collaborators === undefined) { + // Case where the trip could not be found or the current user is not + // authorized to view the trip. + else if (this.state.collaborators === undefined || + !this.state.collaborators.includes(getUserUid())) { return
; } - // Case where the current user is not authorized to view the page - else if (!this.state.collaborators.includes(getUserUid())) { - return
; - } else { return (
From c11f9a2c73e2f2277173d0f976f538177b27890d Mon Sep 17 00:00:00 2001 From: Keiffer Acoba Date: Tue, 28 Jul 2020 12:38:33 -0400 Subject: [PATCH 6/6] Replace getUserUid with getCurUserUid --- frontend/src/components/ViewActivities/index.js | 7 ++++--- frontend/src/components/ViewActivities/index.test.js | 4 ++-- 2 files changed, 6 insertions(+), 5 deletions(-) diff --git a/frontend/src/components/ViewActivities/index.js b/frontend/src/components/ViewActivities/index.js index 7b0ba78a..1e9f48a6 100644 --- a/frontend/src/components/ViewActivities/index.js +++ b/frontend/src/components/ViewActivities/index.js @@ -1,9 +1,10 @@ import React from 'react'; + import app from '../Firebase'; -import { getUserUid } from '../AuthUtils'; + import ActivityList from './activitylist.js'; +import { getCurUserUid } from '../AuthUtils'; import * as ErrorComponents from '../Errors'; - import * as DB from '../../constants/database.js'; /** @@ -64,7 +65,7 @@ class ViewActivities extends React.Component { // Case where the trip could not be found or the current user is not // authorized to view the trip. else if (this.state.collaborators === undefined || - !this.state.collaborators.includes(getUserUid())) { + !this.state.collaborators.includes(getCurUserUid())) { return
; } else { diff --git a/frontend/src/components/ViewActivities/index.test.js b/frontend/src/components/ViewActivities/index.test.js index 71b35cd4..c9bf8160 100644 --- a/frontend/src/components/ViewActivities/index.test.js +++ b/frontend/src/components/ViewActivities/index.test.js @@ -11,10 +11,10 @@ const RESULT_NOT_AUTHORIZED = const RESULT_TRIP_DOESNT_EXIST = 'Sorry, we couldn\'t find the trip you were looking for.'; -// Mock the getUserUid auth utility function to return a fake UID as given by +// Mock the getCurUserUid auth utility function to return a fake UID as given by // FAKE_USER. jest.mock('../AuthUtils'); -authUtils.getUserUid.mockReturnValue(FAKE_USER); +authUtils.getCurUserUid.mockReturnValue(FAKE_USER); // Mock the ActivityList component to simply render the passed-in tripId. jest.mock('./activitylist.js', () => (props) => (