migration: user list screen

This commit is contained in:
Phan An 2022-04-24 01:04:16 +03:00
parent bf1b62493e
commit fd2ac2dba5
No known key found for this signature in database
GPG key ID: A81E4477F0BB6FDC
3 changed files with 7 additions and 7 deletions

View file

@ -1,4 +1,4 @@
import Component from '@/components/screens/user-list.vue'
import Component from '@/components/screens/UserListScreen.vue'
import UserCard from '@/components/user/UserCard.vue'
import factory from '@/__tests__/factory'
import { userStore } from '@/stores'
@ -6,7 +6,7 @@ import { eventBus } from '@/utils'
import { mock } from '@/__tests__/__helpers__'
import { mount } from '@/__tests__/adapter'
describe('components/screens/user-list', () => {
describe('components/screens/UserListScreen', () => {
afterEach(() => {
jest.resetModules()
jest.clearAllMocks()

View file

@ -42,7 +42,7 @@ import PlaylistScreen from '@/components/screens/PlaylistScreen.vue'
import FavoritesScreen from '@/components/screens/FavoritesScreen.vue'
const RecentlyPlayedScreen = defineAsyncComponent(() => import('@/components/screens/RecentlyPlayedScreen.vue'))
const UserListScreen = defineAsyncComponent(() => import('@/components/screens/user-list.vue'))
const UserListScreen = defineAsyncComponent(() => import('@/components/screens/UserListScreen.vue'))
const AlbumArtOverlay = defineAsyncComponent(() => import('@/components/ui/album-art-overlay.vue'))
const AlbumScreen = defineAsyncComponent(() => import('@/components/screens/AlbumScreen.vue'))
const ArtistScreen = defineAsyncComponent(() => import('@/components/screens/ArtistScreen.vue'))

View file

@ -6,7 +6,7 @@
<template v-slot:controls>
<BtnGroup uppercased v-if="showingControls || !isPhone">
<Btn class="btn-add" @click="showAddUserForm" green data-testid="add-user-btn">
<Btn class="btn-add" data-testid="add-user-btn" green @click="showAddUserForm">
<i class="fa fa-plus"></i>
Add
</Btn>
@ -16,15 +16,15 @@
<div class="main-scroll-wrap">
<div class="users">
<UserCard v-for="user in state.users" :user="user" @editUser="showEditUserForm" :key="user.id"/>
<UserCard v-for="user in users" :key="user.id" :user="user" @editUser="showEditUserForm"/>
</div>
</div>
</section>
</template>
<script lang="ts" setup>
import { defineAsyncComponent, reactive, ref } from 'vue'
import isMobile from 'ismobilejs'
import { defineAsyncComponent, ref, toRef } from 'vue'
import { userStore } from '@/stores'
import { eventBus } from '@/utils'
@ -35,7 +35,7 @@ const Btn = defineAsyncComponent(() => import('@/components/ui/Btn.vue'))
const BtnGroup = defineAsyncComponent(() => import('@/components/ui/BtnGroup.vue'))
const UserCard = defineAsyncComponent(() => import('@/components/user/UserCard.vue'))
const state = reactive(userStore.state)
const users = toRef(userStore.state, 'users')
const isPhone = isMobile.phone
const showingControls = ref(false)