chore: client side fixes (#399)

apps/telegram-game/auto-imports.d.ts

@@ -9,6 +9,8 @@ declare global {
   const EffectScope: typeof import('vue')['EffectScope']
   const Icon: typeof import('@iconify/vue')['Icon']
   const _useCharacter: typeof import('./src/composables/useCharacter')['_useCharacter']
+  const _useGame: typeof import('./src/utils/gameClient')['_useGame']
+  const _useGameClient: typeof import('./src/composables/useGameClient')['_useGameClient']
   const addon: typeof import('./src/utils/gameClient')['addon']
   const computed: typeof import('vue')['computed']
   const createApp: typeof import('vue')['createApp']
@@ -70,6 +72,8 @@ declare global {
   const useConfetti: typeof import('./src/composables/useConfetti')['useConfetti']
   const useCssModule: typeof import('vue')['useCssModule']
   const useCssVars: typeof import('vue')['useCssVars']
+  const useGame: typeof import('./src/utils/gameClient')['useGame']
+  const useGameClient: typeof import('./src/composables/useGameClient')['useGameClient']
   const useId: typeof import('vue')['useId']
   const useInvoice: typeof import('./src/composables/useInvoice')['useInvoice']
   const useLea: typeof import('./src/composables/useLeaderboard')['useLea']

apps/telegram-game/src/components/Game.vue

@@ -28,6 +28,7 @@ import type { BaseGameAddon } from '@chat-game/game'
 import { initData } from '@telegram-apps/sdk-vue'
 import { gameClient, roomConnected } from '../utils/gameClient'
 
+const { refreshCharacter } = useCharacter()
 const { hmbanan666 } = useRoom()
 const { profile } = useTelegramProfile()
 
@@ -45,6 +46,10 @@ onMounted(async () => {
   await game.value.init(data.id.toString())
   canvas.value?.appendChild(game.value.app.canvas)
 
+  game.value.updateUI = () => {
+    refreshCharacter()
+  }
+
   return () => game.value.destroy()
 })
 

apps/telegram-game/src/components/GameCharacterProgression.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="flex flex-row gap-2">
     <div class="z-10 relative w-16 h-16 flex flex-col justify-center items-center bg-gradient-to-br from-orange-300 to-orange-500 rounded-2xl">
-      <Image :src="character?.character.codename ? `units/${character?.character.codename}/head.png` : 'units/santa/head.png'" class="p-3 h-16 w-16" />
+      <Image :src="character?.character.codename ? `units/${character?.character.codename}/head.png` : 'units/telegramo/head.png'" class="p-1.5 h-16 w-16" />
       <div class="absolute -bottom-1 -right-3 px-1 w-fit min-w-6 bg-orange-50 text-orange-600 text-base font-semibold text-center rounded-full">
         {{ character?.level ?? 1 }}
       </div>

apps/telegram-game/src/composables/useCharacter.ts

@@ -1,5 +1,4 @@
 import type { Character, CharacterEdition, CharacterLevel } from '@chat-game/types'
-import { createSharedComposable } from '@vueuse/core'
 import { useApiFetch } from './useTelegramProfile'
 
 type CharacterEditionData = CharacterEdition & {
@@ -9,10 +8,8 @@ type CharacterEditionData = CharacterEdition & {
   xpToNextLevel: number | null
 }
 
-export function _useCharacter() {
-  const { data, execute: refreshCharacter } = useApiFetch('/character/active').get().json<CharacterEditionData>()
+const { data, execute: refreshCharacter } = useApiFetch('/character/active').get().json<CharacterEditionData>()
 
+export function useCharacter() {
   return { character: data, refreshCharacter }
 }
-
-export const useCharacter = createSharedComposable(_useCharacter)

apps/telegram-game/src/utils/gameClient.ts

@@ -1,13 +1,7 @@
 import { BaseGameAddon } from '@chat-game/game'
 
-const { refreshCharacter } = useCharacter()
-
-function updateUI() {
-  refreshCharacter()
-}
-
 const websocketUrl = 'wss://chatgame.space/api/websocket'
-const gameClient = new BaseGameAddon({ websocketUrl, client: 'TELEGRAM_CLIENT', updateUI })
+const gameClient = new BaseGameAddon({ websocketUrl, client: 'TELEGRAM_CLIENT' })
 
 const roomConnected = ref<string>()
 

packages/game/src/lib/baseGameAddon.ts

@@ -22,7 +22,7 @@ import { BaseWebSocketService } from './services/baseWebSocketService'
 interface BaseGameAddonOptions {
   websocketUrl: string
   client: GameAddon['client']
-  updateUI: () => void
+  updateUI?: () => void
 }
 
 export class BaseGameAddon extends Container implements GameAddon {
@@ -61,7 +61,7 @@ export class BaseGameAddon extends Container implements GameAddon {
     this.id = createId()
     this.client = client
     this.app = new Application()
-    this.updateUI = updateUI
+    this.updateUI = updateUI || (() => {})
 
     this.assetService = new BaseAssetService(this as GameAddon)
     this.playerService = new BasePlayerService(this as GameAddon)

packages/game/src/lib/services/baseWebSocketService.ts

@@ -101,6 +101,7 @@ export class BaseWebSocketService implements WebSocketService {
     }
 
     if (message.type === 'NEW_WAGON_TARGET') {
+      this.addon.updateUI()
       this.addon.wagon?.createFlagAndMove(message.data.x)
     }
 

release.config.mjs

@@ -2,18 +2,7 @@ export default {
   branches: ['main'],
   extends: 'semantic-release-monorepo',
   plugins: [
-    [
-      '@semantic-release/commit-analyzer',
-      {
-        releaseRules: [
-          { breaking: true, release: 'major' },
-          { type: 'feat', release: 'minor' },
-          { type: 'fix', release: 'patch' },
-          { type: 'chore', release: 'patch' },
-          { type: 'refactor', release: 'patch' },
-        ],
-      },
-    ],
+    '@semantic-release/commit-analyzer',
     '@semantic-release/release-notes-generator',
     [
       '@semantic-release/exec',