datajunction-ui 0.0.1-rc.0

package/.env

@@ -0,0 +1 @@
+REACT_APP_DJ_URL=http://localhost:8000

package/.env.local

@@ -0,0 +1,4 @@
+BROWSER=none
+EXTEND_ESLINT=true
+FAST_REFRESH=true
+REACT_APP_DJ_URL=http://localhost:8000

package/.env.production

@@ -0,0 +1 @@
+GENERATE_SOURCEMAP=false

package/.eslintrc.js

@@ -0,0 +1,20 @@
+const fs = require('fs');
+const path = require('path');
+
+const prettierOptions = JSON.parse(
+  fs.readFileSync(path.resolve(__dirname, '.prettierrc'), 'utf8'),
+);
+
+module.exports = {
+  extends: ['react-app', 'prettier'],
+  plugins: ['prettier'],
+  rules: {
+    'prettier/prettier': ['error', prettierOptions],
+  },
+  overrides: [
+    {
+      files: ['**/*.ts?(x)'],
+      rules: { 'prettier/prettier': ['warn', prettierOptions] },
+    },
+  ],
+};

package/.gitattributes

@@ -0,0 +1,201 @@
+# From https://github.com/Danimoth/gitattributes/blob/master/Web.gitattributes
+
+## GITATTRIBUTES FOR WEB PROJECTS
+#
+# These settings are for any web project.
+#
+# Details per file setting:
+#   text    These files should be normalized (i.e. convert CRLF to LF).
+#   binary  These files are binary and should be left untouched.
+#
+# Note that binary is a macro for -text -diff.
+######################################################################
+
+# Auto detect
+##   Handle line endings automatically for files detected as
+##   text and leave all files detected as binary untouched.
+##   This will handle all files NOT defined below.
+*                 text=auto
+
+# Source code
+*.bash            text eol=lf
+*.bat             text eol=crlf
+*.cmd             text eol=crlf
+*.coffee          text
+*.css             text
+*.htm             text diff=html
+*.html            text diff=html
+*.inc             text
+*.ini             text
+*.js              text
+*.json            text
+*.jsx             text
+*.less            text
+*.ls              text
+*.map             text -diff
+*.od              text
+*.onlydata        text
+*.php             text diff=php
+*.pl              text
+*.ps1             text eol=crlf
+*.py              text diff=python
+*.rb              text diff=ruby
+*.sass            text
+*.scm             text
+*.scss            text diff=css
+*.sh              text eol=lf
+*.sql             text
+*.styl            text
+*.tag             text
+*.ts              text
+*.tsx             text
+*.xml             text
+*.xhtml           text diff=html
+
+# Docker
+Dockerfile        text
+
+# Documentation
+*.ipynb           text
+*.markdown        text
+*.md              text
+*.mdwn            text
+*.mdown           text
+*.mkd             text
+*.mkdn            text
+*.mdtxt           text
+*.mdtext          text
+*.txt             text
+AUTHORS           text
+CHANGELOG         text
+CHANGES           text
+CONTRIBUTING      text
+COPYING           text
+copyright         text
+*COPYRIGHT*       text
+INSTALL           text
+license           text
+LICENSE           text
+NEWS              text
+readme            text
+*README*          text
+TODO              text
+
+# Templates
+*.dot             text
+*.ejs             text
+*.haml            text
+*.handlebars      text
+*.hbs             text
+*.hbt             text
+*.jade            text
+*.latte           text
+*.mustache        text
+*.njk             text
+*.phtml           text
+*.tmpl            text
+*.tpl             text
+*.twig            text
+*.vue             text
+
+# Configs
+*.cnf             text
+*.conf            text
+*.config          text
+.editorconfig     text
+.env              text
+.gitattributes    text
+.gitconfig        text
+.htaccess         text
+*.lock            text -diff
+package-lock.json text -diff
+*.toml            text
+*.yaml            text
+*.yml             text
+browserslist      text
+Makefile          text
+makefile          text
+
+# Heroku
+Procfile          text
+
+# Graphics
+*.ai              binary
+*.bmp             binary
+*.eps             binary
+*.gif             binary
+*.gifv            binary
+*.ico             binary
+*.jng             binary
+*.jp2             binary
+*.jpg             binary
+*.jpeg            binary
+*.jpx             binary
+*.jxr             binary
+*.pdf             binary
+*.png             binary
+*.psb             binary
+*.psd             binary
+# SVG treated as an asset (binary) by default.
+*.svg             text
+# If you want to treat it as binary,
+# use the following line instead.
+# *.svg           binary
+*.svgz            binary
+*.tif             binary
+*.tiff            binary
+*.wbmp            binary
+*.webp            binary
+
+# Audio
+*.kar             binary
+*.m4a             binary
+*.mid             binary
+*.midi            binary
+*.mp3             binary
+*.ogg             binary
+*.ra              binary
+
+# Video
+*.3gpp            binary
+*.3gp             binary
+*.as              binary
+*.asf             binary
+*.asx             binary
+*.fla             binary
+*.flv             binary
+*.m4v             binary
+*.mng             binary
+*.mov             binary
+*.mp4             binary
+*.mpeg            binary
+*.mpg             binary
+*.ogv             binary
+*.swc             binary
+*.swf             binary
+*.webm            binary
+
+# Archives
+*.7z              binary
+*.gz              binary
+*.jar             binary
+*.rar             binary
+*.tar             binary
+*.zip             binary
+
+# Fonts
+*.ttf             binary
+*.eot             binary
+*.otf             binary
+*.woff            binary
+*.woff2           binary
+
+# Executables
+*.exe             binary
+*.pyc             binary
+
+# RC files (like .babelrc or .eslintrc)
+*.*rc             text
+
+# Ignore files (like .npmignore or .gitignore)
+*.*ignore         text

