Skip to content

BB-2028: Add new user console

This PR lays the groundwork for the new Ocim frontend. It implements login, logout and a few calls to the backend to showcase the design.

The focus of this PR is on the frontend design implementation, so reducers, actions and other components that handle data are not fully implemented.

Testing instructions:

  1. Review the contents of the auth and console folders. Most of the implementation is contained there.
  2. Run the new frontend with npm run start and go to http://localhost:3000/.
  3. Switch between the registration and login pages using the links in the header menu. There are a few known issues with the header styling that are not in the scope of this task, please ignore them for now.
  4. Try to access the console page without being authenticated: http://localhost:3000/console
  5. Go to the login page (http://localhost:3000/login) and click on Login, you should see a error message.
  6. Try logging in with incorrect credentials.
  7. Login with an existing account.
  8. Check that the header now shows the console menu, compare it to the mockups.
  9. Check that the multiple page elements are looking like the mockups (with the exception of the redeployment toolbar, that is going to be fully implemented on a follow up task).
  10. Open a text editor and toggle the loading state values from the following files:
src/console/components/ConsolePage/ConsolePage.tsx
src/console/components/InstanceSettings/InstanceSettings.tsx

You should see the spinner when the page is loading and the correctly rendered page. 11. Check that the changes match the mockups to a good extent.

Reviewier:

Notes: There's still quite a few things to be improved:

  1. Header styling.
  2. Refresh token workflow (now handled by the PrivateRoute, but should be moved to the API client middleware).

Merge request reports