README.md

ThirdEye UI

This is the UI project for StarTree ThirdEye.

• Getting started
  • Prerequisites
    • Node Version Manager (nvm)
    • Configure Node Package Manager (npm) for use with Artifactory
  • Setup
  • Run
• Supported browsers
• Scripts
  • start
  • build
  • test
  • test-watch
  • test-coverage
  • test-e2e
  • test-e2e-gui
  • license-header-check
  • license-header-fix
  • eslint-check
  • eslint-fix
  • stylelint-check
  • stylelint-fix
  • prettier-check
  • prettier-fix
  • lint-check
  • lint-fix
  • ci-check
• Contributing

Getting started

These instructions will help you get the project up and running on your local machine for development and testing purposes.

Prerequisites

Node Version Manager (nvm)

The project uses nvm to maintain the Node version. Compatible Node version is listed in project root .nvmrc. Follow the instructions to install nvm for Linux/macOS or Windows.

Once you install nvm, go to the project directory and switch to the compatible Node version

$ nvm use

This will switch to the required Node version if already installed and make npm command available in the terminal.

If the required Node version is not installed, it will recommend the command to install it

Found '/Users/default/thirdeye/thirdeye-ui/.nvmrc' with version <14.18.1>
N/A: version "14.18.1 -> N/A" is not yet installed.

You need to run "nvm install 14.18.1" to install it before using it.

Following the installation, the command above will let you switch to the required Node version.

💡
nvm use (without version number) might not work when using nvm for Windows. You may need to specify precise Node version from repository root .nvmrc.

Configure Node Package Manager (npm) for use with Artifactory

The project may depend on some packages to be installed from Artifactory and npm needs to be configured to allow access to these packages. The Artifactory repository to install packages from is configured in project root .npmrc.

To configure npm, log in to Artifactory and create an API Key. Then use the API Key to generate npm configuration from Artifactory using curl

$ curl -u<your-email>:<API-Key> http://repo.startreedata.io/artifactory/api/npm/auth

This will generate an authentication token that can be used to configure npm

_auth = <authentication-token>
always-auth = true
email = <your-email>

Copy the authentication token and use it in ~/.npmrc:

//repo.startreedata.io/artifactory/api/npm/startree-ui/:_auth=<authentication-token>

Setup

Once you clone the repository, go to the project directory and install

$ npm install

This will install necessary dependencies for the project.

💡
In case npm errors out with cb() never called message, remove project root /node-modules and run

$ npm cache clean --force

Run

Once set up, go to the project directory and run

$ npm run start

This will build and deploy the project using webpack-dev-server at http://localhost:7004.

💡
Configuration for the proxy to the /api endpoint is located in webpack configuration under devServer.proxy property. Currently, it points to the value of TE_DEV_PROXY_SERVER environment variable or by default http://localhost:8080/.

Supported browsers

StarTree ThirdEye UI is tested on latest, stable release of Chrome, Firefox, Safari and Edge.

Scripts

start

Build and deploy the project using webpack-dev-server at http://localhost:7004

$ npm run start

build

Build the project and output the bundles in project root /dist

$ npm run build

This will also analyze the bundles using Webpack Bundle Analyzer and generate bundle report in project root /webpack.

test

Run all tests

$ npm run test

test-watch

Watch files for changes and re-run tests related to changed files

$ npm run test-watch

test-coverage

Run all tests and generate coverage report in project root /src/test/unit/coverage

$ npm run test-coverage

test-e2e

Run all end to end tests headlessly using Cypress

$ npm run test-e2e -- --config baseUrl=<base-URL> --env username=<username>,password=<password>,clientSecret=<client-secret> --browser firefox

Following command line arguments are expected

• Configuration options
  • baseUrl: server URL to run the tests against
• Environment variables
  • username: username to authenticate with
  • password: password to authenticate with
  • clientSecret: client secret to authenticate with
• browser: electron (default), chrome, edge or firefox (other than the default Electron browser, any other browser needs to be installed in the environment where tests are being run)

test-e2e-gui

Run all end to end tests using Cypress Test Runner

$ npm run test-e2e-gui -- --config baseUrl=<base-URL> --env username=<username>,password=<password>,clientSecret=<client-secret>

Following command line arguments are expected

• Configuration options
  • baseUrl: server URL to run the tests against
• Environment variables
  • username: username to authenticate with
  • password: password to authenticate with
  • clientSecret: client secret to authenticate with

license-header-check

Run License Header Checker across the project except for files and directories listed in project root .licenseheaderignore and check for missing copyright header

$ npm run license-header-check

license-header-fix

Run License Header Checker across the project except for files and directories listed in project root .licenseheaderignore and insert appropriate copyright header

$ npm run license-header-fix

eslint-check

Run ESLint across the project except for files and directories listed in project root .eslintignore and check for issues

$ npm run eslint-check

eslint-fix

Run ESLint across the project except for files and directories listed in project root .eslintignore and fix issues

$ npm run eslint-fix

stylelint-check

Run stylelint across the project except for files and directories listed in project root .stylelintignore and check for issues

$ npm run stylelint-check

stylelint-fix

Run stylelint across the project except for files and directories listed in project root .stylelintignore and fix issues

$ npm run stylelint-fix

prettier-check

Run Prettier across the project except for files and directories listed in project root .prettierignore and check for issues

$ npm run prettier-check

prettier-fix

Run Prettier across the project except for files and directories listed in project root .prettierignore and fix issues

$ npm run prettier-fix

lint-check

Run license-header-check, eslint-check, stylelint-check and prettier-check scripts

$ npm run lint-check

lint-fix

Run license-header-fix, eslint-fix, stylelint-fix and prettier-fix scripts

$ npm run lint-fix

ci-check

Run all the scripts that will be executed as part of pull request validation for the project

$ npm run ci-check

Contributing

Coding standards, conventions and other things.