refactor(shared): migrate validation

Signed-off-by: Fernando Fernández <ferferga@hotmail.com>

frontend/src/components/Buttons/Playback/PlaybackSettingsButton.vue

@@ -94,9 +94,9 @@
 <script setup lang="ts">
 import { computed, shallowRef } from 'vue';
 import { useI18n } from 'vue-i18n';
+import { isObj, isStr, isUndef } from '@jellyfin-vue/shared/validation';
 import { playbackManager } from '@/store/playback-manager';
 import { playerElement } from '@/store/player-element';
-import { isObj, isStr, isUndef } from '@/utils/validation';
 
 const menuModel = defineModel<boolean>();
 const { t } = useI18n();

frontend/src/components/Forms/LoginForm.vue

@@ -8,8 +8,8 @@
         v-if="!user"
         v-model="login.username"
         variant="outlined"
-        autofocus
         hide-details
+        autofocus
         :label="$t('username')"
         :rules="rules" />
       <VTextField

frontend/src/components/Item/Card/GenericItemCard.vue

@@ -48,7 +48,7 @@
 
 <script setup lang="ts">
 import { useAttrs, computed } from 'vue';
-import { isNil } from '@/utils/validation';
+import { isNil } from '@jellyfin-vue/shared/validation';
 import { hasFinePointer } from '@/store';
 import type { CardShapes } from '@/utils/items';
 import JOverlay from '@/components/lib/JOverlay.vue';

frontend/src/components/Item/Card/ItemCard.vue

@@ -77,7 +77,7 @@ import {
 } from '@jellyfin/sdk/lib/generated-client';
 import { computed, shallowRef } from 'vue';
 import { useI18n } from 'vue-i18n';
