fix: player ci

.github/workflows/review.yml

@@ -34,16 +34,15 @@ jobs:
     - name: install
       run: pnpm install --offline
     - name: lint
-      run: npx eslint 'apps/player/**/*.{js,vue}'
+      run: pnpm lint --scope @podlove/player
+    - name: build
+      run: pnpm build --scope @podlove/player
     - name: integration
       uses: cypress-io/github-action@v5
       with:
         browser: chrome
-        build: npx lerna run integration:build --scope @podlove/player --stream
-        start: npx lerna run integration:server --scope @podlove/player --stream
+        start: pnpm start --scope @podlove/player --stream
         project: ./apps/player
-    - name: build
-      run: npx lerna run build --scope @podlove/player --stream
 
   apps_web-player:
     runs-on: ubuntu-latest

.gitignore

@@ -17,8 +17,8 @@
 !.prettierignore
 !.storybook
 !.drone.yml
-!.drone.yml
 !.browserslistrc
+!.eslintrc.json
 
 coverage
 

apps/player/.eslintrc.json

@@ -0,0 +1,25 @@
+{
+    "env": {
+        "browser": true,
+        "es2021": true
+    },
+    "extends": [
+        "eslint:recommended",
+        "plugin:@typescript-eslint/recommended",
+        "plugin:vue/vue3-essential"
+    ],
+    "parserOptions": {
+        "ecmaVersion": "latest",
+        "parser": "@typescript-eslint/parser",
+        "sourceType": "module"
+    },
+    "plugins": [
+        "@typescript-eslint",
+        "vue"
+    ],
+    "rules": {
+      "@typescript-eslint/no-explicit-any": 0,
+      "@typescript-eslint/no-namespace": 0,
+      "vue/multi-word-component-names": 0
+    }
+}

apps/player/package.json

@@ -7,9 +7,9 @@
   "scripts": {
     "serve": "vite serve",
     "build": "vite build",
-    "postpublish": "npm run clean",
     "integration:ci": "cypress run --browser chrome",
-    "integration:dev": "cypress open --browser chrome"
+    "integration:dev": "cypress open --browser chrome",
+    "lint": "eslint src/**/*.{vue,ts} cypress/**/*.ts"
   },
   "keywords": [],
   "author": "Alexander Heimbuch <[email protected]>",
@@ -25,24 +25,28 @@
     "@podlove/utils": "workspace:*",
     "core-js": "3.15.2",
     "date-fns": "2.16.1",
+    "farbraum": "0.1.4",
     "ramda": "0.29.0",
     "redux": "4.2.0",
     "redux-vuex": "3.0.0",
-    "vue": "3.2.41",
-    "vue-i18n": "9.2.2",
-    "farbraum": "0.1.4",
+    "reselect": "4.1.8",
     "tailwindcss": "3.2.4",