package/.github/pull_request_template.md

@@ -0,0 +1,11 @@
+### Summary
+
+<!-- What's this change about? -->
+
+### Test Plan
+
+<!-- How did you test your change? -->
+
+### Deployment Plan
+
+<!-- Any special instructions around deployment? -->

package/.github/workflows/ci.yml

@@ -0,0 +1,33 @@
+name: CI/CD
+
+on:
+  push:
+    branches: [main]
+  pull_request:
+    branches: [main]
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+
+    strategy:
+      matrix:
+        node-version: [19.x]
+
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v2
+
+      - name: Set up Node.js ${{ matrix.node-version }}
+        uses: actions/setup-node@v3
+        with:
+          node-version: ${{ matrix.node-version }}
+
+      - name: Install Dependencies
+        run: yarn install
+
+      - name: Run Unit Tests
+        run: yarn test
+
+      - name: Build Project
+        run: yarn build

package/.husky/pre-commit

@@ -0,0 +1,6 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+
+yarn checkTs
+yarn lint-staged
+

package/.nvmrc

@@ -0,0 +1 @@
+lts/fermium

package/.prettierignore

@@ -0,0 +1,4 @@
+build/
+node_modules/
+package-lock.json
+yarn.lock

package/.prettierrc

@@ -0,0 +1,9 @@
+{
+  "printWidth": 80,
+  "tabWidth": 2,
+  "useTabs": false,
+  "semi": true,
+  "singleQuote": true,
+  "trailingComma": "all",
+  "arrowParens": "avoid"
+}

package/.stylelintrc

@@ -0,0 +1,7 @@
+{
+  "processors": ["stylelint-processor-styled-components"],
+  "extends": [
+    "stylelint-config-recommended",
+    "stylelint-config-styled-components"
+  ]
+}

package/.vscode/extensions.json

@@ -0,0 +1,8 @@
+{
+  "recommendations": [
+    "dbaeumer.vscode-eslint",
+    "esbenp.prettier-vscode",
+    "styled-components.vscode-styled-components",
+    "orta.vscode-jest"
+  ]
+}

package/.vscode/launch.json

@@ -0,0 +1,15 @@
+{
+  "version": "0.2.0",
+  "configurations": [
+    {
+      "name": "Chrome",
+      "type": "chrome",
+      "request": "launch",
+      "url": "http://localhost:3000",
+      "webRoot": "${workspaceFolder}/src",
+      "sourceMapPathOverrides": {
+        "webpack:///src/*": "${webRoot}/*"
+      }
+    }
+  ]
+}

package/.vscode/settings.json

@@ -0,0 +1,25 @@
+{
+  "typescript.tsdk": "node_modules/typescript/lib",
+  "[typescript]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode",
+    "editor.tabSize": 2
+  },
+  "[typescriptreact]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+  },
+  "[javascript]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+  },
+  "[json]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+  },
+  "[html]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+  },
+  "editor.codeActionsOnSave": {
+    "source.fixAll": true,
+    "source.fixAll.eslint": true
+  },
+  "editor.formatOnSave": true,
+  "javascript.format.enable": false
+}

package/Dockerfile

@@ -0,0 +1,6 @@
+FROM node:19 AS ui-build
+WORKDIR /usr/src/app
+COPY . .
+EXPOSE 3000
+
+CMD ["yarn", "start"]

