Merge pull request #7702 from roiLeo/chore/ci/ui

🔧 libs/ui CI build on push

.github/workflows/build.libs-ui.yml

@@ -0,0 +1,24 @@
+name: Build libs/ui package
+
+on:
+  push:
+    branches: [ main, beta, production, nuxt ]
+    paths:
+      - 'libs/ui/**'
+  pull_request:
+    branches: [ main, beta, production, nuxt ]
+    paths:
+      - 'libs/ui/**'
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+      - uses: actions/setup-node@v3
+        with:
+          node-version: 18
+
+      - name: Install dependencies
+        uses: ./.github/actions/pnpm-install
+      - run: cd libs/ui && pnpm histoire build

libs/ui/histoire.config.ts

@@ -1,7 +1,6 @@
 import { defineConfig } from 'histoire'
 import { HstVue } from '@histoire/plugin-vue'
 import vue from '@vitejs/plugin-vue'
-// import vue from 'vue'
 import { resolve } from 'path'
 
 export default defineConfig({
@@ -14,6 +13,7 @@ export default defineConfig({
       alias: {
         '@': resolve(__dirname, '../../'),
         '~': resolve(__dirname, '../../'),
+        '@google/model-viewer': './__mocks__/model-viewer.js',
       },
     },
   },

libs/ui/package.json

@@ -19,9 +19,10 @@
     "vite": "^4.5.0"
   },
   "dependencies": {
-    "@google/model-viewer": "^1.12.1",
+    "@google/model-viewer": "^3.3.0",
     "@vueuse/core": "^9.13.0",
     "bulma": "0.9.4",
+    "three": "^0.157.0",
     "vue": "^3.3.6",
     "vue-audio-visual": "2.5.0"
   }

libs/ui/src/components/MediaItem/type/ModelMedia.vue

@@ -16,6 +16,7 @@
 
 <script lang="ts" setup>
 import '@google/model-viewer'
+
 defineProps<{
   animationSrc: string
   disableOperation?: boolean

nuxt.config.ts

@@ -10,6 +10,13 @@ export default defineNuxtConfig({
     host: '0.0.0.0',
   },
 
+  vue: {
+    compilerOptions: {
+      // model-viewer from ModelMedia throw warning
+      isCustomElement: (tag) => tag.includes('model-viewer'),
+    },
+  },
+
   nitro: {
     publicAssets: [],
   },