se701team2 / updog Goto Github PK

Is your feature request related to a problem? Please describe.
Proposed feature to add a pre-commit check for code linting using Husky and lint-staged

Describe the solution you'd like
Integrating Husky and lint-staged into the repo's workflow to automate verification of code linting

Describe alternatives you've considered
No alternatives have been considered currently

Additional context

Describe the bug
The YAML at the top of the PR template shows up when you make a new PR. I believe front yaml is only supported for issues.

To Reproduce
Create a new PR, you will see this at the top

name: Pull request
about: Creating a pull request for other contributors to review
title: ''
labels: ''
assignees: ''

Is your feature request related to a problem? Please describe.

This is a front end component, please refer to the Figma on the wiki for the current design. If there is no design, feel free to add your own to fit the criteria.

We need a page where the user can see posts from their followers and make new posts themselves. The page should be at the route “/feed” (until auth router is added, then it will be at /)

Describe the solution you'd like
The feed needs:

• A MainHeader and Footer
• A list of post components (each in condensed view with no replies shown)
• A way to start writing a new post (could be a button or a text input at the top or bottom). Clicking this component should open a PostComposer component as a modal (on mobile, the modal should cover the whole screen)

Inside the post composer:

• A text area with the placeholder text “What’s Updog?”
• A cancel button and a post button at the bottom or top

In the future, if a user tries to visit /feed without being logged in they will be sent to the landing page.

The post composer component may be used elsewhere so make sure it is reusable. The functionality for sending the post to the backend does not need to be made yet.

Here is some sample mock data for 3 feed posts:

const sampleFeed = [
    {
        id: 1,
        content: "Post 1",
        author: {
            id: 1,
            username: "poster1",
            nickname: "Poster 1",
            profilePic: "https://i.imgur.com/qZImY9j.jpg",
        },
        parent: null,
        children: [5],
        usersLiked: 1,
        usersShared: 2,
        timestamp: 1646627469012
    }, 
    {
        id: 2,
        content: "Post 2",
        author: {
            id: 2,
            username: "poster2",
            nickname: "Poster 2",
            profilePic: "https://i.imgur.com/PiJAoqO.jpeg",
        },
        parent: null,
        children: [],
        usersLiked: 50,
        usersShared: 33,
        timestamp: 1646627527764
    },
    {
        id: 3,
        content: "Post 3",
        author: {
            id: 1,
            username: "poster1",
            nickname: "Poster 1",
            profilePic: "https://i.imgur.com/qZImY9j.jpg",
        },
        parent: null,
        children: [],
        usersLiked: 10,
        usersShared: 20,
        timestamp: 1646627527764
    },
]

export default sampleFeed

Describe alternatives you've considered
N/A

Additional context
N/A

Is your feature request related to a problem? Please describe.
We do not have any tools to enforce code style and formatting.

Describe the solution you'd like
We should integrate ESLint and Prettier into our workflow.

Describe alternatives you've considered
Other linters etc. exist but some members of the group have experience with ESLint and Prettier, so they are the best solution for us.

Additional context
N/A

Is your feature request related to a problem? Please describe.
We do not have an established place for developers to put their tests.

Describe the solution you'd like
We should add basic testing functionality so that developers can test their contributions, and the testing should be integrated into our CI/CD pipeline.

Describe alternatives you've considered
N/A

Additional context
N/A

Is your feature request related to a problem? Please describe.
Currently our post model needs some tweaking, also we don't have a DTO class to filter the post object before sending it back to FE (FE needs the response body in a specific way)

Describe the solution you'd like
-Edit model/posts.js and migrations/create-posts.js to match the following:

Post

• id
• content (string)
• author (userID)
• parent (ID of parent post)
• children (array of post IDs)
• usersLiked (array of IDs of users who likes the post)
• usersShared (array of IDs users who shared the post)
• timestamp (unix timestamp indicating timestamp of creation)
• Attachments (String array, consisting of links to attachments in Firebase db)

