import { defineStore } from 'pinia'
import { computed, reactive } from 'vue'

export const useUserStore = defineStore('user', () => {
  const state = reactive({
    userId: null as number | null,
    nickname: '',
    avatarUrl: '',
    role: '',
    authStatus: '',
    isLoggedIn: false,
  })

  const isAuthenticated = computed(() => state.authStatus === 'AUTHENTICATED')
  const isAdmin = computed(() => state.role === 'ADMIN')

  function login(user: {
    id: number
    nickname: string
    avatarUrl?: string
    role: string
    authStatus: string
  }) {
    state.userId = user.id
    state.nickname = user.nickname
    state.avatarUrl = user.avatarUrl ?? ''
    state.role = user.role
    state.authStatus = user.authStatus
    state.isLoggedIn = true
  }

  function logout() {
    state.userId = null
    state.nickname = ''
    state.avatarUrl = ''
    state.role = ''
    state.authStatus = ''
    state.isLoggedIn = false
  }

  function updateProfile(profile: { nickname?: string; avatarUrl?: string }) {
    if (profile.nickname !== undefined) state.nickname = profile.nickname
    if (profile.avatarUrl !== undefined) state.avatarUrl = profile.avatarUrl
  }

  return {
    state,
    isAuthenticated,
    isAdmin,
    login,
    logout,
    updateProfile,
  }
})