Register
Submit a solution
The challenge is finished.

Challenge Overview

Basic requirements for this challenge:
  • Update existing frontend for new Costs page based on completed UI Prototype
  • Linking with updated Backend for Costs page
  • Need remain support responsive on Desktop and Tablet view

Technology Stack
  • Angular for frontend
  • .Net Core API for backend framework
  • Database: MS SQL Server

Deployment environment requirements
  • localhost
  • AWS EC2

Challenge Overview

Application Background
Our organization is structured by Value Streams after the SAFe industry model. A Value Stream represents an organizational sleeve that has a specific business focus with dedicated resources. For example, in our Insurance business we have multiple value streams such as Product, Inforce Operations, Marketing and Distribution etc. These values streams have roadmaps with target strategies and KPIs (Key Performance Indicators) they’re accountable to deliver on. The roadmaps are a rolling 4-6 Quarters of incremental outcomes representing the delivery of some type of business value. These outcomes ultimately achieve the strategy as measured by these KPIs.

We are looking for a solution to manage these roadmaps. This solution would be for a data entry UI , database repository, that will enable future Power BI data visualizations. This solution will enable multiple personas to access and input roadmap data and demonstrate how a Value Stream is achieving its strategy as measured by KPIs and delivery of incremental outcomes. Eventually, a simple integration between the UI and JH’s Backlog Management Tool (Rally) will be used to synch a few fields. This solution should enable an export of data that can be easily uploaded to a data visualization tool.

Problem
The primary goals for this UI and Database is to get users out of using excel spreadsheets and establish consistency in data being tracked across the division. Additionally, this solution will enable Value Streams to extract data in a format that’s indigestible by a Data Visualization tool reducing time spent creating manual PowerPoint presentations to demonstrate how strategy is progressing. Benefits are as follows:
  • Improved user experience tracking roadmap outcomes, KPIs and strategy progression.
  • Good usability and efficiency for entering data.
  • Consistency of roadmap data being tracked across all Value Streams in the U.S. Division with one source of truth.
  • Ability to easily export data and upload into a visualization tool enabling multiple personas to generate various data views.
Challenge Assets:
General Requirements
  • Grab the updated Costs page from UI prototype link mentioned above.
  • For this challenge you need linking frontend with backend for Costs page
  • Backend built using .Net Core API and Angular for the frontend. Use best practice solution to connect frontend and backend.
  • We need to make sure unit testing support 90% code coverage and need to be as part of the build command to make sure the app not have any bugs
  • DO NOT display static data or load from JSON files. All required sections on this challenge need pull data from REST API. You can return 0 or NULL if no data on the endpoints
  • Check the complete endpoints based on Postman collection and configuration mentioned above
  • Your submission must remain using responsive solution on Desktop and Tablet screen size from existing prototype
  • Test and check your submissions on all required browsers

Individual Requirements

1). Issues from previous challenge:
  • Unit testing must updated for the latest frontend app
    • Do `npm run testbuild`
    • Fix all unit testing errors to follow the latest frontend implementation
    • Make sure unit testing running with no error after you do updates from this challenge
  • Validation of fields is not done
    • Should not able to move to the next step before user filled created Initiative
    • Fix for Create new Roadmap and Edit Roadmap
  • Filter need return correct data after filtered
    • Fix for Dashboard and Roadmap details / edit page
  • In Edit mode, the Strategy Level Theme tab isn't functional
    • Need follow the same layout/functionalities like another page
  • Print layout needs to be enhanced to follow new layout
    • Match the updated content
    • Fix for Dashboard and Roadmap details
  • Show correct active state for Collapse All & Expand All
    • Fix for Edit and Roadmap details page
  • Export Roadmap need render correct files
    • Check the updated endpoint for XLS and CSV format
    • Fix for Dashboard and Roadmap details page

2). Dashboard
UI Prototype Demo: https://jh-vsroadmap-expansion.herokuapp.com/dashboard
  • Costs button will linking to Costs page
  • Grab the updated Costs pages from UI prototype link mentioned above.

3). Admin Data Management
UI Prototype Demo: https://jh-vsroadmap-expansion.herokuapp.com/costs-page/admin-data-management
  • Admin Data Management is default tab of Costs page
  • Current backend able to create or update array of data from single endpoint when user click Submit button on the bottom of this page.
  • Check Postman collection for all available endpoints.
  • Resource Type dropdown need pull list from this endpoint
    • GET /api/resourceType
  • When creating new or update for Role Rates need use this endpoint
    • POST /api/roleRate
  • When delete role rate  need use this endpoint
    • DELETE /api/roleRate/{id}
    • Note: if possible using the same `POST /api/roleRate` to delete data, please use that instead
  • When creating new or update for Monthly Days of current year need to use endpoint
    • POST /api/monthlyDays
    • Note: if data not available for some year, display zero
    • By default frontend need show current year
  • For Value Stream Data Management need accept params for Portfolio and Value Stream and return related vSDataCostCenter and vSDataResource
    • For both sections need able to create or update array of data from single endpoint
      • You can use POST /api/vSDataCostCenter and POST /api/vSDataResource
    • Note: There are separated DELETE endpoints but if possible using the same POST endpoint to delete data, please use that instead.

4). Resource Allocation
UI Prototype Demo: https://jh-vsroadmap-expansion.herokuapp.com/costs-page/resource-allocation
Current Issues:
  • There are multiple scrollbar showing when swipe the table row on Desktop and Tablet devices. Fix that to only show just 1 scrollbar on the frozen column area

Page Requirements
  • Need able to pull Resource Allocation based on Portfolio id, Value Stream Id. You can use this endpoint:
    • POST /api/resourceAllocation/search
  • To create new or update array of data for Resource allocation need use this endpoint
    • POST /api/resourceAllocation
  • To update Resource allocation need use this endpoint
    • PUT /api/resourceAllocation/{id}
  • The export dropdown should work to pull data based on selected file type. You can use this endpoint:
    • GET /api/resourceAllocation/export
  • User should be able to add/remove value stream rows.
  • User should be able to add/remove full resources rows.
  • Reuse a confirmation dialog for removing items.
  • Note: we need list full 12 months for each year across the page and make sure they are scrollable to the correct year

Web Browsers Requirements
Your submission must look and work consistently across these following browsers on the latest versions:  
  • IE11 (IMPORTANT: Need test first)
  • Chrome,
  • Edge,
  • Safari,
  • Firefox


Final Submission Guidelines

What To Submit?
  • Patch file of updated frontend
  • Updated README.md (How to setup your app on localhost and live site, also support the unit testing)

Review style

Final Review

Community Review Board

Approval

User Sign-Off

ID: 30101279