Use symfony-ux to create matomo graph

.github/workflows/assets.yml

@@ -16,16 +16,25 @@ jobs:
 
     steps:
       - name: "Checkout"
-        uses: "actions/checkout@v4"
+        uses: "actions/checkout@v3"
 
       - name: "Using Node"
-        uses: "actions/setup-node@v3.8.1"
+        uses: "actions/setup-node@v3.7.0"
 
       - name: "Install dependencies"
-        run: "yarn"
+        run: "yarn --cwd assets"
 
       - name: "Build"
-        run: "yarn build"
+        run: "yarn --cwd assets build"
+
+      - name: "Test"
+        run: "yarn --cwd assets test"
+
+      - name: "Lint"
+        run: "yarn --cwd assets check-lint"
+
+      - name: "Format"
+        run: "yarn --cwd assets check-format"
 
       - name: "Check size"
-        run: "yarn size"
+        run: "yarn --cwd assets size"

.gitignore

@@ -5,7 +5,7 @@ composer.lock
 phpunit.xml
 /.phpunit.cache/
 /build/
-/node_modules/
+/assets/node_modules/
 /vendor/
 !/vendor-bin/tools/composer.lock
 /vendor-bin/tools/vendor/

assets/.babelrc

@@ -0,0 +1,15 @@
+{
+  "presets": [
+    "@babel/env",
+    "@babel/preset-typescript",
+    "minify"
+  ],
+  "plugins": [
+    [
+      "@babel/plugin-transform-typescript",
+      {
+        allowDeclareFields: true
+      }
+    ]
+  ]
+}

assets/.eslintrc.js

@@ -0,0 +1,39 @@
+module.exports = {
+  "parser": "@typescript-eslint/parser",
+  "extends": [
+    "eslint:recommended",
+    "plugin:@typescript-eslint/eslint-recommended",
+    "plugin:@typescript-eslint/recommended",
+    "plugin:import/warnings",
+    "prettier"
+  ],
+  "env": {
+    "browser": true,
+    "es6": true
+  },
+  "plugins": [
+    "@typescript-eslint",
+    "import",
+    "header"
+  ],
+  "rules": {
+    "@typescript-eslint/no-explicit-any": "off",
+    "header/header": [2, "block", [
+      "!",
+      " * (c) Christian Gripp <[email protected]>",
+      " *",
+      " * For the full copyright and license information, please view the LICENSE",
+      " * file that was distributed with this source code.",
+      " "
+    ], 2]
+  },
+  "overrides": [
+    {
+      "files": [
+        "test/*.js"
+      ],
+      "extends": [
+      ]
+    }
+  ]
+};

assets/.prettierrc.yaml

@@ -0,0 +1,4 @@
+printWidth: 120
+trailingComma: "es5"
+tabWidth: 4
+singleQuote: true

assets/.size-limit.json

@@ -0,0 +1,7 @@
+[
+    {
+        "path": "dist/*.js",
+        "gzip": false,
+        "limit": "440 kB"
+    }
+]

assets/.stylelintrc.json

@@ -0,0 +1,7 @@
+{
+    "extends": ["stylelint-config-recommended-scss"],
+    "rules": {
+        "no-descending-specificity": null,
+        "scss/no-global-function-names": null
+    }
+}

assets/package.json

@@ -0,0 +1,68 @@
+{
+    "name": "@nucleos/matomo-bundle",
+    "license": "MIT",
+    "version": "1.0.0",
+    "homepage": "https://nucleos.rocks",
+    "author": "Christian Gripp <[email protected]>",
+    "symfony": {
+        "controllers": {
+            "matomoGraph": {
+                "main": "dist/controller.js",
+                "fetch": "lazy",
+                "enabled": true,
+                "autoimport": []
+            }
+        }
+    },
+    "engines": {
+        "node": ">=14"
+    },
+    "dependencies": {
+        "chart.js": "^4.3.3"
+    },
+    "peerDependencies": {
+        "@hotwired/stimulus": "^3.0.0"
+    },
+    "devDependencies": {
+        "@babel/cli": "^7.22.9",
+        "@babel/core": "^7.22.9",
+        "@babel/eslint-parser": "^7.22.9",
+        "@babel/plugin-transform-typescript": "^7.22.9",
+        "@babel/preset-env": "^7.22.9",
+        "@babel/preset-typescript": "^7.22.5",
+        "@hotwired/stimulus": "^3.2.2",
+        "@size-limit/esbuild": "^9.0.0",
+        "@size-limit/preset-small-lib": "^9.0.0",
+        "@typescript-eslint/eslint-plugin": "^6.2.1",
+        "@typescript-eslint/parser": "^6.2.1",
+        "@symfony/webpack-encore": "^4.2.0",
+        "babel-minify": "^0.5.2",
+        "eslint": "^8.46.0",
+        "eslint-config-prettier": "^9.0.0",
+        "eslint-plugin-header": "^3.1.1",
+        "eslint-plugin-import": "^2.28.0",
+        "eslint-plugin-jest": "^27.2.3",
+        "jest-canvas-mock": "^2.5.2",
+        "prettier": "^3.0.1",
+        "size-limit": "^9.0.0",
+        "typescript": "^5.1.6",
+        "webpack": "^5.72",
+        "webpack-cli": "^5.0.0"
+    },
+    "scripts": {
+        "build": "babel --extensions \".ts,.tsx\" src -d dist && yarn",
+        "watch": "babel --extensions \".ts,.tsx\" src -d dist --watch",
+        "test": "yarn build && jest",
+        "lint": "eslint src test --fix",
+        "format": "prettier {src,test}/**/*.{js,ts,tsx} --write --no-error-on-unmatched-pattern",
+        "check-lint": "eslint src test --no-fix",
+        "check-format": "yarn format --no-write --check",
+        "size": "size-limit"
+    },
+    "jest": {
+        "testRegex": "test/.*\\.test.(j|t)s",
+        "setupFilesAfterEnv": [
+            "./test/setup.js"
+        ]
+    }
+}