-- Create a DTO class to tweak the object before sending it to FE, and implement it in endpoints that return Post objects so that they return the DTO you created (class could be in a directory called dto/posts.js)

• Since there are tests already in place for the endpoints, you just need to tweak the existing tests to check that the response matches the DTO you implemented, no new tests need to be implemented

Is your feature request related to a problem? Please describe.
We do not have a pipeline to conduct automated testing of our webapp.

Describe the solution you'd like
A GitHub Action should be set up to run our test suite when a pull request is created or updated.

Describe alternatives you've considered
N/A

Additional context
Blocked by #10 and #5

Describe the bug
Github does not allow workflows triggered on PRs from forked repos to access secrets.

To Reproduce
Steps to reproduce the behavior:

1. Use secrets in your workflow file for testing the backend DB

Expected behavior
Error saying at least one superuser is required

Screenshots

Desktop (please complete the following information):

• OS: Windows 10

Additional context
N/A

Is your feature request related to a problem? Please describe.

This is a front end component, please refer to the Figma on the wiki for the current design. If there is no design, feel free to add your own to fit the criteria.

(This is WIP, so we haven't decided on the full details yet)

The user should be able search some term and see the results for every user and post that matches

Describe the solution you'd like

• A search bar (possibly as a text input inside a CustomizableHeader component)
• Bottom navigation footer
• User results and post results should be separated into tabs
• User results can be SimpleUserDetails
• Post results can be condensed Posts with no replies shown

Describe alternatives you've considered
N/A

Additional context
N/A

Is your feature request related to a problem? Please describe.

This is a front end component, please refer to the Figma on the wiki for the current design. If there is no design, feel free to add your own to fit the criteria.

We need a page where users can sign up for the app and one where they can sign in. These are grouped together in this issue because they are very similar. The pages should be at the routes “/signUp” and “/signIn”.

Describe the solution you'd like
The sign-up page needs:

• A form containing a username, email, and password and sign up button
• Form validation (check email regex, and if username and password are shown)

The sign-in page needs:

• A form containing an email and password and sign in button
• Form validation (make sure both have some text)

Functionality for auth is not needed until the backend for auth is done

Describe alternatives you've considered
N/A

Additional context
N/A

Is your feature request related to a problem? Please describe.

This is a front end component, please refer to the Figma on the wiki for the current design. If there is no design, feel free to add your own to fit the criteria.

We need a main header component showing the apps logo and user profile picture.

Describe the solution you'd like

• Has the app logo and the user profile picture
• Will (likely) be used on these pages: dashboard/feed, notifications
• Does not take the user as a prop, it will get the current user details via the API (mock data for now)
• Tapping the app icon should take the user to their feed ("/feed")
• Tapping the user profile picture should take them to their profile ("/user/:username")

This header will only be visible on pages where the user has logged in (if a user tries to access one of these pages and isn't authenticated, they will be kicked back to the landing page where there is no header).

Should share the same theme and height as the customizable header component

If you need user mock data you can use this (you should only need the username and profile pic):

// mock-data.js
export const userData = {
  username: "testuser",
  profilePic: "https://i.imgur.com/PiJAoqO.jpeg"
}

Describe alternatives you've considered
N/A

Additional context
N/A

Is your feature request related to a problem? Please describe.
We need front end boilerplate before we get started on development.

Describe the solution you'd like
So far in discussions, we have decided on using:

• React
• Javascript
• Material UI

We will also need a routing solution, probably just react-router.
We should setup the front end to a workable directory structure, for example:

• src
  • components
  • pages
  • styles
  • hooks
    (more complexity can be added)

And also:

• Frontend Readme
• Contribution guidelines
• .gitignore

Describe the bug
Test case "test/posts.test.js" is failing.
Test Suites: 1 failed, 1 total
Tests: 2 failed, 11 passed, 13 total

To Reproduce
Steps to reproduce the behavior:

1. Go into backend folder and run "npm test test/posts.test.js"
2. See error

Expected behavior
Should pass all test.
(to be specific, should return the correct response code)

Screenshots

Desktop (please complete the following information):

• OS: MacOS
• Browser : terminal/command line
• Version [e.g. 22]

Smartphone (please complete the following information):

• Device: [e.g. iPhone6]
• OS: [e.g. iOS8.1]
• Browser [e.g. stock browser, safari]
• Version [e.g. 22]

Additional context
Add any other context about the problem here.

Is your feature request related to a problem? Please describe.
We should add a issue template to make it easier to format tickets. There should be one for issues and bug reports

Describe the solution you'd like
Add issue template files to the repo

Describe alternatives you've considered
N/A

Additional context

Is your feature request related to a problem? Please describe.
Currently, it will be pretty unclear to devs how they can add pages or components to our application. By adding a (mostly) fully implemented post page (minus business logic and theme), a dev will be able to reference the component structure, styles, and conventions used when making their own components.

Describe the solution you'd like
Add a sample page: /post/:id which will use mock data to display a post and its replies, along with a sample header and footer.

Describe alternatives you've considered
N/A

Additional context
N/A

Currently blocked by #14 as authentication would need to be applied to the existing endpoints

Is your feature request related to a problem? Please describe.
Currently, the boilerplate contains endpoints for adding users and getting users by ID. However, the controllers for these endpoints are incomplete and do not have tests. We also need to check if we forgot to remove any unneeded code or dependencies.

Describe the solution you'd like

• Tweak the controller functions for the users (Add extra error handling, check for duplicates in the db before adding a new user, etc...)
• Delete the getUsers endpoint and related functions, we won't be needing to list all users
• Add tests for those endpoints
• Check for any unused code or dependencies

Describe the bug
When a change is made to a markdown file and is trying to be committed, eslint throws a parsing error for no reason.

To Reproduce
Steps to reproduce the behavior:

1. Make a change in readme.md
2. git add and commit

Expected behavior

Expected behaviour is the md file passing through eslint

Screenshots

Desktop (please complete the following information):

• OS: Windows

Is your feature request related to a problem? Please describe.

This is a front end component, please refer to the Figma on the wiki for the current design. If there is no design, feel free to add your own to fit the criteria.

We need a page where the user can change their profile details. The route can be “/settings”

Describe the solution you'd like

• A header (see: customizable header component) with the page title: User Settings
• (The header also needs a save button passed in)
• Their profile banner and picture (clicking on them should open a dialog to select a file)
• Their username, nickname and bio (with some way to change them with a text input)

There is an example for adding a button as a child of customizable header on the issue #40

Here is mock data for a user if needed

// mock-data.js
const sampleUser = {
    id: 1,
    username: "username",
    nickname: "nickname",
    profileBanner: "https://i.imgur.com/PcEvuMw.png",
    profilePic: "https://i.imgur.com/qZImY9j.jpg",
    followers: 11,
    following: 22,
    joinedDate: 1646627469012
}

export default sampleUser

Describe alternatives you've considered
N/A

Additional context
N/A

Is your feature request related to a problem? Please describe.
Our models are still incomplete

Describe the solution you'd like

• Edit the models in the models directory
• Edit the files in the database migrations folder so the tables can be updated (Don't forget to execute the commands for migrating the db again, can be found in the backend README)
• Modify endpoints that output user objects so they are converted to a suitable response body (Maybe a DTO class that only includes the relevant information?) first before sending the response

-Model and db migrations should match this:

User

• id
• email (needs to be unique)
• password
• username (eg. @name_, needs to be unique)
• nickname
• profilePic (stored as a link)
• profileBanner (stored as a link)
• Bio
• followers (Array of Follower IDs)
• following (Array of IDs of people the user follows)
• posts (posts that are exclusively posted by that user, includes comments)
• likes (Array of post IDs liked)
• shares (Array IDs of shared posts)
• joinedDate (unix timestamp)

-- DTO class should match this:

Is your feature request related to a problem? Please describe.

This is a front end component, please refer to the Figma on the wiki for the current design. If there is no design, feel free to add your own to fit the criteria.

We need a landing page so that people can see what the app is about and then sign in or sign up. The page should be at the route “/”.

Describe the solution you'd like

• Sign up link (should be focus of the page)
• Sign in link
• Some hero text
• Probably no footer or header

Describe alternatives you've considered
N/A

Additional context
N/A

Is your feature request related to a problem? Please describe.
Now that we have finalised the user and post models, we need to implement an endpoint for retrieving user activity

Describe the solution you'd like

• Create an enum called activity, should either be LIKED, SHARED, or POSTED
• implement endpoint GET /users/:username/activity, endpoint should return the following array output:

[
           {
                      "postID": 1,
                      "timestamp": 1646627469012,
                      "activity": SHARED
            },
            {
                       ...
            }
 ]

• Since endpoints for liking and sharing have not been implemented yet, testing should be done using models.[model_name].create() or models.[model_name].delete() or by editing the db directly for manual testing

Is your feature request related to a problem? Please describe.

This is a front end component, please refer to the Figma on the wiki for the current design. If there is no design, feel free to add your own to fit the criteria.

We need a customizable header component to use at the top of pages where a back button is needed and where we can't assume that a user is logged in while viewing (e.g. profile and search pages)

Describe the solution you'd like
A customizable navigation header:

• Has a back button and the name of the current page
• The back button should take the user back one step in their history but only if that would take them to another updog page. Otherwise, it should take them to /
• Will (likely) be used on these pages: post, follower list, edit profile, profile, search
• Takes a title prop to display the page name

Should share the same theme and height as the main header component

Some pages will also need some action on the right, e.g. user settings need a save button. You should accept an optional “children” prop it should be rendered on the right side of the header

So the full props should be ({ title, children = null }). Any dev who needs a custom component there will have to pass it in like this:

// UserSettingsView.jsx
<CustomizableHeaderController title=”User Settings”>
    <button onClick={doSomething}>Save</button> // this is a child of the element, so it is implicitly passed into the children prop of the customizable header component
</CustomizableHeaderController>

Describe alternatives you've considered
N/A

Additional context
N/A

Is your feature request related to a problem? Please describe.
Currently, POST /users returns a userDTO object, we would like it to return an authToken instead

Describe the solution you'd like
Modify the addUser function to generate an auth token using authentication.js and return the auth token if creation was successful instead of the userDTO

Is your feature request related to a problem? Please describe.
We created a table for shared posts, we just need to implement endpoints for sharing posts

Describe the solution you'd like
Implement two endpoints: POST /posts/:id/share for sharing a post (does not require a body) and DELETE /posts/:id/share for deleting a shared post. Those endpoints should automatically add/remove entries from the shared-posts table

• Don't forget to add authentication for these endpoints
• Write tests for the new endpoints that are implemented

Is your feature request related to a problem? Please describe.
Common API requests will be repeated throughout the codebase, so we can add some utility functions for convenience.

Describe the solution you'd like
Add helper functions for post, get and patch which handle authentication

Is your feature request related to a problem? Please describe.

This is a front end component, please refer to the Figma on the wiki for the current design. If there is no design, feel free to add your own to fit the criteria.

We need a page where a user can see all the interactions people have had with their posts

Describe the solution you'd like

• A MainHeader and Footer
• A list of notifications

There are 3 types of notifications:

"like"

• Should show that 1 person liked your post. Clicking on it should take you to the /post/:id page
• If there are multiple like notifications in a row for one post, then it should be combined one: X people liked your post

"share"

• Same functionality as likes (with the stacking) except it should say share

"reply"

• Should say "You have received a reply to your post" and then show the content

If you have other ideas for these notifications e.g. showing user name or profile pic you should talk to the backend team to add more data to the response body.

You can use the following data as a mock:

const sampleNotifications = [
    {
        type: "reply", // possible = like, share, reply
        from: 2, // user who interacted with the post
        post: 1, // post that was interacted on
        timestamp: 1646627469012, // unix timestamp when the interaction happened
        content: "cool" // if type reply, this will be the content of the reply, else null
    },
    {
        type: "share",
        from: 2,
        post: 1,
        timestamp: 1646627527764,
        content: null
    },
    {
        type: "like",
        from: 2,
        post: 1,
        timestamp: 1646627527764,
        content: null
    },
    {
        type: "like",
        from: 3,
        post: 1,
        timestamp: 1646627527764,
        content: null
    }
]

export default sampleNotifications

Describe alternatives you've considered
N/A

Additional context
N/A

Is your feature request related to a problem? Please describe.
Once we have decided on a colour palette and font to use on the front end, these colours should be added to a centralized style file so that they can be imported into any style sheet. This should ensure consistent colouring on all components and will also make it easy to change theme in the future.

Describe the solution you'd like
Example file using default Material UI colours:

Example usage:

Describe alternatives you've considered
N/A

Additional context
N/A

Is your feature request related to a problem? Please describe.
The quick-start guides of the readmes in the frontend and backend folders lack detail and are outdated.

Describe the solution you'd like
The readme.md files in both frontend and backend folders should be rewritten such that someone totally new to the project would be able to clone and run the project on their personal computer.

Describe alternatives you've considered
N/A

Additional context
N/A

Is your feature request related to a problem? Please describe.
We want posts to be able to include attachments, such as photos and videos

Describe the solution you'd like

• Configure firebase DB and add the config to our codebase
• Add attachments as a field in the Post model.
• Add attachments field to Migrations/create-posts.js so the field would be added to the Post table in the DB
• If devs need to run the firebase DB locally, please update the README with instructions

Tests need to implemented as a part of this ticket

Is your feature request related to a problem? Please describe.
We need authentication for almost all of our endpoints.

Describe the solution you'd like
A directory called Middlewares should be created, and in that directory, authentication.js should be created.
The file should contain two main functionalities:

• Generating an Auth Token from a user object
• Extracting a user object from an Auth token

Afterwards, unit tests should be implemented in the test folder for this new functionality

Is your feature request related to a problem? Please describe.
Currently, the user class accepts any type of string as email

Describe the solution you'd like

• Create a method that checks the user email field to see if the email is in the correct format
• The method should also check if it's a real email

Unit tests need to be implemented to test this functionality

Is your feature request related to a problem? Please describe.
We do not currently have Contribution Guidelines, a Code of Conduct, or a framework for creating further documentation as the project advances.

Describe the solution you'd like
Contribution guidelines, a code of conduct, a readme, and an informative wiki homepage should be created.

Describe alternatives you've considered
N/A

Additional context
Contribution Guidelines and Code of Conduct should match and extend the requirements given in the assignment specification.

Is your feature request related to a problem? Please describe.
The /users/authenticate endpoint is implemented, but we still need to call the password validation method implemented in #25 and tweak a few things

Describe the solution you'd like
The endpoint should have the following logic:

• Retrieve user from DB using the email field in the request body
• Validate the password of the user object you just retrieved from the DB against the password in the request body using the method implemented in #25
• If method returns true, then send a response of 200 with the generated auth token as resp body
• If password is invalid return 401 (unauthorized) as the response status code
• Assume request body will be like this:

{
"email": "[email protected]",
"password": "password"
}

Is your feature request related to a problem? Please describe.
Currently we do not have endpoints for liking or unliking posts

Describe the solution you'd like

• Implement two endpoints: POST /posts/:id/like for liking a post (does not require a body) and DELETE /posts/:id/like for unliking a post. Those endpoints should automatically add/remove entries from the liked-posts table

Add tests for the two endpoints

Is your feature request related to a problem? Please describe.
We don't have endpoints for editing or deleting a user

Describe the solution you'd like
-Create two endpoints: PUT /users/:username (Some fields can't be edited, eg. joinedDate, followers, followed users, etc..) and DELETE /users/:username

• Ensure authentication for these endpoints, users can edit/delete their own accounts only
• In Authentication.extractUser(), we need to add a line to ensure the user encoded in the auth token is still in the DB, otherwise an error needs to be thrown and a status code of 401 needs to be returned, this is so that if the user is deleted they can't be authorized to call our endpoints anymore

Is your feature request related to a problem? Please describe.
Currently, the backend's test folder is named test, a name that isn't detected by Jest as a default location for tests (which necessitates including "test" in the filenames of the files within it). It also differs from the frontend section's test folder, which is already named __tests__

Describe the solution you'd like
We should rename the backend test folder to tests to match frontend and the Jest standard.

Describe alternatives you've considered
N/A

Additional context
N/A

Is your feature request related to a problem? Please describe.

This is a front end component, please refer to the Figma on the wiki for the current design. If there is no design, feel free to add your own to fit the criteria.

We need a user page to show a user’s details and post history. The page should be at the route “/user/:username”

Describe the solution you'd like

• Details section and a history section
• A MainHeader and Footer

User details section:

• Profile picture image
• Profile banner image
• Following/follower count (should also be a link to the user’s follower details page)
• Username, nickname, bio
• User joined date formatted to “Month YYYY”
• A follow button if they are a different user, or a settings button if the current logged in user is browsing their own profile.

User history section:

• A list of post components (each in condensed view with no replies shown)

Here is some mock data for a user and a feed

// mock-data.js
export const sampleUser = {
    id: 1,
    username: "username",
    nickname: "nickname",
    bio: "a biography", 
    profileBanner: "https://i.imgur.com/PcEvuMw.png",
    profilePic: "https://i.imgur.com/qZImY9j.jpg",
    followers: 11,
    following: 22,
    joinedDate: 1646627469012
}

export const sampleFeed = [
    {
        id: 1,
        content: "Post 1",
        author: sampleUser,
        parent: null,
        children: [5],
        usersLiked: 1,
        usersShared: 2,
        timestamp: 1646627469012
    }, 
    {
        id: 2,
        content: "Post 2",
        author: sampleUser,
        parent: null,
        children: [],
        usersLiked: 50,
        usersShared: 33,
        timestamp: 1646627527764
    },
    {
        id: 3,
        content: "Post 3",
        author: sampleUser,
        parent: null,
        children: [],
        usersLiked: 10,
        usersShared: 20,
        timestamp: 1646627527764
    },
]

Describe alternatives you've considered
N/A

Additional context
N/A

Is your feature request related to a problem? Please describe.

This is a front end component, please refer to the Figma on the wiki for the current design. If there is no design, feel free to add your own to fit the criteria.

We need a footer that has navigation controls so a user can get to each of our main pages

Describe the solution you'd like
The footer needs:

• To share the same height and theme as the main app header
• Navigation buttons for: home, search, notifications (should be a component containing a fitting material ui icon)

Describe alternatives you've considered
N/A

Additional context
N/A

Is your feature request related to a problem? Please describe.
We need to implement CRUD endpoints for the posts

Describe the solution you'd like
Endpoints that should be implemented:
POST /posts/:id For creating a new post
GET /posts/:id For retrieving a particular post
PUT /posts/:id For editing a post
DELETE /posts/:id For deleting a post

No need to set up authentication for now as it is being set up in a separate ticket. Unit tests also need to be implemented

Is your feature request related to a problem? Please describe.
We need backend boilerplate.

Describe the solution you'd like
So far in discussions, we have decided on using:

• ExpressJS
• SQL for our DB

The directory structure should be the following:

• src
  - config (includes db & orm config and openAPI spec (openAPI can be implemented later))
  - controllers
  - middlewares
  - models
  - routes
  - test
  - app.js

Ideally the two main models (user and posts) should be implemented when implementing the boilerplate so we can delegate tasks as soon as we can

Basic template for PR's for contributors to check basic requirements have been met

Is your feature request related to a problem? Please describe.

This is a front end component, please refer to the Figma on the wiki for the current design. If there is no design, feel free to add your own to fit the criteria.

We need a page where you can see the list of people a person follows and their followers. This can be a public route at /user/:username/follows

Describe the solution you'd like

• A header (use customizable header component) with the title Follows List
• The navigation footer
• Some way to toggle between followers and following
• A list of the followers/following (you should probably use the SimpleUserDetails component in condensed mode)

You can use this mock data (for both follows and followers, unless you make your own separate data for that)

const follows = [
    {
        id: 1,
        username: 'follow1',
        nickname: 'Follow 1',
        profilePic: 'https://i.imgur.com/qZImY9j.jpg',
    },
    {
        id: 2,
        username: 'follow2',
        nickname: 'Follow 2',
        profilePic: 'https://i.imgur.com/PiJAoqO.jpeg',
    }
]

export default follows

Describe alternatives you've considered
N/A

Additional context
N/A

Is your feature request related to a problem? Please describe.
We don't have an explicit coding style guide.

Describe the solution you'd like
The stub style section at the bottom of CONTRIBUTING.md should be expanded, and possibly put into its own document.

Describe alternatives you've considered
N/A

Additional context
Partially blocked by #12 as linter and formatter rules need to be finalised.

Is your feature request related to a problem? Please describe.
Currently we do not have a follow feature implemented. It should enable an authenticated user to follow or unfollow another user.

Describe the solution you'd like

• Implement two endpoints: POST /users/:username/follow for following (does not require a body) and DELETE /users/:username/follow for unfollowing
• Both endpoints should affect one row in the followers table, which maps the ids of both users
• Add tests for the two endpoints

Is your feature request related to a problem? Please describe.
We do not have a method of generating API documentation. This would be useful for future groups to understand our API design and to be able to test it

Describe the solution you'd like
Investigate a way to automatically generate an API documentation from our codebase

Is your feature request related to a problem? Please describe.
Right now, posts are only fetched by the post object using an id passed in. We need an option to pass in a post object which will be rendered

Describe the solution you'd like
Change the post props from { id } to { id = 0, post = null }

Describe alternatives you've considered
N/A

Additional context
N/A

Is your feature request related to a problem? Please describe.
To let people know how to contribute, we should add/change the following files:

• README.md: add description, quick start guide, license info, links to contributing/code of conduct guidelines
• CONTRIBUTING.md: guideline for how to run the project and how to contribute code (wont be able to add this until we have the backend and frontend setup and know how to run them)
• CODE_OF_CONDUCT.md: can copy a popular one like https://github.com/auth0/open-source-template/blob/master/CODE-OF-CONDUCT.md

Is your feature request related to a problem? Please describe.

Currently the footer and headers are using the secondary colour as a background because MUI was being a pain. We should change these to use the primary as a base.

Describe the solution you'd like
The background colour should be primary, the active icon should be secondary, and the inactive icon should be white.

Describe alternatives you've considered
N/A

Additional context
N/A

Is your feature request related to a problem? Please describe.
Currently, the user model does not have a password field

Describe the solution you'd like

• Add field for password in the Model/user.js
• Add password fields in Migrations/create-user.js so this new field can be migrated to the db
• Add Password encryption/decryption functionality

Unit tests should be implemented as part of the ticket

Describe the bug
Some user fields require a value when they should not be required, this is causing test failures

To Reproduce
Run tests in users.test.js

Expected behavior
existing tests should pass and if there are any fields that are required, those tests should be modified to adapt to new changes