Format project

src/components/ImageWithFallback.vue

@@ -8,7 +8,7 @@ interface Props {
 }
 
 const props = withDefaults(defineProps<Props>(), {
-  size: 'w300'
+  size: 'w300',
 })
 
 const imageLoadFailed = ref(false)

src/components/LoadingSpinner.vue

@@ -6,12 +6,10 @@ interface Props {
 
 const props = withDefaults(defineProps<Props>(), {
   size: 'md',
-  color: 'primary'
+  color: 'primary',
 })
 </script>
 
 <template>
-  <span 
-    :class="`loading loading-ring loading-${props.size} text-${props.color}`"
-  ></span>
+  <span :class="`loading loading-ring loading-${props.size} text-${props.color}`"></span>
 </template>

src/components/MediaDetails.vue

@@ -39,11 +39,7 @@ const alreadyAdded = computed(() =>
   >
     <!-- Poster -->
     <ImageWithFallback
-      :src="
-        type === 'movie'
-          ? props.movie!.PosterPath
-          : props.tvSeries!.PosterPath
-      "
+      :src="type === 'movie' ? props.movie!.PosterPath : props.tvSeries!.PosterPath"
       alt="Poster"
       size="w500"
       class="shrink-0 w-full max-w-sm rounded-lg shadow-lg transform transition-transform duration-500 hover:scale-105"

src/components/MediaList.vue

@@ -10,10 +10,10 @@ const props = defineProps<{
 }>()
 
 const emit = defineEmits<{
-  (e: 'loaded', id: string): void; 
-  (e: 'loadMore'): void;
-  (e: 'add-media', media: MediaType): void;
-  (e: 'remove-media', mediaId: number): void;
+  (e: 'loaded', id: string): void
+  (e: 'loadMore'): void
+  (e: 'add-media', media: MediaType): void
+  (e: 'remove-media', mediaId: number): void
 }>()
 </script>
 

src/components/MediaTypeBadge.vue

@@ -5,7 +5,7 @@ interface Props {
 }
 
 const props = withDefaults(defineProps<Props>(), {
-  type: 'primary'
+  type: 'primary',
 })
 </script>
 

src/lib/api.ts

@@ -7,7 +7,7 @@ import { mapTvSeriesDetails } from '@/types/TvSeriesMap'
 import axios from 'axios'
 
 const TMDB_READ_API_KEY =
-  'eyJhbGciOiJIUzI1NiJ9.eyJhdWQiOiIzZjY3MDNmM2UyYTBiMmI0MGZlNGZiYjNlMTU0NjI0NCIsIm5iZiI6MTc2MDU3NDcwNi45MjQsInN1YiI6IjY4ZjAzY2YyNGZmNGM0NjI1NmM3N2EyNyIsInNjb3BlcyI6WyJhcGlfcmVhZCJdLCJ2ZXJzaW9uIjoxfQ.HHReb_7Oue_o1wkgH2mmbCgdMJ8buFfRdCtwQqj_1Us' // I know this should not be here and I dont care
+  'eyJhbGciOiJIUzI1NiJ9.eyJhdWQiOiIzZjY3MDNmM2UyYTBiMmI0MGZlNGZiYjNlMTU0NjI0NCIsIm5iZiI6MTc2MDU3NDcwNi45MjQsInN1YiI6IjY4ZjAzY2YyNGZmNGM0NjI1NmM3N2EyNyIsInNjb3BlcyI6WyJhcGlfcmVhZCJdLCJ2ZXJzaW9uIjoxfQ.HHReb_7Oue_o1wkgH2mmbCgdMJ8buFfRdCtwQqj_1Us' // This is a read only key and I dont see the need for hiding it, ONLY IN THIS PARTICULAR CASE
 
 const instance = axios.create({
   baseURL: 'https://api.themoviedb.org/3',