Merge branch 'main' into test-screens

.eslintignore

@@ -0,0 +1,3 @@
+/*.*
+/src/utils/sha256.js
+/src/gql/*

.eslintrc.cjs

@@ -0,0 +1,15 @@
+module.exports = {
+  root: true,
+  extends: ["@storybook/eslint-config-storybook"],
+  rules: {
+    "@typescript-eslint/explicit-module-boundary-types": "off",
+    "eslint-comments/disable-enable-pair": "off",
+    "simple-import-sort/imports": "error",
+    "simple-import-sort/exports": "error",
+  },
+  parser: "@typescript-eslint/parser",
+  parserOptions: {
+    project: ["./tsconfig.json"],
+  },
+  plugins: ["simple-import-sort"],
+};

.github/workflows/chromatic.yml

@@ -0,0 +1,21 @@
+name: "Chromatic"
+on: push
+jobs:
+  chromatic:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v2
+        with:
+          fetch-depth: 0
+
+      - name: Install dependencies
+        uses: pnpm/action-setup@v2
+        with:
+          version: 8
+          run_install: true
+
+      - name: Publish to Chromatic
+        uses: chromaui/action@v1
+        with:
+          projectToken: ${{ secrets.CHROMATIC_PROJECT_TOKEN }}

.github/workflows/release.yml

@@ -7,25 +7,17 @@ jobs:
     runs-on: ubuntu-latest
     if: "!contains(github.event.head_commit.message, 'ci skip') && !contains(github.event.head_commit.message, 'skip ci')"
     steps:
-      - uses: actions/checkout@v2
+      - name: Checkout code
+        uses: actions/checkout@v2
 
-      - name: Prepare repository
-        run: git fetch --unshallow --tags
-
-      - name: Use Node.js 18.x
-        uses: actions/setup-node@v3
-        with:
-          node-version: 18.x
-
-      - uses: pnpm/action-setup@v2
-        name: Install dependencies
+      - name: Install dependencies
+        uses: pnpm/action-setup@v2
         with:
           version: 8
           run_install: true
 
       - name: Create Release
+        run: pnpm run release
         env:
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
           NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
-        run: |
-          pnpm run release

.github/workflows/test.yml

@@ -0,0 +1,21 @@
+name: "Test"
+on: push
+jobs:
+  test:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v2
+
+      - name: Install dependencies
+        uses: pnpm/action-setup@v2
+        with:
+          version: 8
+          run_install: true
+
+      - name: Lint
+        run: pnpm lint
+
+      # Currently we don't have any tests written, this is here for when we do
+      # - name: Test
+      # run: pnpm test

.storybook/main.ts

@@ -1,9 +1,16 @@
 import type { StorybookConfig } from "@storybook/react-vite";
 
+const CHROMATIC_BASE_URL = process.env.CHROMATIC_BASE_URL || "https://www.chromatic.com";
+
 const config: StorybookConfig = {
   addons: [
-    "@storybook/addon-links",
-    "@storybook/addon-essentials",
+    {
+      name: "@storybook/addon-essentials",
+      options: {
+        backgrounds: false,
+        viewport: false,
+      },
+    },
     "@storybook/addon-interactions",
     "storybook-addon-designs",
     {
@@ -16,6 +23,10 @@ const config: StorybookConfig = {
   docs: {
     autodocs: "tag",
   },
+  env: (config) => ({
+    ...config,
+    CHROMATIC_BASE_URL,
+  }),
   framework: {
     name: "@storybook/react-vite",
     options: {},

.storybook/preview.tsx

@@ -116,24 +116,6 @@ export const parameters: Preview["parameters"] = {
     },
   },
   layout: "fullscreen",
-  viewport: {
-    viewports: {
-      right: {
-        name: "Right panel",
-        styles: {
-          width: "420px",
-          height: "640px",
-        },
-      },
-      bottom: {
-        name: "Bottom panel",
-        styles: {
-          width: "900px",
-          height: "300px",
-        },
-      },
-    },
-  },
 };
 
 export const globalTypes = {

package.json

@@ -48,14 +48,15 @@
     "build-storybook": "storybook build",
     "chromatic": "chromatic -t 9b39ff142a7f",
     "codegen": "graphql-codegen",
+    "lint": "eslint src",
     "release": "pnpm run build && auto shipit",
     "start": "run-p build:watch 'storybook --quiet'",
     "storybook": "storybook dev -p 6006",
     "test": "echo \"Error: no test specified\" && exit 1"
   },
   "dependencies": {
     "@storybook/design-system": "^7.15.11",
-    "chromatic": "^6.19.6-canary.0",
+    "chromatic": "^6.19.8",
     "date-fns": "^2.30.0",
     "pluralize": "^8.0.0",
     "urql": "^4.0.3"
@@ -66,8 +67,8 @@
     "@storybook/addon-actions": "^7.1.0-alpha.34",
     "@storybook/addon-essentials": "^7.1.0-alpha.34",
     "@storybook/addon-interactions": "^7.1.0-alpha.34",
-    "@storybook/addon-links": "^7.1.0-alpha.34",
     "@storybook/channels": "^7.1.0-alpha.34",
+    "@storybook/eslint-config-storybook": "^3.1.2",
     "@storybook/manager-api": "^7.1.0-alpha.34",
     "@storybook/react": "^7.1.0-alpha.34",
     "@storybook/react-vite": "^7.1.0-alpha.34",
@@ -76,15 +77,21 @@
     "@types/node": "^18.15.0",
     "@types/pluralize": "^0.0.29",
     "@types/react": "^18.0.34",
+    "@typescript-eslint/eslint-plugin": "^5.59.11",
+    "@typescript-eslint/parser": "^5.59.11",
     "@vitejs/plugin-react": "^3.1.0",
     "auto": "^10.3.0",
     "boxen": "^5.0.1",
     "dedent": "^0.7.0",
+    "eslint": "^8.42.0",
+    "eslint-plugin-jest": "^27.2.1",
+    "eslint-plugin-simple-import-sort": "^10.0.0",
     "graphql": "^16.6.0",
+    "jest": "^29.5.0",
     "msw": "^1.2.1",
     "msw-storybook-addon": "^1.8.0",
     "npm-run-all": "^4.1.5",
-    "prettier": "^2.3.1",
+    "prettier": "^2.8.8",
     "prompts": "^2.4.2",
     "prop-types": "^15.8.1",
     "react": "^18.0.0",
@@ -142,6 +149,6 @@
       "preact",
       "react-native"
     ],
-    "icon": "https://user-images.githubusercontent.com/321738/63501763-88dbf600-c4cc-11e9-96cd-94adadc2fd72.png"
+    "icon": "https://user-images.githubusercontent.com/341738/63501763-88dbf600-c4cc-11e9-96cd-94adadc2fd72.png"
   }
 }