-import { isNil } from '@/utils/validation';
+import { isNil } from '@jellyfin-vue/shared/validation';
 import {
   CardShapes,
   canPlay,

frontend/src/components/Item/Identify/IdentifyDialog.vue

@@ -96,10 +96,10 @@ import type {
 import { getItemLookupApi } from '@jellyfin/sdk/lib/utils/api/item-lookup-api';
 import { computed, ref, shallowRef, toRaw } from 'vue';
 import { useI18n } from 'vue-i18n';
+import { isArray, isStr } from '@jellyfin-vue/shared/validation';
 import { useConfirmDialog } from '@/composables/use-confirm-dialog';
 import { useSnackbar } from '@/composables/use-snackbar';
 import { remote } from '@/plugins/remote';
-import { isArray, isStr } from '@/utils/validation';
 
 interface IdentifyField {
   key: string;

frontend/src/components/Item/ItemMenu.vue

@@ -73,7 +73,7 @@ import IMdiShuffle from 'virtual:icons/mdi/shuffle';
 import { computed, getCurrentInstance, onMounted, shallowRef, useId, watch } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useRoute, useRouter } from 'vue-router';
-import { isStr } from '@/utils/validation';
+import { isStr } from '@jellyfin-vue/shared/validation';
 import {
   canIdentify,
   canInstantMix,
@@ -366,11 +366,14 @@ const copyDownloadURLAction = {
       if (text) {
         await (isStr(streamUrls)
           ? copyAction(text)
-          : useConfirmDialog(async () => { await copyAction(text); }, {
+          : useConfirmDialog(async () => await copyAction(text),
+            {
               title: t('copyPrompt'),
               text: text,
               confirmText: t('accept')
-            }));
+            }
+          )
+        );
       } else {
         useSnackbar(errorMessage, 'error');
       }

frontend/src/components/Item/MediaDetail/MediaDetailAttr.vue

@@ -15,7 +15,7 @@ import IMdiCheck from 'virtual:icons/mdi/check';
 import IMdiClose from 'virtual:icons/mdi/close';
 import IMdiHelp from 'virtual:icons/mdi/help';
 import { computed } from 'vue';
-import { isBool } from '@/utils/validation';
+import { isBool } from '@jellyfin-vue/shared/validation';
 
 const { name, value } = defineProps<{
   name: string;

frontend/src/components/Item/MediaDetail/MediaDetailContent.vue

@@ -19,7 +19,7 @@ import type {
   TransportStreamTimestamp
 } from '@jellyfin/sdk/lib/generated-client';
 import { useI18n } from 'vue-i18n';
-import { isNumber, isBool } from '@/utils/validation';
+import { isNumber, isBool } from '@jellyfin-vue/shared/validation';
 import { getLocaleName } from '@/utils/i18n';
 import { formatBitRate } from '@/utils/items';
 

frontend/src/components/Item/MediaDetail/MediaDetailDialog.vue

@@ -29,7 +29,7 @@
 
     <VCardText
       v-if="selectedMediaSource"
-      class="pa-3 d-flex flex-column flex-grow-1">
+      class="d-flex flex-column flex-grow-1 pa-3">
       <template v-if="(selectedMediaSource.MediaStreams?.length ?? 0) > 0">
         <VTabs
           v-model="currentTab"
@@ -147,9 +147,9 @@ import type {
 } from '@jellyfin/sdk/lib/generated-client';
 import { computed, ref } from 'vue';
 import { useI18n } from 'vue-i18n';
+import { isArray, isNil, isNumber } from '@jellyfin-vue/shared/validation';
 import { getLocaleName } from '@/utils/i18n';
 import { formatBitRate, formatFileSize } from '@/utils/items';
-import { isArray, isNil, isNumber } from '@/utils/validation';
 
 const { item, mediaSourceIndex } = defineProps<{ item: BaseItemDto; mediaSourceIndex?: number }>();
 

frontend/src/components/Item/Metadata/MetadataEditor.vue

@@ -234,8 +234,8 @@ import { format, formatISO } from 'date-fns';
 import { computed, ref } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { watchImmediate } from '@vueuse/core';
+import { isArray } from '@jellyfin-vue/shared/validation';
 import { getItemImageUrl } from '@/utils/images';
-import { isArray } from '@/utils/validation';
 import { remote } from '@/plugins/remote';
 import { useSnackbar } from '@/composables/use-snackbar';
 import { useDateFns } from '@/composables/use-datefns';

frontend/src/components/Layout/AudioControls.vue

@@ -15,7 +15,7 @@
           <VCol
             cols="9"
             md="3"
-            class="d-flex pa-0 flex-row">
+            class="pa-0 d-flex flex-row">
             <RouterLink :to="'/playback/music'">
               <div class="img uno-h-20 uno-w-20">
                 <BlurhashImage :item="playbackManager.currentItem" />
@@ -28,7 +28,7 @@
                   :to="getItemDetailsLink(playbackManager.currentItem)"
                   custom>
                   <span
-                    class="link text-truncate uno-h-fit"
+                    class="text-truncate link uno-h-fit"
                     @click="navigate">
                     {{ playbackManager.currentItem.Name }}
                   </span>
@@ -109,7 +109,7 @@
 </template>
 
 <script setup lang="ts">
-import { isNil } from '@/utils/validation';
+import { isNil } from '@jellyfin-vue/shared/validation';
 import { playbackManager } from '@/store/playback-manager';
 import { getItemDetailsLink } from '@/utils/items';
 </script>

frontend/src/components/Layout/Backdrop.vue

@@ -19,7 +19,7 @@
 <script lang="ts">
 import { toRef, type MaybeRefOrGetter, shallowRef, onMounted, onBeforeUnmount, computed } from 'vue';
 import { watchImmediate } from '@vueuse/core';
-import { isNil } from '@/utils/validation';
+import { isNil } from '@jellyfin-vue/shared/validation';
 import { prefersNoTransparency } from '@/store';
 
 const DEFAULT_OPACITY = 0.25;

frontend/src/components/Layout/Carousel/Item/ItemsCarouselTitle.vue

@@ -16,7 +16,7 @@
     <RouterLink
       v-else-if="itemLink && titleString"
       data-swiper-parallax="-300"
-      class="link d-block text-truncate text-h4 text-sm-h3 text-sm-h2"
+      class="link text-truncate d-block text-h4 text-sm-h3 text-sm-h2"
       :to="itemLink">
       {{ titleString }}
     </RouterLink>

frontend/src/components/Layout/SettingsPage.vue

@@ -2,7 +2,7 @@
   <VContainer>
     <VRow v-if="$slots.title">
       <VCol>
-        <VRow class="mt-4 mb-2 mx-0 justify-space-between">
+        <VRow class="mb-2 mt-4 mx-0 justify-space-between">
           <h2 class="text-h4">
             <slot name="title" />
           </h2>
@@ -20,8 +20,8 @@
 
 <script setup lang="ts">
 import { useSlots, computed } from 'vue';
+import { isStr } from '@jellyfin-vue/shared/validation';
 import { usePageTitle } from '@/composables/page-title';
-import { isStr } from '@/utils/validation';
 
 const slots = useSlots();
 const pageTitle = computed(() => {

frontend/src/components/Playback/DraggableQueue.vue

@@ -44,7 +44,7 @@
 import type { BaseItemDto } from '@jellyfin/sdk/lib/generated-client';
 import Sortable from 'sortablejs';
 import { onBeforeUnmount, watch, useTemplateRef } from 'vue';
-import { isNumber } from '@/utils/validation';
+import { isNumber } from '@jellyfin-vue/shared/validation';
 import { playbackManager } from '@/store/playback-manager';
 
 let sortable: Sortable | undefined;

frontend/src/components/Playback/PlayerElement.vue

@@ -40,6 +40,7 @@ import Hls, { ErrorTypes, Events, type ErrorData } from 'hls.js';
 import HlsWorkerUrl from 'hls.js/dist/hls.worker.js?url';
 import { computed, nextTick, watch } from 'vue';
 import { useI18n } from 'vue-i18n';
+import { isNil } from '@jellyfin-vue/shared/validation';
 import { useSnackbar } from '@/composables/use-snackbar';
 import {
   mediaElementRef,
@@ -48,7 +49,6 @@ import {
 import { playbackManager } from '@/store/playback-manager';
 import { playerElement, videoContainerRef } from '@/store/player-element';
 import { getImageInfo } from '@/utils/images';
-import { isNil } from '@/utils/validation';
 import { subtitleSettings } from '@/store/client-settings/subtitle-settings';
 
 const { t } = useI18n();

frontend/src/components/Playback/SubtitleTrack.vue

@@ -17,10 +17,10 @@
 
 <script setup lang="ts">
 import { computed, type StyleValue } from 'vue';
+import { isNil } from '@jellyfin-vue/shared/validation';
 import { subtitleSettings } from '@/store/client-settings/subtitle-settings';
 import { DEFAULT_TYPOGRAPHY } from '@/store';
 import { playerElement } from '@/store/player-element';
-import { isNil } from '@/utils/validation';
 import type { ParsedSubtitleTrack, Dialogue } from '@/plugins/workers/generic/subtitles';
 import { playbackManager } from '@/store/playback-manager';
 

frontend/src/components/Wizard/WizardLanguage.vue

@@ -29,7 +29,7 @@ import { getLocalizationApi } from '@jellyfin/sdk/lib/utils/api/localization-api
 import { getStartupApi } from '@jellyfin/sdk/lib/utils/api/startup-api';
 import { onMounted, ref } from 'vue';
 import { useI18n } from 'vue-i18n';
-import { SomeItemSelectedRule } from '@/utils/validation';
+import { SomeItemSelectedRule } from '@jellyfin-vue/shared/validation';
 import { remote } from '@/plugins/remote';
 import { useSnackbar } from '@/composables/use-snackbar';
 

frontend/src/components/Wizard/WizardMetadata.vue

@@ -45,7 +45,7 @@ import { getLocalizationApi } from '@jellyfin/sdk/lib/utils/api/localization-api
 import { getStartupApi } from '@jellyfin/sdk/lib/utils/api/startup-api';
 import { onMounted, ref } from 'vue';
 import { useI18n } from 'vue-i18n';
-import { SomeItemSelectedRule } from '@/utils/validation';
+import { SomeItemSelectedRule } from '@jellyfin-vue/shared/validation';
 import { remote } from '@/plugins/remote';
 import { useSnackbar } from '@/composables/use-snackbar';
 

frontend/src/components/lib/JImg.vue

@@ -52,7 +52,7 @@
  * Given the img at loading is v-show'ed to false (display: none), the load events doesn't trigger either
  */
 import { computed, shallowRef, watch } from 'vue';
-import { isObj } from '@/utils/validation';
+import { isObj } from '@jellyfin-vue/shared/validation';
 import JTransition, { type JTransitionProps } from '@/components/lib/JTransition.vue';
 
 /**

frontend/src/components/lib/JView.vue

@@ -32,13 +32,13 @@
 <script lang="ts">
 import { onErrorCaptured, shallowRef, type Component, watch, computed, provide, useId, ref, type WatchOptions, inject } from 'vue';
 import type { RouteLocationNormalizedGeneric, RouteMeta } from 'vue-router';
+import { isNil } from '@jellyfin-vue/shared/validation';
 import DefaultLayout from '@/layouts/default.vue';
 import FullPageLayout from '@/layouts/fullpage.vue';
 import ServerLayout from '@/layouts/server.vue';
 import { usePausableEffect } from '@/composables/use-pausable-effect';
 import { JView_isRouting } from '@/store/keys';
 import { router } from '@/plugins/router';
-import { isNil } from '@/utils/validation';
 
 /**
  * Return the appropiate layout component according to the route's meta.layout property

frontend/src/components/lib/JVirtual/JVirtual.vue

@@ -42,6 +42,7 @@ import {
   useTemplateRef
 } from 'vue';
 import { wrap } from 'comlink';
+import { isNil, isUndef } from '@jellyfin-vue/shared/validation';
 import {
   getBufferMeta,
   getContentSize,
@@ -53,7 +54,6 @@ import {
 import type { IJVirtualWorker } from './j-virtual.worker';
 import JVirtualWorker from './j-virtual.worker?worker';
 import { vuetify } from '@/plugins/vuetify';
-import { isNil, isUndef } from '@/utils/validation';
 
 /**
  * SHARED STATE ACROSS ALL THE COMPONENT INSTANCES

frontend/src/components/lib/JVirtual/j-virtual.worker.ts

@@ -1,6 +1,6 @@
 import { expose } from 'comlink';
+import { sealed } from '@jellyfin-vue/shared/validation';
 import { getItemOffsetByIndex, type ResizeMeasurement, type BufferMeta, type InternalItem } from './pipeline';
-import { sealed } from '@/utils/validation';
 
 @sealed
 class JVirtualWorker {

frontend/src/composables/apis.ts

@@ -5,13 +5,13 @@ import { deepEqual } from 'fast-equals';
 import { computed, effectScope, getCurrentScope, inject, isRef, shallowRef, toValue, unref, watch, type ComputedRef, type Ref } from 'vue';
 import { until, whenever } from '@vueuse/core';
 import type { Exact, Writable } from 'type-fest';
+import { isArray, isNil } from '@jellyfin-vue/shared/validation';
 import { useLoading } from '@/composables/use-loading';
 import { useSnackbar } from '@/composables/use-snackbar';
 import { i18n } from '@/plugins/i18n';
 import { remote } from '@/plugins/remote';
 import { isConnectedToServer } from '@/store';
 import { apiStore } from '@/store/api';
-import { isArray, isNil } from '@/utils/validation';
 import { JView_isRouting } from '@/store/keys';
 
 /* eslint-disable @typescript-eslint/no-explicit-any */

frontend/src/composables/page-title.ts

@@ -1,7 +1,7 @@
 import { computed, onBeforeUnmount, onMounted, shallowRef, toRef, toValue, type MaybeRefOrGetter } from 'vue';
 import { useTitle as _useTitle, watchImmediate } from '@vueuse/core';
 import type { BaseItemDto } from '@jellyfin/sdk/lib/generated-client';
-import { isNil } from '@/utils/validation';
+import { isNil } from '@jellyfin-vue/shared/validation';
 
 /**
  * This composable handles the page title of the application.

frontend/src/composables/use-datefns.ts

@@ -1,6 +1,6 @@
 import * as datefnslocales from 'virtual:locales/date-fns';
+import { isObj } from '@jellyfin-vue/shared/validation';
 import { i18n } from '@/plugins/i18n';
-import { isObj } from '@/utils/validation';
 
 /* eslint-disable @typescript-eslint/no-explicit-any */
 

frontend/src/pages/genre/[itemId].vue

@@ -55,7 +55,7 @@ import { getItemsApi } from '@jellyfin/sdk/lib/utils/api/items-api';
 import { getUserLibraryApi } from '@jellyfin/sdk/lib/utils/api/user-library-api';
 import { computed } from 'vue';
 import { useRoute } from 'vue-router';
-import { isStr } from '@/utils/validation';
+import { isStr } from '@jellyfin-vue/shared/validation';
 import { useResponsiveClasses } from '@/composables/use-responsive-classes';
 import { useBaseItem } from '@/composables/apis';
 import { useItemPageTitle } from '@/composables/page-title';

frontend/src/pages/index.vue

@@ -40,7 +40,7 @@ meta:
 import type { BaseItemDto } from '@jellyfin/sdk/lib/generated-client';
 import { computed } from 'vue';
 import { useI18n } from 'vue-i18n';
-import { isNil } from '@/utils/validation';
+import { isNil } from '@jellyfin-vue/shared/validation';
 import { CardShapes, fetchIndexPage, getShapeFromCollectionType } from '@/utils/items';
 import { usePageTitle } from '@/composables/page-title';
 

frontend/src/pages/playback/music.vue

@@ -105,9 +105,9 @@ import 'swiper/css/virtual';
 import { A11y, EffectCoverflow, Virtual } from 'swiper/modules';
 import { Swiper, SwiperSlide } from 'swiper/vue';
 import { computed, shallowRef, watchEffect } from 'vue';
+import { isNil } from '@jellyfin-vue/shared/validation';
 import { playbackGuard } from '@/plugins/router/middlewares/playback';
 import { playbackManager } from '@/store/playback-manager';
-import { isNil } from '@/utils/validation';
 import { usePlayback } from '@/composables/use-playback';
 import { useItemBackdrop } from '@/composables/backdrop';
 import { useItemPageTitle } from '@/composables/page-title';

frontend/src/plugins/remote/auth.ts

@@ -7,8 +7,8 @@ import type { UserDto, PublicSystemInfo, BrandingOptions } from '@jellyfin/sdk/l
 import { getSystemApi } from '@jellyfin/sdk/lib/utils/api/system-api';
 import { getBrandingApi } from '@jellyfin/sdk/lib/utils/api/branding-api';
 import { getUserApi } from '@jellyfin/sdk/lib/utils/api/user-api';
+import { isAxiosError, isNil, sealed } from '@jellyfin-vue/shared/validation';
 import SDK, { useOneTimeAPI } from './sdk/sdk-utils';
-import { isAxiosError, isNil, sealed } from '@/utils/validation';
 import { i18n } from '@/plugins/i18n';
 import { useSnackbar } from '@/composables/use-snackbar';
 import { CommonStore } from '@/store/super/common-store';

frontend/src/plugins/remote/axios.ts

@@ -4,10 +4,10 @@
 import axios, {
   type AxiosError
 } from 'axios';
+import { sealed } from '@jellyfin-vue/shared/validation';
 import auth from './auth';
 import { useSnackbar } from '@/composables/use-snackbar';
 import { i18n } from '@/plugins/i18n';
-import { sealed } from '@/utils/validation';
 
 @sealed
 class RemotePluginAxios {

frontend/src/plugins/remote/index.ts

@@ -7,10 +7,10 @@
  * - WebSocket ($remote.socket)
  */
 import type { App } from 'vue';
+import { isNil, sealed } from '@jellyfin-vue/shared/validation';
 import RemotePluginAuthInstance from './auth';
 import RemotePluginSDKInstance from './sdk';
 import RemotePluginSocketInstance from './socket';
-import { isNil, sealed } from '@/utils/validation';
 import { jsonConfig } from '@/utils/external-config';
 
 @sealed

frontend/src/plugins/remote/sdk/index.ts

@@ -4,10 +4,10 @@
  */
 import type { Api } from '@jellyfin/sdk';
 import { watchSyncEffect } from 'vue';
+import { isNil, sealed } from '@jellyfin-vue/shared/validation';
 import RemotePluginAuthInstance from '../auth';
 import RemotePluginAxiosInstance from '../axios';
 import SDK, { useOneTimeAPI } from './sdk-utils';
-import { isNil, sealed } from '@/utils/validation';
 
 @sealed
 class RemotePluginSDK {