hatchways / team-timbits Goto Github PK

Look for areas of visual enhancement in the UI. Animations, loading screens, etc.

Blocked: #19

When time is selected, confirm time and schedule (create appointment BE) 
- Not in mocks, create a dialog for confirmation

- Email
- Name
- Confirm button

* CREATE /meeting -> Create a meeting
* GET /meetings -> list of meetings for logged in user 

Past Appointments (Events)

Also, style and display the event types in the dashboard. Replace the skeleton with the event types.

Integrate user's event type controller

Frontend

- Block off unavailable days
- Preselect the next day 
- Block off time that is unavailable for the user (appointment time slots blocked off state) 
- When time is selected, confirm time and schedule (create appointment BE)

Create Appointment Model

Appointment

- meeting_id
- name 
- email 
- time (datetime) 
- timezone

*https://developers.google.com/calendar/quickstart/js
* https://cloud.google.com/nodejs/getting-started/authenticate-users
* https://dev.to/risafj/beginner-s-guide-to-oauth-understanding-access-tokens-and-authorization-codes-2988

* Create User when authentication is success
* Save access token as session

Create Model for Meeting

Meeting
- user_id
- duration (15, 30, 45) -> these are in minutes

Upgrade your account

Ignore some information from the mocks. Instead have two blocks:
1. FREE STANDARD (this is by default) no need for payment
2. PREMIUM ACCOUNT (payment) -> leads to Stripe checkout page

Make sure to add the appointment to the users Google Calendar.

* CREATE /appointment -> Create an appointment
* meeting_id, name, email, time (datetime), timezone
* GET /appointments -> list of appointments for logged in user

• Adapt the current project skeleton to match project mockups
• The project skeleton will have the general frontend structure of the project, but without the specific components filled out
• If there is a navbar in the mockups, the skeleton should include the navbar + content pages for the app for a logged in user experience
• The navbar should be persistent across the whole logged in user experience and include a placeholder image for the user
• Dropdown for profile in navbar should show two links:
  • logout (already implemented on the backend)
  • go to profile

on Creation of user, create an initial Event Type for a 60 min duration (this is default)

https://sendgrid.com/solutions/email-api/

• Edit the Login and Sign up pages to match your mock up
• Ignore Forget password (we don't need that right now)
• The page is currently responsive, but make sure it works with your mockups

Separate components such as:
- Nav bar
- Main Content

Create a route that:
- Loads availability for given day (GET /availability?day=2342343243)
- Returns a list of available slots

Google Calendar API
- /freeBusy timeMin, timeMax 

Each date you select, it’ll load the appointment slots available

[
{start_time: 2323234, end_time: 234234},
{start_time: 2323234, end_time: 234234},
{start_time: 2323234, end_time: 234234},
...
]

* create two front-end react routers (login and signup)
* There is no landing page - redirect to signup

Blocked by: #8

After the onboarding routes for the backend and onboarding frontend is done, integrate

Blocked by #18

https://stripe.com/docs/api/customers/create

https://stripe.com/docs/payments/checkout/subscriptions

Set up a dev account and use the appropriate API keys set up for the app.

- GET /user/:username -> If this username already exists (onboarding)

- UPDATE /user/:id -> updates user information

There are 3 pages to onboarding

/profile_settings -> unique url and timezone
* check for uniqueness to continue
* storing timezone in UTC
/confirm -> confirmation of successful connect
/availability -> setting availability hours and days

• Optional: Use https://reactour.js.org/ to introduce different parts of the app (Don't overdo it, no more than 3-4 tour bubbles)

• Set up the selected database for the project. The goal for this ticket is that the authentication features included in the starting code will be functional by storing user information in the database.

• use Mongoose

Look for any suitable areas where we might be fetching many things and implement pagination

Create gmail account [email protected]
Create mongodb atlas account
Share credentials in Slack chat
And also the database URI

-Render protected pages conditionally to the user being logged in

• name
• url
• description

Integrate route with frontend component to upload images and return the url

React Dropzone

New dialog that allows you to create a new meeting for a specific duration

• Create a "demo user" functionality that will be used later to allow recruiters and managers to easily test the app's features without having to sign up
• Add a button to allow for signing in as a demo user
• This is effectively a login button with a hardcoded username and password
• Show button both on signup and login pages
• In production you should manually create a user and some test data that would best show off your project. Do this in development right now to test this feature