package/LICENSE

@@ -0,0 +1,22 @@
+MIT License
+
+Copyright (c) 2023 DJ
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+

package/README.md

@@ -0,0 +1,10 @@
+# DataJunction UI
+
+A view-only UI for the DataJunction metrics platform.
+
+To run:
+
+```bash
+yarn install
+yarn start
+```

package/internals/testing/loadable.mock.tsx

@@ -0,0 +1,6 @@
+import * as React from 'react';
+
+export function ExportedFunc() {
+  return <div>My lazy-loaded component</div>;
+}
+export default ExportedFunc;

package/package.json

@@ -0,0 +1,150 @@
+{
+  "name": "datajunction-ui",
+  "version": "0.0.1-rc.0",
+  "description": "DataJunction Metrics Platform UI",
+  "module": "src/index.tsx",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/DataJunction/dj-ui.git"
+  },
+  "keywords": [
+    "datajunction",
+    "metrics",
+    "metrics-platform",
+    "semantic-layer"
+  ],
+  "author": "DataJunction Authors",
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/DataJunction/dj/issues"
+  },
+  "homepage": "https://github.com/DataJunction/dj#readme",
+  "dependencies": {
+    "@reduxjs/toolkit": "1.8.5",
+    "@testing-library/jest-dom": "5.16.5",
+    "@testing-library/react": "13.4.0",
+    "@types/fontfaceobserver": "^2.1.0",
+    "@types/jest": "^27.5.2",
+    "@types/node": "^14.18.27",
+    "@types/react": "^18.0.20",
+    "@types/react-dom": "^18.0.6",
+    "@types/react-redux": "^7.1.24",
+    "@types/react-test-renderer": "^18.0.0",
+    "@types/rimraf": "^3.0.2",
+    "@types/shelljs": "^0.8.11",
+    "@types/styled-components": "^5.1.26",
+    "@types/testing-library__jest-dom": "^5.14.5",
+    "@types/webpack": "^5.28.0",
+    "@types/webpack-env": "^1.18.0",
+    "chalk": "4.1.2",
+    "cross-env": "7.0.3",
+    "dagre": "^0.8.5",
+    "datajunction": "0.0.1-rc.0",
+    "eslint-config-prettier": "8.5.0",
+    "eslint-plugin-prettier": "4.2.1",
+    "eslint-plugin-react-hooks": "4.6.0",
+    "fontfaceobserver": "2.3.0",
+    "husky": "8.0.1",
+    "i18next": "21.9.2",
+    "i18next-browser-languagedetector": "6.1.5",
+    "i18next-scanner": "4.0.0",
+    "inquirer": "7.3.3",
+    "inquirer-directory": "2.2.0",
+    "jest-styled-components": "7.1.1",
+    "lint-staged": "13.0.3",
+    "node-plop": "0.26.3",
+    "plop": "2.7.6",
+    "prettier": "2.7.1",
+    "react": "18.2.0",
+    "react-app-polyfill": "3.0.0",
+    "react-dom": "18.2.0",
+    "react-helmet-async": "1.3.0",
+    "react-i18next": "11.18.6",
+    "react-is": "18.2.0",
+    "react-redux": "7.2.8",
+    "react-router-dom": "6.3.0",
+    "react-scripts": "5.0.1",
+    "react-syntax-highlighter": "^15.5.0",
+    "react-test-renderer": "18.2.0",
+    "reactflow": "^11.7.0",
+    "redux-injectors": "1.3.0",
+    "redux-saga": "1.2.1",
+    "rimraf": "3.0.2",
+    "sanitize.css": "13.0.0",
+    "serve": "14.0.1",
+    "shelljs": "0.8.5",
+    "sql-formatter": "^12.2.0",
+    "styled-components": "5.3.5",
+    "stylelint": "14.12.0",
+    "stylelint-config-recommended": "9.0.0",
+    "stylelint-config-styled-components": "0.1.1",
+    "stylelint-processor-styled-components": "1.10.0",
+    "ts-node": "10.9.1",
+    "typescript": "4.6.4",
+    "web-vitals": "2.1.4"
+  },
+  "scripts": {
+    "start": "react-scripts start",
+    "build": "react-scripts build",
+    "test": "react-scripts test",
+    "eject": "react-scripts eject",
+    "start:prod": "yarn run build && serve -s build",
+    "test:generators": "ts-node ./internals/testing/generators/test-generators.ts",
+    "checkTs": "tsc --noEmit",
+    "eslint": "eslint --ext js,ts,tsx",
+    "lint": "yarn run eslint src",
+    "lint:fix": "yarn run eslint --fix src",
+    "lint:css": "stylelint src/**/*.css",
+    "generate": "plop --plopfile internals/generators/plopfile.ts",
+    "cleanAndSetup": "ts-node ./internals/scripts/clean.ts",
+    "prettify": "prettier --write",
+    "extract-messages": "i18next-scanner --config=internals/extractMessages/i18next-scanner.config.js"
+  },
+  "eslintConfig": {
+    "extends": "react-app"
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  },
+  "engines": {
+    "node": ">=14.x"
+  },
+  "lint-staged": {
+    "*.{ts,tsx,js,jsx}": [
+      "yarn run eslint --fix"
+    ],
+    "*.{md,json}": [
+      "prettier --write"
+    ]
+  },
+  "jest": {
+    "collectCoverageFrom": [
+      "src/**/*.{js,jsx,ts,tsx}",
+      "!src/**/*/*.d.ts",
+      "!src/**/*/Loadable.{js,jsx,ts,tsx}",
+      "!src/**/*/messages.ts",
+      "!src/**/*/types.ts",
+      "!src/index.tsx"
+    ],
+    "coverageThreshold": {
+      "global": {
+        "branches": 90,
+        "functions": 90,
+        "lines": 90,
+        "statements": 90
+      }
+    }
+  },
+  "devDependencies": {
+    "jest": "^29.5.0"
+  }
+}

