TC - update Contentful navigation menu

Challenge Objectives

• Update Contentful navigation menu component to support route components as menu items and overcome “unique slugs limitation” for NaviMenuItems.

Project Background

Topcoder is utilizing Contentful (a headless CMS) to deliver high-quality content and provide a flexible platform to manage that content. In this challenge, you will help in the process by fulfilling the requirements listed below.

Technology Stack

NodeJS, Javascript, ReactJS, Contentful, CMS, Linux, Mac

Prerequisites

• This challenge requires preregistered Contentful account

• Linux or Mac based OS

Working on Contentful challenges

Before starting to work on the challenge please take some time to get familiar with the basics of setup, configuration, import/export of Contentful space and types. We have helpful documentation on the topics here.

 

To jumpstart the work process we have exports of TC community space here. Note that you will need to import it which configures the core TC components in your space. It has all custom component types Topcoder is using.

 

The general preparation steps to work on Contentful related challenge are:

 

1. Register your Contentful account and obtain/note its credentials.

2. Import the TC custom types “tc-core.json” stored in the file to your space.

3. Setup community-app locally. Some tips:

   1. Use node version 8.11.2

   2. Ask for help in TC Slack channels when some difficulties arise

4. Provide Contentful credentials as environment variables to work against your space.

5. Complete challenge requirements as per specification below.

6. Test your work using the example routes `http://local.topcoder-dev.com:3000/examples/contentful/<:type>/<:id>`

7. Export your space(via Contentful cli) to file and include it with submission.

 

Most core components do have mounted routes to ease the develop/test work with them. See this file for details.

General Requirements(All Major)

• If You make changes to code it should pass project linting as configured. After your work `npm run lint` should complete without errors.

• We should be able to import the export file(should be provided with submission) in TC Contentful space without any errors using the `contentful space import` command.

• New developed components should be placed in the app’s contentful folder.

Individual Requirements(All Major)

• Keeping existing Navigation Menu functionality we need to add support for creating menus from Route components. To do so:

  • Setup your environment and import the updated tc-core-menuUpdate.json file to your space.

  • Implement requirements below...

• We have added a field `naviMenuLinkText` to route that should be used as NaviMenuItem - Link Text. If it `naviMenuLinkText` is empty/undefined use the Route’s name field to create the mane link text.

• The URL/slug fields of the NaviMenuItem should be created from the Route’s URL field so the menu points to correct address of the route. Note: currently the NaviMenuItem works only with unique slugs. We want to overcome this limitation. This is the main point of the challenge. When a Route(with child routes) is passed, the menu should be rendered based on it and it should be fully working.

• If the Route has a linked Viewport then the NaviMenuItem should link to it too.

• If the Route has child routes those should be processed and created as Submenu in the NaviMenuItem following above rules. Created menu links should follow Routes url path structure/hierarchy. For instance: “/route/RouteChildA/RouteChildB/…”

Final Submission Guidelines

• Git patch against the latest commit in develop branch of community-app

• An exported file of your dev Contentful space to help reviewers re-create your space for testing.

• Verification document with steps on how to verify your submission.

• Deployment guide. Be specific!