Skip to content

Worktrolly Developers Documentation

Arjun Dave edited this page Feb 27, 2021 · 2 revisions

Worktrolly – Documentation

This document aims to ease new developers into understanding the current design and flow of the project by outlining the present-day status of the project.

Worktrolly is a Web App, developed to help the firms to solve the problems related to task allocations. Worktrolly helps them allocate the tasks to individuals with all the necessary details of the task written at one place with the date when it was given.

Introduction

This project was generated with Angular CLI version 11.0.4, Node version 10.19.0 and OS version linux x64

The several packages used are- @angular-devkit/architect [version- 0.1100.4]; @angular-devkit/core [version- 11.0.4]; @angular-devkit/schematics [version- 11.0.4]; @schematics/angular [version- 11.0.4]; @schematics/update [version- 0.1100.4]

By using Angular framework in this project, the UI components are divided in order to make their individual update easier and to make the components reusable.

Firebase is used for the backend and database handling tasks. The functionalities like- firebase functions, cloud firestore and firebase hosting, provided by firebase are mainly used in this project.

The creation of the components and the end-to-end functionality, without dependency on other components, follows the architecture flow given below: <architecture flow diagram>

Since each component follows the above flow, they are very flexible to work on.

1. Login Component

The custom Authentication Service created makes use of the available firebase authentication functionality. This service is invoked by the login component at the time of sign in and sign out by the user. The authentication is used from firebase authentication connecting it to google authentication provider.

npm Used:

  • Router

Custom Service Used:

  • AuthService

Component Location:

  • worktrolly-ui/src/app/body/login

2. Create New Session Component

This component is used to create a new task in the Database. It sends a httpsCallable request to the ‘createNewTask’ API in Firebase functions and hence creates a new task in the cloud firestore.

npm Used:

  • Router
  • Firebase Functions

Custom Service Used:

  • ValidationService
  • ToolsService

Component Location:

  • worktrolly-ui/src/app/body/create-new-session

3. Create New Sprint Component

This component creates a new sprint in the database by triggering an httpsCallable request to ‘startNewSprint’ API in Firebase functions.

npm Used:

  • Router
  • Firebase Functions

Custom Interface Used:

  • RawDataInterface

Custom Service Used:

  • ValidationService

Component Location:

  • worktrolly-ui/src/app/body/create-new-sprint

4. Board

The Board component consists of the feature card and the details of the current sprint. The data is retrieved from the database and displayed.

npm Used:

  • Router
  • Firebase Functions

Custom Interface Used:

  • RawDataInterface

Component Location:

  • worktrolly-ui/src/app/body/board

a. Feature Card

The feature card is present on the board. It includes different teams in any organisation, under each of which the list of all the tasks assigned for the respective sprint are available.

Component Location:

  • worktrolly-ui/src/app/body/board/feature-card

b. Sprint Details

Present below the feature card on the dashboard, it consists the information regarding the on-going sprint and even the filter for accessing the other sprints.

npm Used:

  • Router
  • Firebase Functions

Custom Interface Used:

  • RawDataInterface

Component Location:

  • worktrolly-ui/src/app/body/board/sprint-details

c. Focus Nav

Present on the left of the dashboard, it consists the main functions of the dashboard like Active sprint and Backlog.

Custom Service Used:

  • BackEnd Service

Component Location:

  • worktrolly-ui/src/app/body/board/focus-nav

5. My Dashboard

This component displays the list of tasks assigned to the individual for the current sprint. The authorized user’s details are retrieved from the UserInterface and the tasks assigned to them from the database are displayed.

npm Used:

  • Router
  • Firebase Functions

Custom Interface Used:

  • TaskInterface
  • UserInterface

Custom Service Used:

  • AuthService

Component Location:

  • worktrolly-ui/src/app/body/my-dashboard

6. Task Details

The Task details component displays the details of the respective task that the user is viewing. This Component asynchronously captures a snapshot for the changes in the database (cloud firestore) and allows the user to edit the task or log its progress.

npm Used:

  • Router
  • Firebase Functions

Custom Interface Used:

  • TaskInterface

Custom Service Used:

  • AuthService
  • ToolsService

Component Location:

  • worktrolly-ui/src/app/body/task-details

a. Edit Page

This component allows the existing task details to be modified, as it triggers an httpsCallable request to ‘editPageTask’ API in Firebase functions.

npm Used:

  • Router
  • Firebase Functions

Custom Interface Used:

  • TaskInterface

Custom Service Used:

  • ValidationService
  • ToolsService

Component Location:

  • worktrolly-ui/src/app/body/task-details/edit-page

b. Log Work Page

This component allows the assignee of the task to log their progress on the task by sending an httpsCallable request to ‘logWork’ API in Firebase functions.

npm Used:

  • Firebase Functions

Custom Interface Used:

  • TaskInterface

Custom Service Used:

  • ValidationService
  • ToolsService

Component Location:

  • worktrolly-ui/src/app/body/task-details/log-work