package/public/index.html

@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <meta name="theme-color" content="#000000" />
+    <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
+    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
+    <meta property="og:title" content="React Boilerplate Example App" />
+    <meta property="og:description" content="" />
+    <meta
+      property="og:image"
+      content="https://repository-images.githubusercontent.com/250347048/15514f00-8713-11ea-9f9d-796a89b5de4d"
+    />
+    <title>DataJunction App</title>
+    <meta name="description" content="" />
+  </head>
+  <body>
+    <noscript>You need to enable JavaScript to run this app.</noscript>
+    <div id="root"></div>
+
+    <!-- Inter Font -->
+    <link
+      href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;700&display=swap"
+      rel="stylesheet"
+    />
+  </body>
+</html>

package/public/manifest.json

@@ -0,0 +1,15 @@
+{
+  "short_name": "DataJunction UI",
+  "name": "DataJunction UI",
+  "icons": [
+    {
+      "src": "favicon.ico",
+      "sizes": "64x64 32x32 24x24 16x16",
+      "type": "image/x-icon"
+    }
+  ],
+  "start_url": ".",
+  "display": "standalone",
+  "theme_color": "#000000",
+  "background_color": "#ffffff"
+}

package/public/robots.txt

@@ -0,0 +1,3 @@
+# https://www.robotstxt.org/robotstxt.html
+User-agent: *
+Disallow:

package/src/app/__tests__/__snapshots__/index.test.tsx.snap

@@ -0,0 +1,45 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<App /> should render and match the snapshot 1`] = `
+<BrowserRouter>
+  <Helmet
+    defaultTitle="DataJunction: A Metrics Platform"
+    defer={true}
+    encodeSpecialCharacters={true}
+    prioritizeSeoTags={false}
+    titleTemplate="DataJunction: %s"
+  >
+    <meta
+      content="DataJunction serves as a semantic layer to help manage metrics"
+      name="description"
+    />
+  </Helmet>
+  <Routes>
+    <Route
+      element={<Unknown />}
+      path="/"
+    >
+      <React.Fragment>
+        <Route
+          element={<Unknown />}
+          path="/nodes/:name"
+        />
+        <Route
+          element={<Unknown />}
+          path="/namespaces/:namespace"
+        />
+        <Route
+          element={<ListNamespacesPage />}
+          path="/namespaces/"
+        />
+      </React.Fragment>
+    </Route>
+    <Route
+      element={<Unknown />}
+      path="*"
+    />
+  </Routes>
+  <Memo(l) />
+  <Memo(l) />
+</BrowserRouter>
+`;

package/src/app/__tests__/index.test.tsx

@@ -0,0 +1,14 @@
+import * as React from 'react';
+import { createRenderer } from 'react-test-renderer/shallow';
+
+import { App } from '../index';
+
+const renderer = createRenderer();
+
+describe('<App />', () => {
+  it('should render and match the snapshot', () => {
+    renderer.render(<App />);
+    const renderedOutput = renderer.getRenderOutput();
+    expect(renderedOutput).toMatchSnapshot();
+  });
+});