Create a Hacker Dashboard

[kevinmonisit]

As a hacker/participant, I want to see the information I inputted when signing up (see the user object), modify that information, and see my registration status.

Dashboards Type Roadmap

Hacker: <--- what we are working on Modify OWN user object form Check registration status (from user object form) QR Code (later thing, but will be pretty easy... generating QR based on email I think)

Organizer: See a list of user information from DB Scan QR Code

Director: See a list of users AND be able to write to DB Scan QR code

Specifications:

This is how the user is stored in the MongoDB instance.

    doc = { #event is the JSON passed in with all the parameters.
        "email": u_email, # this field must be here.
        "role": { #we enforce that the user is a hacker.
            "hacker": True,
            "volunteer": False,
            "judge": False,
            "sponsor": False,
            "mentor": False,
            "organizer": False,
            "director": False
        },
        "votes": 0,
        "password": password, #this is mandatory and will always be hashed.
        "github": event.get("github", ''),
        "major": event.get("major", ''),
        "short_answer": event.get("short_answer", ''),
        "shirt_size": event.get("shirt_size", ''),
        "first_name": event.get("first_name", ''),
        "last_name": event.get("last_name", ''),
        "dietary_restrictions": event.get("dietary_restrictions", ''),
        "special_needs": event.get("special_needs", ''),
        "date_of_birth": event.get("date_of_birth", ''),
        "school": event.get("school", "Rutgers University"),
        "grad_year": event.get("grad_year", ''),
        "gender": event.get("gender", ''),
        "registration_status": event.get("registration_status", "waitlist" if not is_not_day_of else "unregistered"),
        "level_of_study": event.get("level_of_study", ""),
        "mlh": mlh, #we know this, depending on how the function is called.
        "day_of":{
            "checkIn": False
        }
    }

Ideally, the dashboard will consume this data by referencing code from data.ts. To begin, the first iteration should just be mock data. That is, when fetching information regarding the user when accessing the database, a hard-coded in-memory instance of the user object is returned.

The dashboard will reflect different states based on the role of the user. Note: No need to style or make things pretty. The dashboard themselves can just be text, such as:

Personal Info of {{user's role}}:
Email: {{user email}}
GitHub: {{github email}}

You can then designate dashboard designs and form components, to yourselves or to other people if you need help. Dashboard should be accessed from localhost:3000/dashboard.

Steps

1. Create a dashboard that displays information (this information is a hard-coded in-memory object)
2. Create a form that allows you to write to this information (please look into actions.ts and use form validation using zod. Examples of form validation via zod are seen in actions.ts.) 2a. Please read https://github.com/HackRU/lcs/wiki/Using-LCS#the-user-object

Points of Interest

https://github.com/HackRU/lcs/wiki/Using-LCS

Diagrams