refactor duplicate code

This commit is contained in:
Gauthier Roebroeck 2026-01-21 17:14:23 +08:00
parent 0937060c53
commit 1be451f0f5
3 changed files with 61 additions and 66 deletions

View file

@ -58,6 +58,7 @@ declare module 'vue' {
LayoutAppDrawerMenuHistory: typeof import('./components/layout/app/drawer/menu/History.vue')['default']
LayoutAppDrawerMenuImport: typeof import('./components/layout/app/drawer/menu/Import.vue')['default']
LayoutAppDrawerMenuLibraries: typeof import('./components/layout/app/drawer/menu/Libraries.vue')['default']
LayoutAppDrawerMenuLibraryItem: typeof import('./components/layout/app/drawer/menu/LibraryItem.vue')['default']
LayoutAppDrawerMenuLogout: typeof import('./components/layout/app/drawer/menu/Logout.vue')['default']
LayoutAppDrawerMenuMedia: typeof import('./components/layout/app/drawer/menu/Media.vue')['default']
LayoutAppDrawerMenuServer: typeof import('./components/layout/app/drawer/menu/Server.vue')['default']

View file

@ -44,41 +44,11 @@
</template>
</v-list-item>
<v-list-item
<LayoutAppDrawerMenuLibraryItem
v-for="library in pinned"
:key="library.id"
:title="library.name"
:to="`/libraries/${library.id}`"
prepend-icon="blank"
>
<template
v-if="library.unavailable"
#subtitle
>
<span class="text-error">{{ unavailableMessage }}</span>
</template>
<template #append>
<v-icon-btn
v-if="isAdmin"
:id="`${id}${library.id}`"
icon="i-mdi:dots-vertical"
variant="text"
:aria-label="
$formatMessage({
description: 'Library menu button: aria label',
defaultMessage: 'library menu',
id: '3gimvl',
})
"
@click.prevent
/>
<LibraryMenuLibrary
:activator-id="`#${id}${library.id}`"
:library="library"
/>
</template>
</v-list-item>
:library="library"
/>
<v-list-group
v-if="unpinned.length > 0"
@ -98,41 +68,11 @@
/>
</template>
<v-list-item
<LayoutAppDrawerMenuLibraryItem
v-for="library in unpinned"
:key="library.id"
:title="library.name"
:to="`/libraries/${library.id}`"
prepend-icon="blank"
>
<template
v-if="library.unavailable"
#subtitle
>
<span class="text-error">{{ unavailableMessage }}</span>
</template>
<template #append>
<v-icon-btn
v-if="isAdmin"
:id="`ID01KC5QH18T79WTFFJWJ6ES4SFE${library.id}`"
icon="i-mdi:dots-vertical"
variant="text"
:aria-label="
$formatMessage({
description: 'Library menu button: aria label',
defaultMessage: 'library menu',
id: '3gimvl',
})
"
@click.prevent
/>
<LibraryMenuLibrary
:activator-id="`#ID01KC5QH18T79WTFFJWJ6ES4SFE${library.id}`"
:library="library"
/>
</template>
</v-list-item>
:library="library"
/>
</v-list-group>
</template>

View file

@ -0,0 +1,54 @@
<template>
<v-list-item
:title="library.name"
:to="`/libraries/${library.id}`"
prepend-icon="blank"
>
<template
v-if="library.unavailable"
#subtitle
>
<span class="text-error">{{
$formatMessage({
description: 'Library list item subtitle: unavailable',
defaultMessage: 'Unavailable',
id: '5rziSG',
})
}}</span>
</template>
<template #append>
<v-icon-btn
v-if="isAdmin"
:id="`${id}${library.id}`"
icon="i-mdi:dots-vertical"
variant="text"
:aria-label="
$formatMessage({
description: 'Library menu button: aria label',
defaultMessage: 'library menu',
id: '3gimvl',
})
"
@click.prevent
/>
<LibraryMenuLibrary
:activator-id="`#${id}${library.id}`"
:library="library"
/>
</template>
</v-list-item>
</template>
<script setup lang="ts">
import { useCurrentUser } from '@/colada/users'
import type { components } from '@/generated/openapi/komga'
defineProps<{
library: components['schemas']['LibraryDto']
}>()
const { isAdmin } = useCurrentUser()
const id = useId()
</script>