-    "reselect": "4.1.8"
+    "vue": "3.2.41",
+    "vue-i18n": "9.2.2"
   },
   "devDependencies": {
+    "@types/node": "20.8.4",
+    "@typescript-eslint/eslint-plugin": "^6.10.0",
+    "@typescript-eslint/parser": "^6.10.0",
     "@vitejs/plugin-vue": "3.2.0",
+    "cypress": "13.1.0",
     "cypress-vite": "1.4.2",
-    "vite": "4.3.5",
-    "vite-plugin-dynamic-publicpath": "1.1.2",
+    "eslint": "^8.53.0",
+    "eslint-plugin-vue": "^9.18.1",
     "http-server": "14.1.1",
     "typescript": "5.0.4",
-    "cypress": "13.1.0",
-    "@types/node": "20.8.4"
+    "vite": "4.3.5",
+    "vite-plugin-dynamic-publicpath": "1.1.2"
   },
   "exports": {
     ".": {

apps/player/src/components/error/Error.vue

@@ -26,7 +26,7 @@
         class="podlove-player--error--retry-button px-5 py-2 rounded-sm"
         :style="{ ...state.headline }"
         data-test="error--retry"
-        @click.native="retryAction"
+        @click="retryAction"
       >
         {{ t('PLAYER.RETRY') }}
       </button>

apps/player/src/components/publication-date/PublicationDate.vue

@@ -4,16 +4,13 @@
 
 <script lang="ts" setup>
 import { computed } from 'vue';
-import { format } from 'date-fns';
+import { format as dateFormat } from 'date-fns';
 import { mapState } from 'redux-vuex';
 import select from '../../store/selectors/index.js';
 
-const props = defineProps({
-  format: {
-    type: String,
-    default: null
-  }
-});
+const props = defineProps<{
+  format: string;
+}>();
 
 const state = mapState({
   publicationDate: select.episode.publicationDate
@@ -22,7 +19,7 @@ const state = mapState({
 const date = computed(() => {
   const date = new Date(state.publicationDate);
 
-  return props.format ? format(date, props.format) : date.toLocaleDateString();
+  return props.format ? dateFormat(date, props.format) : date.toLocaleDateString();
 });
 </script>
 

apps/player/src/components/tab-share/components/channels/Facebook.vue

@@ -2,8 +2,8 @@
   <facebook-channel
     :link="state.link"
     :filled="hover"
-    @mouseover.native="mouseOver"
-    @mouseleave.native="mouseLeave"
+    @mouseover="mouseOver"
+    @mouseleave="mouseLeave"
   />
 </template>
 

apps/player/src/components/tab-share/components/channels/Mail.vue

@@ -3,8 +3,8 @@
     :text="shareText"
     :subject="shareSubject"
     :filled="hover"
-    @mouseover.native="mouseOver"
-    @mouseleave.native="mouseLeave"
+    @mouseover="mouseOver"
+    @mouseleave="mouseLeave"
   />
 </template>
 

apps/player/src/components/tab-share/components/channels/Pinterest.vue

@@ -6,8 +6,8 @@
     :color="state.color"
     :background="state.background"
     :filled="hover"
-    @mouseover.native="mouseOver"
-    @mouseleave.native="mouseLeave"
+    @mouseover="mouseOver"
+    @mouseleave="mouseLeave"
   />
 </template>
 

apps/player/src/components/tab-share/components/channels/Reddit.vue

@@ -3,8 +3,8 @@
     :text="shareText"
     :link="state.link"
     :filled="hover"
-    @mouseover.native="mouseOver"
-    @mouseleave.native="mouseLeave"
+    @mouseover="mouseOver"
+    @mouseleave="mouseLeave"
   />
 </template>
 

apps/player/src/components/tab-share/components/channels/Twitter.vue

@@ -2,8 +2,8 @@
   <twitter-channel
     :text="shareText"
     :filled="hover"
-    @mouseover.native="mouseOver"
-    @mouseleave.native="mouseLeave"
+    @mouseover="mouseOver"
+    @mouseleave="mouseLeave"
   />
 </template>
 

apps/player/src/components/tab-share/components/channels/WhatsApp.vue

@@ -2,8 +2,8 @@
   <whats-app-channel
     :text="shareText"
     :filled="hover"
-    @mouseover.native="mouseOver"
-    @mouseleave.native="mouseLeave"
+    @mouseover="mouseOver"
+    @mouseleave="mouseLeave"
   />
 </template>
 

apps/player/src/components/tab-trigger/TabTrigger.vue

@@ -27,7 +27,6 @@
 import { computed } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { mapState, injectStore } from 'redux-vuex';
-import { prop } from 'ramda';
 
 import { ActiveTabIcon } from '@podlove/components';
 import { toggleTab } from '@podlove/player-actions/tabs';

apps/player/src/store/state.ts

@@ -1,3 +1,4 @@
+/* eslint @typescript-eslint/no-unused-vars: 0 */
 import { State as runtime } from '@podlove/player-state/runtime';
 import { State as theme } from '@podlove/player-state/theme';
 import { State as episode } from '@podlove/player-state/episode';

package.json

@@ -2,16 +2,14 @@
   "name": "root",
   "private": true,
   "scripts": {
-    "clean": "rm -rf apps/**/dist apps/**/publish packages/**/dist packages/**/publish",
-    "format": "eslint --fix '**/*.{js,jsx,vue}'",
-    "lint": "eslint -f codeframe '**/*.{js,jsx,vue}'",
+    "start": "lerna run dev --scope @podlove/docs --stream",
+    "lint": "lerna run lint",
     "test": "lerna run test",
     "test:dev": "lerna run test:dev",
     "build": "lerna run build",
     "integration:dev": "lerna run integration:dev",
     "update": "lernaupdate",
-    "version": "lerna version --conventional-commits --changelog-preset angular",
-    "start": "lerna run dev --scope @podlove/docs --stream"
+    "version": "lerna version --conventional-commits --changelog-preset angular"
   },
   "devDependencies": {
     "cz-conventional-changelog": "3.3.0",