feat(ratings): adds rating addition & removal in store

Author: dvcol

src/components/views/panel/MoviePanel.vue

@@ -1,7 +1,10 @@
 <script setup lang="ts">
 import { deCapitalise } from '@dvcol/common-utils/common/string';
 
-import { TraktRatingType } from '@dvcol/trakt-http-client/models';
+import {
+  TraktRatingType,
+  type TraktSyncRatingValue,
+} from '@dvcol/trakt-http-client/models';
 import { NFlex, NSkeleton } from 'naive-ui';
 import { computed, onMounted, toRefs, watch } from 'vue';
 
@@ -256,7 +259,8 @@ const onCheckin = async (cancel: boolean) => {
 
 const { openTab } = useLinksStore();
 
-const { loadRatings, getRatings, getLoading } = useRatingsStore();
+const { loadRatings, getRatings, getLoading, addRating, removeRating } =
+  useRatingsStore();
 
 const scoreLoading = computed(() => getLoading(TraktRatingType.Movies));
 
@@ -274,6 +278,18 @@ const ratingUrl = computed(() => {
   });
 });
 
+const onScoreEdit = async (_score: TraktSyncRatingValue) => {
+  if (!movie.value?.ids?.trakt) return;
+  return (_score ? addRating : removeRating)(TraktRatingType.Movies, {
+    movies: [
+      {
+        ids: movie.value.ids,
+        rating: _score,
+      },
+    ],
+  });
+};
+
 onMounted(() => {
   watch(
     movieId,
@@ -324,6 +340,7 @@ onMounted(() => {
       :loading-score="scoreLoading"
       :loading-rating="movieLoading"
       :url="ratingUrl"
+      @on-score-edit="onScoreEdit"
     >
       <PanelPoster :tmdb="movie?.ids.tmdb" mode="movie" />
     </PanelStatistics>

src/components/views/panel/PanelScore.vue

@@ -2,6 +2,8 @@
 import { NFlex, NSkeleton } from 'naive-ui';
 import { computed, ref, toRefs } from 'vue';
 
+import type { TraktSyncRatingValue } from '@dvcol/trakt-http-client/models';
+
 import ProgressNumber from '~/components/common/numbers/ProgressNumber.vue';
 
 import TextField from '~/components/common/typography/TextField.vue';
@@ -31,7 +33,7 @@ const props = defineProps({
 });
 
 const emit = defineEmits<{
-  (e: 'onEdit', progress: number): void;
+  (e: 'onEdit', progress: TraktSyncRatingValue): void;
 }>();
 
 const i18n = useI18n('panel', 'ratings');
@@ -51,7 +53,8 @@ const _scoreLabel = computed(() => {
 });
 
 const transformProgress = (progress: number) => Math.round(progress / 10) * 10;
-const onEdit = (_progress: number) => emit('onEdit', _progress);
+const onEdit = (_progress: number) =>
+  emit('onEdit', (_progress / 10) as TraktSyncRatingValue);
 
 const containerRef = ref<InstanceType<typeof TextField>>();
 </script>

src/components/views/panel/PanelStatistics.vue

@@ -1,6 +1,8 @@
 <script setup lang="ts">
 import { NFlex } from 'naive-ui';
 
+import type { TraktSyncRatingValue } from '@dvcol/trakt-http-client/models';
+
 import PanelRating from '~/components/views/panel/PanelRating.vue';
 import PanelScore from '~/components/views/panel/PanelScore.vue';
 import { useExtensionSettingsStoreRefs } from '~/stores/settings/extension.store';
@@ -33,12 +35,12 @@ defineProps({
 });
 
 const emit = defineEmits<{
-  (e: 'onScoreEdit', progress: number): void;
+  (e: 'onScoreEdit', progress: TraktSyncRatingValue): void;
 }>();
 
 const { enableRatings } = useExtensionSettingsStoreRefs();
 
-const onScoreEdit = (progress: number) => emit('onScoreEdit', progress);
+const onScoreEdit = (progress: TraktSyncRatingValue) => emit('onScoreEdit', progress);
 </script>
 
 <template>

src/components/views/panel/ShowPanel.vue

@@ -1,6 +1,10 @@
 <script setup lang="ts">
 import { deCapitalise } from '@dvcol/common-utils/common/string';
-import { TraktRatingType, type TraktRatingTypes } from '@dvcol/trakt-http-client/models';
+import {
+  TraktRatingType,
+  type TraktRatingTypes,
+  type TraktSyncRatingValue,
+} from '@dvcol/trakt-http-client/models';
 import { NFlex, NSkeleton } from 'naive-ui';
 
 import { computed, onMounted, toRefs, watch } from 'vue';
@@ -352,7 +356,8 @@ const onCheckin = async (cancel: boolean) => {
   await fetchShowProgress(showId.value, { force: true });
 };
 
-const { loadRatings, getRatings, getLoading } = useRatingsStore();
+const { loadRatings, getRatings, getLoading, addRating, removeRating } =
+  useRatingsStore();
 
 const ratingLoading = computed(() => {
   if (panelType.value === 'episode') {
@@ -361,8 +366,8 @@ const ratingLoading = computed(() => {
     return getEpisodesLoading(showId.value, seasonNb.value, episodeNb.value).value;
   }
   if (panelType.value === 'season') {
-    if (!showId?.value || seasonNb.value === undefined) return false;
-    return getSeasonsLoading(showId.value, seasonNb.value).value;
+    if (!showId?.value) return false;
+    return getSeasonsLoading(showId.value).value;
   }
   if (!showId?.value) return false;
   return getShowLoading(showId.value).value;
@@ -427,6 +432,61 @@ const ratingUrl = computed(() => {
   });
 });
 
+const votes = computed(() => {
+  if (panelType.value === 'episode') return episode.value?.votes;
+  if (panelType.value === 'season') return season.value?.votes;
+  return show.value?.votes;
+});
+
+const rating = computed(() => {
+  if (panelType.value === 'episode') return episode.value?.rating;
+  if (panelType.value === 'season') return season.value?.rating;
+  return show.value?.rating;
+});
+
+const onScoreEdit = async (_score: TraktSyncRatingValue) => {
+  if (!show.value?.ids?.trakt) return;
+  const addOrRemove = _score ? addRating : removeRating;
+  if (panelType.value === 'episode') {
+    if (!episode.value?.ids?.trakt) return;
+    return addOrRemove(
+      TraktRatingType.Episodes,
+      {
+        episodes: [
+          {
+            ids: episode.value.ids,
+            rating: _score,
+          },
+        ],
+      },
+      show.value.ids.trakt,
+    );
+  }
+  if (panelType.value === 'season') {
+    if (!season.value?.ids?.trakt) return;
+    return addOrRemove(
+      TraktRatingType.Seasons,
+      {
+        seasons: [
+          {
+            ids: season.value.ids,
+            rating: _score,
+          },
+        ],
+      },
+      show.value.ids.trakt,
+    );
+  }
+  return addOrRemove(TraktRatingType.Shows, {
+    shows: [
+      {
+        ids: show.value.ids,
+        rating: _score,
+      },
+    ],
+  });
+};
+
 onMounted(() => {
   watch(
     [showId, seasonNb, episodeNb],
@@ -459,18 +519,6 @@ onMounted(() => {
   );
 });
 
-const votes = computed(() => {
-  if (panelType.value === 'episode') return episode.value?.votes;
-  if (panelType.value === 'season') return season.value?.votes;
-  return show.value?.votes;
-});
-
-const rating = computed(() => {
-  if (panelType.value === 'episode') return episode.value?.rating;
-  if (panelType.value === 'season') return season.value?.rating;
-  return show.value?.rating;
-});
-
 const { openTab } = useLinksStore();
 </script>
 
@@ -499,6 +547,7 @@ const { openTab } = useLinksStore();
       :url="ratingUrl"
       :loading-score="scoreLoading"
       :loading-rating="ratingLoading"
+      @on-score-edit="onScoreEdit"
     >
       <PanelPoster
         :tmdb="show?.ids.tmdb"

src/i18n/en/common/rating.json

@@ -42,5 +42,21 @@
   "common__rating__not_rated": {
     "message": "Not rated",
     "description": "Rating for a value that has not been rated"
+  },
+  "common__rating__rating_added_success": {
+    "message": "Rating successfully saved",
+    "description": "Success message"
+  },
+  "common__rating__rating_added_error": {
+    "message": "An error occurred while saving the rating",
+    "description": "Error message"
+  },
+  "common__rating__rating_remove_success": {
+    "message": "Rating successfully removed",
+    "description": "Success message"
+  },
+  "common__rating__rating_remove_error": {
+    "message": "An error occurred while removing the rating",
+    "description": "Error message"
   }
 }

src/services/trakt.service.ts

@@ -634,7 +634,9 @@ export class TraktService {
     add: async (query: TraktRatingRequest) => {
       const response = await TraktService.traktClient.sync.ratings.add(query);
       TraktService.traktClient.sync.ratings.get.cached.evict().catch(err => logger.error('Failed to evict ratings cache', { query, err }));
-      return response.json();
+      const { added, not_found } = await response.json();
+      if (Object.values(not_found).some(value => value?.length)) throw not_found;
+      return added;
     },
     remove: async (query: TraktSyncRequest) => {
       const response = await TraktService.traktClient.sync.ratings.remove(query);