Settings page skeleton and /total endpoint

[jessieh9]

Tasks

Your task is to create the settings page skeleton and make the /total endpoint.
This page will allow admin to approve/deny user accounts and edit room rates.

This page should be created in:
/lpa/client/src/components/settings/Settings.jsx
This page should be at the URL:
localhost/settings

---

This task requires you to create the following:

1. Settings page Skeleton

This page should match this rough sketch.

Creating Approve User Table

• Create the approve users table
  • This table should list all users in the DB who have edit_perms = False
  • If approve is clicked, set edit_perms = True and update the rendering of the table
  • If remove is clicked, delete the user from the database
    • You also need to delete the user from the Firebase, which handles authentication. To do this, call the /users/:firebaseUID endpoint using DELETE
  • Ignore the "make admin" part for now. No need to invlude this

Creating Edit Room Rate Table

• Create the Edit Room Rate table that lists all the rooms and enables admin to edit the room
  • Make a call to DB to list all the rooms
  • Create an Edit room rate modal that updates room rate by taking input and then updating the respective room rate in the DB

2. Create /total endpoint

Find the /total endpoint in routes/invoices.js
Modify it to do the following:
When supplied with an :id, which is the id of an invoice

• First, get the event associated with the invoice
• Grab all comments where:
• (adjustment_type = rate_flat OR rate_percent) AND booking_id = NULL
• Make a list of these adjustments in a way that you can reference later, for example
  • [+20, -10, +20%, -5%]
• Grab all bookings for the event WHICH fall in the dates of the invoice
• For each of these bookings, do the following
• Grab the room and room rate for the booking
• FIRST, apply the adjustments from earlier to the rate
• THEN, query the comments again to find comments where:
• (adjustment_type = rate_flat OR rate_percent) AND booking_id = THIS BOOKING)
• THEN, apply these more specific adjustments in order to the rate
• FINALLY, do booking cost = rate * booking duration
• Do this for all bookings, getting a total cost of all bookings on the event for this period, then add this together
• Finally, grab all comments where:
• adjustment_type = total
• Add the values, either positive or negative, to the total from the bookings
• Return this value in the SAME FORMAT as the /total endpoint had

To test this, go to /invoices/:id and make sure the total calculation is accurate.

More info on calculating the total

So what are all of the adjustment_types?

• total
  • Applied to the entire invoice
  • Increases or decreases the total cost of the entire invoice
  • Use: adding $20 off or charging $5 for cleaning fees
• rate_flat
  • Applied to EITHER a booking, OR the invoice itself
  • If applied to a booking, it is still tied to the invoice, but only applied to the booking
  • Increases or decreases the flat rate of the room associated with EITHER the booking or all bookings of the invoice
  • Use: giving the payee $10 off the room rate for the month or giving them $5 off for one booking because the room was dirty
• rate_percent
  • Same as rate_flat, but applies a percent value to the original room rate
• paid ( not used here )
  • Increases or decreases how much was paid by the payee for this invoice

---

Important

When getting data from the DB, always do the following:

1. Check: Is there already a DB endpoint which gives me ALL of the data I need, without having to modify it in JS?
2. Add: A new endpoint that uses SQL to get all relevant data on the backend. For example, you might create a new endpoint to get all payees for an event, instead of getting all clients and filtering them locally
3. Finally: Use JS to filter results if the above two options wont work

ALSO: If possible, dont make calls which get you duplicate data. If one call to the DB gets you all program data, keep using that data rather than making another query.
Why? It is faster to query data in SQL than it is to filter it in JS on the client side.

Note

This is a relatively medium sized task. Please start early and ask any questions that come up as soon as possible.

---

Resources

• Use the Chakra Table component
• Use other Chakra components when possible

Deliverables (please check off as you go!):

• Settings page skeleton completed
  • Tested on approving users
  • Tested on editing room rates and changes show in DB
• /total endpoint