csc302-spring-2021 / proj-dateam Goto Github PK

https://github.com/csc302-spring-2021/proj-DaTeam/blob/main/docs/phase1/vertical.md

Depends on #16

Take the mock data created in the issue linked above and update the express route to return the mock data as JSON.

Acceptance Criteria

Using the openapi docs, I should be able to request that mock data as if I was a frontend client

https://github.com/csc302-spring-2021/proj-DaTeam/blob/main/docs/phase1/collab.md

This renders a list field form node

This component renders a text field form node

This renders a titled section with children nodes rendered inside it

Send an email to the professor to give @umar-ahmed admin permissions on this repository

https://github.com/csc302-spring-2021/proj-DaTeam/blob/main/docs/phase1/test.md

At the moment, we have finalized domain object definitions in shared/ClassDef.ts and created shared/ClassMeta.ts for validation and serialization. However, shared/ClassMeta.ts is incomplete.

Task:

• Create an entry in classMeta for each domain object
• Add in appropriate validator for class fields
• Add in appropriate processor and validator for each textFieldType

This is a core change. No reasonable testing framework can be applied.

Create a folder at docs/phase1 with the following files:

• scope.md: triage the use cases to identify an area of focus for your team.
• arch.md: Slice the app. Describe the main client and server components and identify the middleware you intend to use to build each.
• test.md: Describe the approach you intend to take for testing your implementation.
• api.md: Design the APIs supported by the SDC services.
• model.md: Describe the model object behind your API in one or more UML diagrams.
• vertical.md: Describe your vertical slice
• collab.md: Establish how your team is going to work together. How you will manage your sources. How you will contribute to your sources. When you will meet, how you will communicate, who will scribe, how you will maintain your backlog, etc.

https://q.utoronto.ca/courses/204628/assignments/516249

Set up a GitHub actions workflow to build the frontend and backend packages on every push/pull request open.

Design domain objects that suits the need of the project

• Create UML
• Create Typescript class definition file

https://github.com/csc302-spring-2021/proj-DaTeam/blob/main/docs/phase1/arch.md

Create/update a heroku.yml file and set up a project on Heroku to deploy the frontend and backend containers.

https://devcenter.heroku.com/articles/build-docker-images-heroku-yml

Create database instance that can be used by the application

• Script for creating database instance on dev env
• Initialize database with database schema
• Connect database instance within the application

https://github.com/csc302-spring-2021/proj-DaTeam/blob/main/docs/phase1/release.md

Complete domain object validator that can validate the object structure of any domain objects
This is needed by #51

In order to hit the ground running, we want to have a solid foundation to build off of, and that means setting up:

• Folder structure
• Build tools
• Testing infrastructure
• Lint rules
• Getting started documentation

So far we've agreed on using the following stack:

• Language: Typescript
• DB: Postgres
• DB access: pg-promise
• Deployment unit: Docker image
• Backend framework: Express.js
• CI runner: Github Actions
• Runtime: node.js
• Frontend framework: React
• Frontend UI styling: TailwindCSS

We still need to figure out the following:

• Testing framework (ex. Jest, Mocha, react-testing-library, etc.)
• Build tools (npm? yarn? Nx workspaces?)
• Lint rules / style (Prettier? TS strict mode?, etc.)

Complete domain object JSON serializer that serializes domain objects into pure json object
This is needed by #23

Normally in a env file, a # would denote the start of a comment

NODE_ENV=development # development, production

It turns out some env parsers will treat the #, if placed on the same line as the =, as part of the value.
We need to move all comments to a separate line, and ask everyone to update their .env locally

Extend ClassMeta to include DB schema information
The extended info should remain exclusively in backend
The extended info should contain the exact mapping from fields in typescript objects to columns in the database
It should also contain information of how objects are linked in the database

Create database manager that preforms database CRUD

To Do

• Set up database connection from Node (pg-promise)
• Create an example of running a query against the DB using the connection

Research and create testing framework for backend/ and share/ module
This task may be broken down into multiple pull requests

Before the P1 deadline, we ran into a bug with webpack. Webpack minifies and obfuscates code for production builds, and part of this process is renaming variables, functions, classes to make their names shorter. This is good for bundle size, but it introduced a subtle bug with our model deserialization logic in @dateam/shared.

In particular, we rely on .constructor.name to introspect the class definition.

Solutions

