Skip to content

Commit

Permalink
Add new package for Spotlight Client (#228)
Browse files Browse the repository at this point in the history
  • Loading branch information
macfarlandian committed Oct 14, 2020
1 parent 0b17ce8 commit 35b089c
Show file tree
Hide file tree
Showing 28 changed files with 736 additions and 66 deletions.
1 change: 1 addition & 0 deletions .eslintrc.json
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@
"extends": ["react-app", "airbnb", "plugin:prettier/recommended"],
// unlike .eslintignore, these values will cascade
"ignorePatterns": ["node_modules/", "build/", "public/"],
"plugins": ["simple-import-sort"],
"rules": {
"react/jsx-filename-extension": ["error", { "extensions": [".js"] }],
"import/no-extraneous-dependencies": ["error", { "packageDir": "./" }],
Expand Down
101 changes: 101 additions & 0 deletions .github/workflows/main.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,101 @@
name: "Build Status"

on:
- push
- pull_request

jobs:
lint-public-dashboard:
name: Lint Public Dashboard
runs-on: ubuntu-latest
defaults:
run:
working-directory: public-dashboard-client
steps:
- uses: actions/checkout@v2
- uses: actions/setup-node@v1.1.0
with:
node-version: "12.x"
- uses: c-hive/gha-yarn-cache@v1
- run: yarn install --frozen-lockfile
- run: yarn lint
test-public-dashboard:
name: Test Public Dashboard
runs-on: ubuntu-latest
defaults:
run:
working-directory: public-dashboard-client
steps:
- uses: actions/checkout@v2
- uses: actions/setup-node@v1.1.0
with:
node-version: "12.x"
- uses: c-hive/gha-yarn-cache@v1
- run: yarn install --frozen-lockfile
- run: yarn test --coverage
- name: Coveralls
uses: coverallsapp/github-action@master
with:
flag-name: public-dashboard-client
github-token: ${{ secrets.GITHUB_TOKEN }}
parallel: true
path-to-lcov: public-dashboard-client/coverage/lcov.info
lint-spotlight-client:
name: Lint Spotlight Client
runs-on: ubuntu-latest
defaults:
run:
working-directory: spotlight-client
steps:
- uses: actions/checkout@v2
- uses: actions/setup-node@v1.1.0
with:
node-version: "12.x"
- uses: c-hive/gha-yarn-cache@v1
- run: yarn install --frozen-lockfile
- run: yarn lint
test-spotlight-client:
name: Test Spotlight Client
runs-on: ubuntu-latest
defaults:
run:
working-directory: spotlight-client
steps:
- uses: actions/checkout@v2
- uses: actions/setup-node@v1.1.0
with:
node-version: "12.x"
- uses: c-hive/gha-yarn-cache@v1
- run: yarn install --frozen-lockfile
- run: yarn test --coverage
- name: Coveralls
uses: coverallsapp/github-action@master
with:
flag-name: spotlight-client
github-token: ${{ secrets.GITHUB_TOKEN }}
parallel: true
path-to-lcov: spotlight-client/coverage/lcov.info
lint-spotlight-api:
name: Lint Spotlight API
runs-on: ubuntu-latest
defaults:
run:
working-directory: spotlight-api
steps:
- uses: actions/checkout@v2
- uses: actions/setup-node@v1.1.0
with:
node-version: "12.x"
- uses: c-hive/gha-yarn-cache@v1
- run: yarn install --frozen-lockfile
- run: yarn lint
finish-coveralls:
name: Finish Coveralls
runs-on: ubuntu-latest
needs: [test-public-dashboard, test-spotlight-client]
steps:
- name: Coveralls Parallel Finished
uses: coverallsapp/github-action@master
with:
github-token: ${{ secrets.GITHUB_TOKEN }}
parallel-finished: true
31 changes: 0 additions & 31 deletions .github/workflows/public-dashboard-client-ci.yml

This file was deleted.

20 changes: 0 additions & 20 deletions .github/workflows/spotlight-api-ci.yml

This file was deleted.

3 changes: 3 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -38,3 +38,6 @@ yarn-error.log*

# Package files
package-lock.json

# Typescript build artifacts
*.tsbuildinfo
10 changes: 7 additions & 3 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,20 +2,24 @@

This repository contains npm packages related to our Spotlight data publishing product, as well as some shared configuration and tooling that involves multiple packages.

![CI: Public Dashboard API](https://github.com/Recidiviz/public-dashboard/workflows/CI:%20Public%20Dashboard%20API/badge.svg) ![CI: Spotlight API](https://github.com/Recidiviz/public-dashboard/workflows/CI:%20Spotlight%20API/badge.svg)
![Build Status](https://github.com/Recidiviz/public-dashboard/workflows/Build%20Status/badge.svg) [![Coverage Status](https://coveralls.io/repos/github/Recidiviz/public-dashboard/badge.svg?branch=master)](https://coveralls.io/github/Recidiviz/public-dashboard?branch=master)

## Packages in this repository

More information about how to use each individual package can be found in their respective README files.

### [Public Dashboard Client](public-dashboard-client/)

A React application for the Spotlight website
A React application for the original Spotlight website (North Dakota only)

### [Spotlight API](spotlight-api/)

A thin Node/Express backend that serves data for the Spotlight website.

### [Spotlight Client](spotlight-client/)

A React application for the next-generation Spotlight website (not yet launched).

## Development

### Getting set up
Expand Down Expand Up @@ -74,5 +78,5 @@ In addition, there are some conventions you should follow when setting up your n

- The package name should be the same as the directory name
- `yarn dev` should execute the main entry point for development (e.g., starting a development server)
- `yarn lint` should run your lint tests
- `yarn lint` should run your static checks (linting, type-checking)
- `yarn test` should run your JS tests, if you have any (which you should!)
7 changes: 6 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,9 @@
"private": true,
"repository": "git@github.com:Recidiviz/public-dashboard.git",
"workspaces": [
"public-dashboard-client",
"spotlight-api",
"public-dashboard-client"
"spotlight-client"
],
"author": "Recidiviz <team@recidiviz.org>",
"license": "GNU General Public License v3",
Expand All @@ -14,9 +15,11 @@
"dev:pdclient": "yarn workspace public-dashboard-client run dev"
},
"devDependencies": {
"coveralls": "^3.1.0",
"eslint-config-airbnb": "^18.2.0",
"eslint-config-prettier": "^6.11.0",
"eslint-plugin-prettier": "^3.1.4",
"eslint-plugin-simple-import-sort": "^5.0.3",
"husky": ">=4",
"lint-staged": ">=10",
"npm-run-all": "^4.1.5",
Expand All @@ -28,8 +31,10 @@
}
},
"lint-staged": {
"*.{ts,tsx}": "bash -c tsc",
"*.{js,jsx,ts,tsx,css,scss}": "eslint --fix",
"*.json": "prettier --write",
"**/*.{ts,tsx}": "bash -c tsc",
"**/*.{js,jsx,ts,tsx,css,scss}": "eslint --fix",
"**/*.json": "prettier --write"
}
Expand Down
4 changes: 1 addition & 3 deletions public-dashboard-client/README.md
Original file line number Diff line number Diff line change
@@ -1,8 +1,6 @@
# Public Dashboard Client

This package is a React client application for the Spotlight public dashboard website. It was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).

![CI: Public Dashboard API](https://github.com/Recidiviz/public-dashboard/workflows/CI:%20Public%20Dashboard%20API/badge.svg)
This package is a React client application for the original Spotlight public dashboard website (North Dakota only). It was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).

## Development

Expand Down
2 changes: 0 additions & 2 deletions spotlight-api/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,6 @@

This package is a Node/Express server application that provides a thin API backend for clients consuming public metrics from the Recidiviz data pipeline.

![CI: Spotlight API](https://github.com/Recidiviz/public-dashboard/workflows/CI:%20Spotlight%20API/badge.svg)

## Development

### Getting set up
Expand Down
53 changes: 53 additions & 0 deletions spotlight-client/.eslintrc.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,53 @@
{
"env": {
"browser": true,
"jest": true
},
"extends": [
// explicitly extending the base config so we don't override its own "extends" field
"../.eslintrc.json",
// From @typescript-eslint/eslint-plugin
"plugin:@typescript-eslint/recommended",
// From eslint-config-prettier
"prettier/@typescript-eslint"
],
"parser": "@typescript-eslint/parser",
"plugins": ["@typescript-eslint"],
"rules": {
// This is a living list! If an eslint rule does more harm than good, just
// add it below to override it. Write a comment above each rule explaining
// why the exception is made, so we know whether to keep it in the future.

// the bare eslint rule breaks in typescript
// https://github.com/typescript-eslint/typescript-eslint/blob/master/packages/eslint-plugin/docs/rules/no-use-before-define.md#how-to-use
"no-use-before-define": "off",
"@typescript-eslint/no-use-before-define": ["error"],

// don't require extensions for typescript modules
"import/extensions": [
"error",
"always",
{ "js": "never", "ts": "never", "tsx": "never" }
],

// support typescript as well as javascript file extensions
"react/jsx-filename-extension": [
"error",
{ "extensions": [".tsx", ".js"] }
],

// We use TypeScript props interfaces, which is mostly redundant with prop
// types.
"react/prop-types": "off"
},
"settings": {
"import/resolver": {
// use <root>/tsconfig.json
"typescript": {
// always try to resolve types under `<root>@types` directory
// even it doesn't contain any source code, like `@types/unist`
"alwaysTryTypes": true
}
}
}
}
54 changes: 54 additions & 0 deletions spotlight-client/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,54 @@
# Spotlight Client

This package is a React client application for the next-generation Spotlight public data publishing website (not yet launched). It was bootstrapped with [Create React App](https://github.com/facebook/create-react-app) and is written in [TypeScript](https://www.typescriptlang.org/docs).

## Development

### Getting set up

If you have followed the [setup instructions](../README.md#getting-set-up) in the root directory, you should be ready to go. You should be able to test your development environment via:

`yarn test`
`yarn lint`

We suggest installing a linting package for your preferred code editor that hooks into [eslint](#yarn-lint). We recommend [linter-eslint](https://atom.io/packages/linter-eslint) if you're using Atom.

### Running the application locally

`yarn dev` will start a Webpack development server on port `3000` and open the homepage in your browser.

The development servers will remain active until you either close your terminal or shut it down using `control+c`.

**Note:** The frontend server does not need to be restarted when frontend source code is modified. The assets will automatically be recompiled and the browser will be refreshed.

## Deploys

Not yet implemented! Instructions will be found here once a process is in place.

## Available Scripts

Besides the scripts mentioned above for running and deploying the app, you can also run:

### `yarn test`

Launches the test runner in the interactive watch mode.

We use [`@testing-library/react`](https://testing-library.com/docs/react-testing-library/intro) for React component tests.

See the [Create React App docs](https://facebook.github.io/create-react-app/docs/running-tests) for more information.

### `yarn lint`

Runs Typescript and ESLint checks against the package to check for issues in type usage or code style.

Eslint rules are configurable in `.eslintrc.json`, which inherits from the root `../.eslintrc.json` and extends it with settings specific to this package. Any change to this file should be accompanied with an explanation for the change and why it should be merged.

Typescript rules are configurable in `./tsconfig.json`; this file was originally created by Create React App but it is safe to edit as needed.

You can also run either TS or ESLint individually; while there are not predefined scripts for this, you can inspect the definition of `lint` in `package.json` to see the individual commands that are run, and you can pass either of them to `yarn run` as needed.

### `yarn eject`

**Note: this is a one-way operation. Once you `eject`, you can’t go back!**

This package was bootstrapped with Create React App, which provides the option to `eject` its build tooling and configuration, allowing for full customization. See [the Create React App docs](https://create-react-app.dev/docs/available-scripts#npm-run-eject) for more information.
Loading

0 comments on commit 35b089c

Please sign in to comment.