kelle-neal / alarmsquad_frontend

Awesome Inc Web Developer Bootcamp React Template

npx create-react-app app --template file:.template

npm install axios jwt-decode

npm install react-dom

alarmsquad_frontend's Issues

Registration Link from Login form is broken

As a user, when clicking on the link at the bottom of the Login form I would like to be directed to the registration page. This is the link "Don't have an account? Register" and register navigates to https://3000-kelleneal-alarmsquadfro-sw7uxmgazln.ws-us96b.gitpod.io/FormRegister.

It appears this is a hard coded link on line 83 of the formLogin.js component. This should be a relative link. https://developer.mozilla.org/en-US/docs/Learn/Common_questions/Web_mechanics/What_is_a_URL#absolute_urls_vs._relative_urls

Navigation links resize

As a user, I would like larger text size and click area on the navigation links at the top of the app.

Login link broken in registration form

As a user, when I click on the link "Already have an account? Login" at the bottom of the registration form found at url '/FormRegister' I am navigated to "https://3000-kelleneal-alarmsquadfro-sw7uxmgazln.ws-us96b.gitpod.io/FormLogin" which does not work.

Dev notes: This link is hard coded on line 53 of the file formRegister.js. This should be a relative url so that React Router can direct to the proper component, like '/FormLogin', instead of pointing to a Gitpod instance port 3000.
https://developer.mozilla.org/en-US/docs/Learn/Common_questions/Web_mechanics/What_is_a_URL#absolute_urls_vs._relative_urls

Uncaught JS error in formLogin.js

On line 31 of formLogin.js, the code does not handle a failed request to the login function gracefully. It will error when the response object does not contain an "access" property. One must catch these errors and then handle them through intentional control flow of your program. I would consider using optional chaining and proper control flow in order to prevent the navigation to '/AlarmList' on a failed login attempt.

Registration button broken

As a user, when I register for the app I would like a user account created so that I can login to the app. The registration button appears to not do anything. I am given no user feedback of action success or error.

Dev notes: Looks like the handleRegister function on line 19 of formRegister.js just prevents default event behavior and makes no calls to AuthService, etc.

Login Failure - user messaging

As a user, when I attempt to login using the form at /FormLogin, I receive no messaging from the app when my login request fails. I only see a failed request in the Network tab of Chrome Dev Tools to know that /token/obtain/ returned a 401 with the message "No active account found with the given credentials". I would be nice to see that message or something like it in the UI.

Form isn't a form

The registration form inputs should be within a form element. This is vital for proper browser behavior regarding assistive technologies and could also lead to odd behavior. Also, idk what cdbreact is but it looks like it is giving all of your input tags the same ID, which throws a warning in the console as id attributes should be unique. https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/id

here is the docs on forms https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form

Readme change from template to AlarmSquad

Change to the Readme to be tailored to AlaramSquad instead of the template would be good, to let someone know what your project is and how someone would install it to use it and contribute to it.