Skip to content

Frontend Architecture

johnnywhite612 edited this page Apr 14, 2020 · 1 revision

Overall structure of the frontend

Default route '/' (homepage)

This route displays the 'UserSubmissionPage.tsx' component. This component, depending on the page state, will switch between different views.

Initially, the user is shown the 'LoginView.tsx' component. Once they enter their details and click 'Login', the 'VoteView.tsx' component will be shown. This displays a slider, allowing them to state their preference about the temperature. After submitting, the page will show the 'VoteConfirmationView.tsx' component.

Admin route '/admin' (admin dashboard)

This page has 3 main sections:

  1. Top Bar
  2. Side Bar with 2 buttons
  3. Display View

Top Bar

This shows the logo and a 'close' button to return to the vote page.

Side Bar

This section has 2 buttons to switch between the 'notification view' and the 'floor plan view'.

Display View

This shows the view that has been selected in the side bar