setup ci

.eslintrc.cjs

@@ -6,18 +6,23 @@ module.exports = {
     "airbnb-typescript",
     "airbnb/hooks",
     "plugin:react/recommended",
-    'eslint:recommended',
-    'plugin:@typescript-eslint/recommended',
-    'plugin:react-hooks/recommended',
-    'plugin:prettier/recommended'
+    "eslint:recommended",
+    "plugin:@typescript-eslint/recommended",
+    "plugin:react-hooks/recommended",
+    "plugin:prettier/recommended",
   ],
-  ignorePatterns: ['dist', '.eslintrc.cjs'],
-  parser: '@typescript-eslint/parser',
-  plugins: ['react-refresh', 'react', 'prettier'],
+  ignorePatterns: ["dist", ".eslintrc.cjs"],
+  parser: "@typescript-eslint/parser",
+  plugins: ["react-refresh", "react", "prettier"],
   rules: {
-    'react-refresh/only-export-components': [
-      'warn',
+    "react-refresh/only-export-components": [
+      "warn",
       { allowConstantExport: true },
     ],
   },
-}
+  settings: {
+    react: {
+      version: "detect",
+    },
+  },
+};

.github/workflows/ci.yml

@@ -0,0 +1,40 @@
+name: on-chain-platform-build
+
+on: [push, pull_request]
+
+jobs:
+  test:
+    strategy:
+      matrix:
+        platform: [ubuntu-latest]
+        node: ["18", "17"]
+    name: test/node ${{ matrix.node }}/${{ matrix.platform }}
+    runs-on: ${{ matrix.platform }}
+    steps:
+      - uses: actions/checkout@v3
+      - uses: actions/setup-node@v3
+        with:
+          node-version: ${{ matrix.node }}
+          cache: "npm"
+      - run: npm install
+      - run: npm run lint
+      - run: npm run test
+      - run: npm run build
+
+  coverage:
+    needs: [test]
+    name: coverage
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+      - uses: actions/setup-node@v3
+        with:
+          node-version: "18"
+          cache: "npm"
+      - run: npm ci
+      - run: npm run build
+    #   - uses: paambaati/[email protected]
+    # env:
+    #   CC_TEST_REPORTER_ID: ${{ secrets.CC_TEST_REPORTER_ID }}
+    # with:
+    #   coverageCommand: npm run coverage

README.md

@@ -17,12 +17,12 @@ If you are developing a production application, we recommend updating the config
 export default {
   // other rules...
   parserOptions: {
-    ecmaVersion: 'latest',
-    sourceType: 'module',
-    project: ['./tsconfig.json', './tsconfig.node.json'],
+    ecmaVersion: "latest",
+    sourceType: "module",
+    project: ["./tsconfig.json", "./tsconfig.node.json"],
     tsconfigRootDir: __dirname,
   },
-}
+};
 ```
 
 - Replace `plugin:@typescript-eslint/recommended` to `plugin:@typescript-eslint/recommended-type-checked` or `plugin:@typescript-eslint/strict-type-checked`

eslint.config.js

@@ -3,12 +3,11 @@ import pluginJs from "@eslint/js";
 import tseslint from "typescript-eslint";
 import pluginReactConfig from "eslint-plugin-react/configs/recommended.js";
 
-
 export default [
   { files: ["**/*.{js,mjs,cjs,ts,jsx,tsx}"] },
   { languageOptions: { parserOptions: { ecmaFeatures: { jsx: true } } } },
   { languageOptions: { globals: globals.browser } },
   pluginJs.configs.recommended,
   ...tseslint.configs.recommended,
   pluginReactConfig,
-];
+];

lint-staged.config.js

@@ -1,5 +1,5 @@
 export default {
-    '**/*.{js,jsx,ts,tsx}': ['eslint --fix'],
-    '**/*.{md,json}': ['prettier --write'],
-    '**/*.{css,scss}': ['prettier --write'],
-};
+  "**/*.{js,jsx,ts,tsx}": ["eslint --fix"],
+  "**/*.{md,json}": ["prettier --write"],
+  "**/*.{css,scss}": ["prettier --write"],
+};

package.json

@@ -7,7 +7,7 @@
     "dev": "vite",
     "build": "tsc -b && vite build",
     "format": "prettier --write ./src",
-    "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
+    "lint": "eslint './src/**/*.{ts,tsx}' --report-unused-disable-directives --max-warnings 0 && prettier --write .",
     "lint:fix": "eslint src --fix && pnpm format",
     "lint:strict": "eslint --max-warnings=0 src",
     "preview": "vite preview",

postcss.config.js

@@ -3,4 +3,4 @@ export default {
     tailwindcss: {},
     autoprefixer: {},
   },
-}
+};

prettier.cjs

@@ -1,9 +1,9 @@
 /** @type {import("prettier").Config} */
 const config = {
-    trailingComma: "es5",
-    tabWidth: 4,
-    semi: false,
-    singleQuote: true,
+  trailingComma: "es5",
+  tabWidth: 4,
+  semi: false,
+  singleQuote: true,
 };
 
-export default config;
+export default config;

src/App.spec.tsx

@@ -0,0 +1,9 @@
+import React from "react";
+import { render, screen } from "@testing-library/react";
+import App from "./App";
+
+test("renders test text", () => {
+    render(<App />);
+    const linkElement = screen.getByText(/test/i);
+    expect(linkElement).toBeInTheDocument();
+});

src/App.tsx

@@ -2,7 +2,6 @@ import React from "react";
 import "./App.css";
 
 function App() {
-
   return <>test</>;
 }
 

tailwind.config.js

@@ -5,5 +5,4 @@ export default {
     extend: {},
   },
   plugins: [],
-}
-
+};

tsconfig.app.json

@@ -16,7 +16,7 @@
     "isolatedModules": true,
     "moduleDetection": "force",
     "noEmit": true,
-    "jsx": "react-jsx",
+    "jsx": "react",
 
     /* Linting */
     "strict": true,