If anyone needs credentials, please have them make a request in the "boilerplate" Slack channel.
Acceptance
Improved Sentry Logging
Note: We aren't using Sentry at the moment. However, whenever there's an error, we show a "Something went wrong." message to the user.
[ ] If you find a bug and it causes an error to happen, it should show the "Something went wrong." message to the user.
Robust Authentication
Scenario (1) - Internet Issues
[ ] Go into your browser's developer tools and switch it to "Offline"
[ ] You should see an "Internet Connection Lost" toast message show up.
[ ] When you reconnect, you should see an "Internet Connection Restored" toast message show up.
Scenario (2) - User receives a forbidden or unauthorized error code
[ ] Log in with one user
[ ] In a separate browser, log in with an admin
[ ] Delete the account of the user. When this happens, the user should be logged out of the app and be presented with the log in screen and a toast message that describes what happened.
Overhauled Modals
Scenarios that cause a modal to be shown:
[ ] Go to any form and make an edit. If you try going to a different page without submitting, you will be presented with an "Unsaved Changes" modal. (Exception - Change Email Address form)
[ ] Deleting agents or users via the Agent or User lists
[ ] Clicking on the "Resend Activation Email" for users/editors/admins that haven't been activated yet
[ ] Clicking on the "Reset Password" button for users/editors/admins
Top Navigation Bar + Dropdowns in the Navbar
[ ] Interact with the various controls that are a part of the navigation bar that's displayed at the top
Overhauled Phone Number Input
Adding Agents
[ ] Click on the "Directory" tab and click on the "Add Agent" button
[ ] Fill out the infomation for a new agent and then submit the form
Updating Agents
[ ] Click on the "Directory" tab and click on one of the existing agents
[ ] Update the phone number and any other fields and then submit the form
Notifications Feature
Note: You can't mark individual notifications as read at the moment. Additionally, notifications are live. When an agent is created, all other admins will get a notification pushed to them immediately.
[ ] Notice that the notification button in the navigation bar will say "9+" when an admin has more than 9 unread notifications
An admin will get a notification when another admin creates an agent.
When an admin receives a notification while logged in, they will see a toast message show up.
[ ] Click on the notification button in order to go to the "My Notifications" page
[ ] Click on the first link of a notification and it will open the "Update User" page with the associated user's information
[ ] Click on the second link of a notification and it will open the "Edit Agent" page with the associated agent's information
[ ] Click on the "Mark all Read" button in order to mark all of your notifications as being read
Improved Profile Photo Upload UX
[ ] Go to the account settings page
[ ] Hover over the profile photo. You will see that the appearance of the photo changes, a camera icon will appear on top, and a tooltip will appear.
[ ] Click on the profile photo and choose a new picture. This picture will be used to update the user's profile photo.
The currently selected language is automatically added to the Accept-Language header of networking requests
[ ] Change the language to Spanish via the language selector
[ ] Open your browser's Developer Tools and then open the "Network" tab
[ ] If you go to either the "Directory" tab or the Users page via the "Administration" dropdown, you will see that a new request will have been made. Click on the request and then look at the Headers for the request. For the Request Headers of the request, you will see that the "accept-language" header is set to "es".
Description
The React Boilerplate is a foundational web app for the developers of Tech Services.
Timeframe
Kickoff: 11/07/22 Start Testing: 11/07/22 End Testing: 11/18/22 Deployment / Demo Day: N/A
Associated milestone containing Definition of Done
Definition of Done: N/A
Milestone: https://github.com/Shift3/boilerplate-client-react/milestone/8
Associated project board
QA Sprint 9
Sandbox URL/ Testflight App Name
https://boilerplate-client-react.shift3sandbox.com/agents
App Version number(s) to be tested
N/A
Devices / Browsers to be tested
All Browsers
All Devices
Definition of Done
N/A
Acceptance Test
Description
The React Boilerplate is a foundational web app for the developers of Tech Services. This update adds the following features:
Environment
To test the current build of the React Boilerplate, go to https://boilerplate-client-react.shift3sandbox.com/agents and log in with the account(s) that you created in the past.
Credentials
If anyone needs credentials, please have them make a request in the "boilerplate" Slack channel.
Acceptance
Improved Sentry Logging
Note: We aren't using Sentry at the moment. However, whenever there's an error, we show a "Something went wrong." message to the user.
Robust Authentication
Scenario (1) - Internet Issues
Scenario (2) - User receives a forbidden or unauthorized error code
Overhauled Modals
Scenarios that cause a modal to be shown:
Top Navigation Bar + Dropdowns in the Navbar
Overhauled Phone Number Input
Adding Agents
Updating Agents
Notifications Feature
Note: You can't mark individual notifications as read at the moment. Additionally, notifications are live. When an agent is created, all other admins will get a notification pushed to them immediately.
Improved Profile Photo Upload UX
The currently selected language is automatically added to the Accept-Language header of networking requests