• Re-enable minification, but keep classnames: https://github.com/webpack-contrib/terser-webpack-plugin#terseroptions
• Replace with .constructor === SomeClass or use instanceof
• Replace usage of .constructor.name with static variable on object

class Person {
   static id = "person";
   ...
}

Create a side navigation bar component that links to the following routes:

• /search
• /responses
• /forms

Put it in App.tsx

The frontend teams needs some mock data to get started building out the UI. We'd like the backend team to come up with a sample JSON response object for the GET /form/{formId} endpoint.

Return dummy data

https://github.com/csc302-spring-2021/proj-DaTeam/blob/main/docs/phase1/scope.md

Implement form response validation that takes a SDCForm and a SDCFormResponse and verify that the form response is valid against the given form.

Prerequisite:

• All provided objects are valid
• When submitted, for each SDCQuestion, there must be a corresponding SDCAnswer unless the question is disabled
• If there is no response to the question, the submitter still needs to submit an SDCAnswer, but the responses attribute can be an empty list
• For TextField, the frontend should use textFieldTypeMeta.processor to format the field before calling the validator

Requirements:

• If any prerequisite is not meet, the validator should throw an error
• Otherwise, the validator should return a list of errors identified in the answers
• Validation logic:
  • TextField:
    • Try to parse the field using the corresponding textFieldTypeMeta.parser
    • On error, add the error to the list of errors
  • ListField:
    • Verify all items in the responses are IDs of ListItems of the current list, if not, throw a validation error
    • Verify the number of selections is within maxSelections and minSelections
    • Verify if selectionDeselectsSiblings is true, there is only one selection
    • When selectionDisablesChildren is true, set flag to bypass children validation of that item
    • When an item is not selected, set flag to bypass textResponse validation of that item
• The validator should check the SDCNodes recursively
• When all checks are complete, delete all answers that are not validated

General guideline for error type:

• If the issue is likely caused by a bug in the code, throw ValidationError
• If the issue is likely caused by the user, return AnswerValidationError

Create a database schema (SQL) based on the domain object definition.

• Create database diagram
• Create database schema (SQL)

To Do

• Identify the "objects" in the SDC spec (ex. form, field, section, etc.) and what values they can take on
• Present and discuss your findings with the team at the next team meeting

From the sample JSON structure, we want to render labelled form inputs based on this mockup: https://www.figma.com/file/AkEpl4urre2SXIPiAfKulQ/SDC-Form-App?node-id=25%3A524

https://github.com/csc302-spring-2021/proj-DaTeam/blob/main/docs/phase1/api.md

None of the objects generated by share/MockData has the correct constructor info. Checking obj.constructor always returns Objects, similarly instanceof type checking will also fails

import * as mocks from "./MockData"

let f = mocks.buildFormComplete()
log(f instanceof Model.SDCForm) # expecting true found false
log(f.constructor.name == "SDCForm") # expecting true found false

Implement DataServer
(There already exists a file called DataLoader, rename it to DataServer)

Attribute

Cache: contains a map from UID to any domain object

Functions

genericRead(obj: any, objClass: Function): any

• Check to see if the object is in the cache
• If not, try fetch it from the DatabaseManager and add it to the cache
• Check the class is correct
• No validation is needed, we will assume everything from the DataServer must be valid

genericDelete(obj any, objClass: Function): bool

• Try a read, return false if failed
• Delete the object from the cache
• Delete the object form the database using DatabaseManager

genericCreate(obj any, objClass: Function): Error | null

• Run validator to validate the object
• Return error if validation fails
• Create the object in the database using DatabaseManager
• Load the object into the cache

Hookup

Update all backend controllers to call DataServer if possible
Update will be done with delete then create

Create XML parse

Set up Dockerfiles for frontend and backend, and update docker-compose.yml (local)

https://devcenter.heroku.com/articles/local-development-with-docker-compose

Create express handlers for all the methods that are described in the openapi spec. For example, if we have a method GET /form/{formId}, then create an express handler like:

app.get('/form/:formId', (req, res) => {
  res.sendStatus(501);
});

Acceptance criteria

• Someone should be able to go to the openapi docs site and submit requests to each of the endpoints
• Each of the endpoints should return HTTP 501 Not Implemented

Docker-compose for node and postgres.

Postgres file is in DBInitSQL folder.

https://github.com/csc302-spring-2021/proj-DaTeam/blob/main/docs/phase1/model.md