feat: upgrade (#33)

* feat: upgrade

* chore: fix package json

* fix: build

* [autofix.ci] apply automated fixes

* chore: add happy-dom

* fix: test

---------

Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com>

.github/FUNDING.yml

@@ -1,3 +1,3 @@
 # These are supported funding model platforms
 
-github: productdevbook
+github: productdevbook

.github/workflows/autofix.yml

@@ -2,7 +2,7 @@ name: autofix.ci
 on:
   pull_request:
   push:
-    branches: [ "main" ]
+    branches: [main]
 
 permissions:
   contents: read
@@ -21,9 +21,9 @@ jobs:
       - uses: actions/setup-node@v3
         with:
           node-version: 18
-          cache: "pnpm"
+          cache: pnpm
       - run: pnpm install
 
       - name: Fix lint issues
         run: npm run lint:fix
-      - uses: autofix-ci/action@8caa572fd27b0019a65e4c695447089c8d3138b9
+      - uses: autofix-ci/action@8caa572fd27b0019a65e4c695447089c8d3138b9

.github/workflows/ci.yml

@@ -1,4 +1,12 @@
-name: CI
+name: Main
+
+concurrency:
+  group: ${{ github.workflow }}-${{ github.ref }}
+  cancel-in-progress: true
+
+permissions:
+  contents: read
+  pull-requests: write
 
 on:
   push:
@@ -10,7 +18,8 @@ on:
       - main
 
 jobs:
-  build-lint:
+  build-test:
+    name: 📚 Main
     runs-on: ${{ matrix.os }}
 
     strategy:
@@ -25,12 +34,26 @@ jobs:
         with:
           node-version: '18'
           cache: pnpm
-            
+
       - name: 📦 Install dependencies
         run: pnpm install --frozen-lockfile
 
-      - name: 🛠 Build
+      - name: 👀 Lint
+        run: pnpm lint
+
+      - name: 🚀 Build
         run: pnpm build
 
-      - name: 💪 Lint
-        run: pnpm lint
+      # - name: 🧪 Test
+      #   run: pnpm test
+      #   env:
+      #     VITE_TEST_DB_URL: ${{ secrets.VITE_TEST_DB_URL }}
+
+      - name: 🧪 Test with coverage
+        run: pnpm coverage
+        env:
+          VITE_TEST_DB_URL: ${{ secrets.VITE_TEST_DB_URL }}
+
+      - name: 📝 Upload coverage
+        if: always()
+        uses: davelosert/vitest-coverage-report-action@v2

.github/workflows/release.yml

@@ -23,4 +23,4 @@ jobs:
 
       - run: npx changelogithub
         env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

.gitignore

@@ -33,9 +33,6 @@ coverage
 *.lcov
 .nyc_output
 
-# VSCode
-.vscode
-
 # Intellij idea
 *.iml
 .idea

.vscode/settings.json

@@ -0,0 +1,5 @@
+{
+  // Enable the ESlint flat config support
+  "eslint.experimental.useFlatConfig": true,
+  "references.preferredLocation": "peek"
+}

README.md

@@ -39,6 +39,7 @@ add Main.ts
 
 ```ts
 import { createChatWoot } from '@productdevbook/chatwoot/vue'
+
 const chatwoot = createChatWoot({
   init: {
     websiteToken: 'b6BejyTTuxF4yPt61ZTZHjdB'

demo/nuxt3/package.json

@@ -7,14 +7,14 @@
     "preview": "nuxt preview",
     "postinstall": "nuxt prepare"
   },
-  "devDependencies": {
-    "nuxt": "^3.7.4"
-  },
   "dependencies": {
     "@productdevbook/chatwoot": "^1.3.0"
   },
+  "devDependencies": {
+    "nuxt": "^3.7.4"
+  },
   "resolutions": {
     "vite": "^4.4.9",
     "vue": "^3.3.4"
   }
-}
+}

demo/vue3/package.json

@@ -1,8 +1,8 @@
 {
   "name": "vue3",
-  "private": true,
-  "version": "0.0.0",
   "type": "module",
+  "version": "0.0.0",
+  "private": true,
   "scripts": {
     "dev": "vite",
     "build": "vue-tsc && vite build",

demo/vue3/tsconfig.json

@@ -1,18 +1,18 @@
 {
   "compilerOptions": {
     "target": "ESNext",
+    "lib": ["ESNext", "DOM"],
+    "jsx": "preserve",
     "useDefineForClassFields": true,
     "module": "ESNext",
     "moduleResolution": "Node",
-    "strict": true,
-    "jsx": "preserve",
     "resolveJsonModule": true,
+    "noEmit": true,
     "isolatedModules": true,
     "esModuleInterop": true,
-    "lib": ["ESNext", "DOM"],
-    "skipLibCheck": true,
-    "noEmit": true
+    "strict": true,
+    "skipLibCheck": true
   },
-  "include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"],
-  "references": [{ "path": "./tsconfig.node.json" }]
+  "references": [{ "path": "./tsconfig.node.json" }],
+  "include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"]
 }

eslint.config.js

@@ -0,0 +1,3 @@
+import antfu from '@antfu/eslint-config'
+
+export default antfu()

package.json

@@ -2,16 +2,15 @@
   "name": "@productdevbook/chatwoot",
   "type": "module",
   "version": "1.3.0",
-  "packageManager": "pnpm@8.7.0",
+  "packageManager": "pnpm@8.8.0",
   "description": "Chatwoot Vue or Nuxt library.",
   "author": "Mehmet - productdevbook <[email protected]>",
   "license": "MIT",
   "funding": "https://github.com/sponsors/productdevbook",
   "homepage": "https://github.com/productdevbookcom/chatwoot",
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/productdevbookcom/chatwoot.git",
-    "directory": "projects/chatwoot/packages/vue"
+    "url": "git+https://github.com/productdevbookcom/chatwoot.git"
   },
   "bugs": {
     "url": "https://github.com/productdevbookcom/chatwoot/issues"
@@ -55,35 +54,44 @@
     "dist"
   ],
   "scripts": {
-    "dev": "pnpm dev:prepare && nuxi dev playground",
-    "build": "pnpm dev:prepare && pnpm nuxt-module-build",
-    "stub": "unbuild --stub",
-    "prepublishOnly": "npm run build",
-    "dev:build": "nuxi build playground",
-    "dev:prepare": "nuxt-module-build --stub && nuxi prepare playground",
-    "lint": "eslint --ext .js,.ts,.tsx,.vue .",
-    "lint:fix": "eslint --ext .js,.ts,.tsx,.vue . --fix",
-    "release": "bumpp --commit --push --tag && npm publish"
+    "dev": "pnpm nuxi dev playground-nuxt",
+    "build": "pnpm dev:prepare && pnpm nuxt-module-build build",
+    "dev:build": "nuxi build playground-nuxt",
+    "dev:prepare": "nuxt-module-build --stub && nuxi prepare playground-nuxt",
+    "play": "pnpm --filter playground-nuxt dev",
+    "play:vue": "pnpm --filter playground-vue dev",
+    "prepublishOnly": "pnpm run build",
+    "release": "pnpm build && bumpp --commit --push --tag && pnpm publish",
+    "lint": "eslint .",
+    "lint:fix": "eslint . --fix",
+    "test": "pnpm dev:prepare && vitest",
+    "test:watch": "pnpm dev:prepare && vitest --watch",
+    "coverage": "vitest run --coverage"
   },
   "peerDependencies": {
-    "vue": "^3.3.4"
+    "vue": ">=3.3.0"
   },
   "dependencies": {
     "@nuxt/kit": "^3.7.4",
     "defu": "^6.1.2"
   },
   "devDependencies": {
-    "@antfu/eslint-config": "^0.43.1",
+    "@antfu/eslint-config": "1.0.0-beta.18",
     "@nuxt/module-builder": "^0.5.2",
     "@nuxt/schema": "^3.7.4",
-    "@types/node": "^18.18.1",
+    "@nuxt/test-utils": "^3.7.4",
+    "@types/node": "^20.8.0",
+    "@vitest/coverage-v8": "^0.34.6",
+    "@vue/test-utils": "^2.4.1",
     "bumpp": "^9.2.0",
     "eslint": "^8.50.0",
+    "happy-dom": "^12.4.0",
     "nuxt": "^3.7.4",
     "tsx": "^3.13.0",
     "typescript": "^5.2.2",
     "unbuild": "^2.0.0",
     "unconfig": "^0.3.10",
+    "vitest": "^0.34.6",
     "vue": "^3.3.4"
   },
   "resolutions": {

playground-nuxt/nuxt.config.ts

@@ -0,0 +1,32 @@
+export default defineNuxtConfig({
+  modules: ['../src/module.ts'],
+  chatwoot: {
+    init: {
+      websiteToken: 'b6BejyTTuxF4yPt61ZTZHjdB',
+    },
+    settings: {
+      locale: 'en',
+      position: 'left',
+      launcherTitle: 'Hello Chat',
+    },
+  },
+  typescript: {
+    tsConfig: {
+      include: [
+        '../../tests/**/*.ts',
+        '../../*.ts',
+        '../../src/**/*.ts',
+      ],
+      compilerOptions: {
+        paths: {
+          '~/vue/*': [
+            '../playground-vue/*',
+          ],
+          '~/vue': [
+            '../playground-vue',
+          ],
+        },
+      },
+    },
+  },
+})

playground-nuxt/package.json

@@ -0,0 +1,7 @@
+{
+  "private": true,
+  "dependencies": {
+    "@productdevbook/chatwoot": "workspace:*",
+    "nuxt": "^3.7.4"
+  }
+}

playground-vue/.gitignore

@@ -0,0 +1,24 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?

playground-vue/.vscode/extensions.json

@@ -0,0 +1,3 @@
+{
+  "recommendations": ["Vue.volar", "Vue.vscode-typescript-vue-plugin"]
+}

playground-vue/README.md

@@ -0,0 +1,18 @@
+# Vue 3 + TypeScript + Vite
+
+This template should help get you started developing with Vue 3 and TypeScript in Vite. The template uses Vue 3 `<script setup>` SFCs, check out the [script setup docs](https://v3.vuejs.org/api/sfc-script-setup.html#sfc-script-setup) to learn more.
+
+## Recommended IDE Setup
+
+- [VS Code](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur) + [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin).
+
+## Type Support For `.vue` Imports in TS
+
+TypeScript cannot handle type information for `.vue` imports by default, so we replace the `tsc` CLI with `vue-tsc` for type checking. In editors, we need [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin) to make the TypeScript language service aware of `.vue` types.
+
+If the standalone TypeScript plugin doesn't feel fast enough to you, Volar has also implemented a [Take Over Mode](https://github.com/johnsoncodehk/volar/discussions/471#discussioncomment-1361669) that is more performant. You can enable it by the following steps:
+
+1. Disable the built-in TypeScript Extension
+   1. Run `Extensions: Show Built-in Extensions` from VSCode's command palette
+   2. Find `TypeScript and JavaScript Language Features`, right click and select `Disable (Workspace)`
+2. Reload the VSCode window by running `Developer: Reload Window` from the command palette.

playground-vue/index.html

@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Vite + Vue + TS</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="/src/main.ts"></script>
+  </body>
+</html>

playground-vue/package.json

@@ -0,0 +1,21 @@
+{
+  "name": "playground",
+  "type": "module",
+  "version": "0.0.0",
+  "private": true,
+  "scripts": {
+    "dev": "vite",
+    "build": "vue-tsc && vite build",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "vue": "^3.3.4"
+  },
+  "devDependencies": {
+    "@productdevbook/chatwoot": "workspace:*",
+    "@vitejs/plugin-vue": "^4.3.4",
+    "typescript": "^5.2.2",
+    "vite": "^4.4.9",
+    "vue-tsc": "^1.8.15"
+  }
+}

playground-vue/src/App.vue

@@ -0,0 +1,9 @@
+<script setup lang="ts">
+// TODO: change to your package name
+</script>
+
+<template>
+  <div>
+    <Button>Test button</Button>
+  </div>
+</template>