feat(panel): support release date

Author: dvcol

src/components/views/panel/MoviePanel.vue

@@ -125,8 +125,16 @@ const onListUpdate = async (value: ListEntity['id'], remove: boolean) => {
   });
 };
 
-const onCollectionUpdate = async (value: PanelButtonsOptions, date?: number) => {
+const releaseDate = computed(() => movie.value?.released);
+
+const onCollectionUpdate = async (
+  value: PanelButtonsOptions,
+  date?: string | number | Date,
+) => {
   if (!movie.value?.ids) return;
+  if (date === undefined && value === PanelButtonsOption.Release) {
+    date = releaseDate.value;
+  }
 
   await addToOrRemoveFromList({
     list: DefaultLists.ShowCollection,
@@ -141,8 +149,14 @@ const onCollectionUpdate = async (value: PanelButtonsOptions, date?: number) =>
   changeMovieCollected(_id, value === PanelButtonsOption.Remove);
 };
 
-const onWatchedUpdate = async (value: PanelButtonsOptions, date?: number) => {
+const onWatchedUpdate = async (
+  value: PanelButtonsOptions,
+  date?: string | number | Date,
+) => {
   if (!movie.value?.ids) return;
+  if (date === undefined && value === PanelButtonsOption.Release) {
+    date = releaseDate.value;
+  }
 
   await addToOrRemoveFromList({
     list: {
@@ -204,6 +218,7 @@ const { openTab } = useExtensionSettingsStore();
       :collected-loading="collectionLoading"
       :active-loading="listLoading"
       :active-lists="activeLists"
+      :has-release="!!releaseDate"
       @on-list-update="onListUpdate"
       @on-collection-update="onCollectionUpdate"
       @on-watched-update="onWatchedUpdate"

src/components/views/panel/MoviePanelButtons.vue

@@ -47,6 +47,10 @@ const props = defineProps({
     type: Boolean,
     required: false,
   },
+  hasRelease: {
+    type: Boolean,
+    required: false,
+  },
 });
 
 const emit = defineEmits<{
@@ -55,7 +59,7 @@ const emit = defineEmits<{
   (e: 'onWatchedUpdate', value: PanelButtonsOptions, date?: number): void;
 }>();
 
-const { watched, collected, activeLoading, activeLists } = toRefs(props);
+const { watched, collected, activeLoading, activeLists, hasRelease } = toRefs(props);
 
 const onListUpdate = (value: ListEntity['id'] | ListEntity['id'][]) => {
   const newList = Array.isArray(value) ? value : [value];
@@ -84,13 +88,19 @@ const root = ref<HTMLDivElement>();
 const { removeOptions, timeOptions } = usePanelButtons();
 
 const watchedOptions = computed(() => {
-  if (watched.value) return removeOptions;
-  return timeOptions;
+  const _options = watched.value ? removeOptions : timeOptions;
+  if (!hasRelease.value) {
+    return _options.filter(option => option.value !== PanelButtonsOption.Release);
+  }
+  return _options;
 });
 
 const collectionOptions = computed(() => {
-  if (collected.value) return removeOptions;
-  return timeOptions;
+  const _options = collected.value ? removeOptions : timeOptions;
+  if (!hasRelease.value) {
+    return _options.filter(option => option.value !== PanelButtonsOption.Release);
+  }
+  return _options;
 });
 
 const { lists, listsLoading } = useListsStoreRefs();

src/components/views/panel/ShowPanel.vue

@@ -227,6 +227,8 @@ const titleUrl = computed(() => {
   });
 });
 
+const releaseDate = computed(() => activeItem.value?.first_aired);
+
 const onListUpdate = async (value: ListEntity['id'], remove: boolean) => {
   if (!panelType.value || !activeItem.value?.ids) return;
   const _list = lists.value.find(list => list.id === value);
@@ -240,8 +242,14 @@ const onListUpdate = async (value: ListEntity['id'], remove: boolean) => {
   });
 };
 
-const onCollectionUpdate = async (value: PanelButtonsOptions, date?: number) => {
+const onCollectionUpdate = async (
+  value: PanelButtonsOptions,
+  date?: string | number | Date,
+) => {
   if (!panelType.value || !activeItem.value?.ids) return;
+  if (date === undefined && value === PanelButtonsOption.Release) {
+    date = releaseDate.value;
+  }
 
   await addToOrRemoveFromList({
     list: DefaultLists.ShowCollection,
@@ -254,8 +262,14 @@ const onCollectionUpdate = async (value: PanelButtonsOptions, date?: number) =>
   await fetchShowCollectionProgress(showId.value, { force: true });
 };
 
-const onWatchedUpdate = async (value: PanelButtonsOptions, date?: number) => {
+const onWatchedUpdate = async (
+  value: PanelButtonsOptions,
+  date?: string | number | Date,
+) => {
   if (!panelType.value || !activeItem.value?.ids) return;
+  if (date === undefined && value === PanelButtonsOption.Release) {
+    date = releaseDate.value;
+  }
 
   await addToOrRemoveFromList({
     list: {
@@ -332,6 +346,7 @@ const { openTab } = useExtensionSettingsStore();
       :collection-loading="collectionLoading"
       :active-loading="listLoading"
       :active-lists="activeLists"
+      :has-release="!!releaseDate"
       @on-list-update="onListUpdate"
       @on-collection-update="onCollectionUpdate"
       @on-watched-update="onWatchedUpdate"

src/components/views/panel/ShowPanelButtons.vue

@@ -58,6 +58,10 @@ const props = defineProps({
     type: Boolean,
     required: false,
   },
+  hasRelease: {
+    type: Boolean,
+    required: false,
+  },
 });
 
 const emit = defineEmits<{
@@ -66,8 +70,14 @@ const emit = defineEmits<{
   (e: 'onWatchedUpdate', value: PanelButtonsOptions, date?: number): void;
 }>();
 
-const { mode, watchedProgress, collectionProgress, activeLoading, activeLists } =
-  toRefs(props);
+const {
+  mode,
+  watchedProgress,
+  collectionProgress,
+  activeLoading,
+  activeLists,
+  hasRelease,
+} = toRefs(props);
 
 const onListUpdate = (value: ListEntity['id'] | ListEntity['id'][]) => {
   const newList = Array.isArray(value) ? value : [value];
@@ -122,19 +132,31 @@ const root = ref<HTMLDivElement>();
 const { removeOptions, mixedOptions, timeOptions } = usePanelButtons();
 
 const watchedOptions = computed(() => {
-  if (watched.value) return removeOptions;
-  if (watchedPercentage.value > 0 && watchedPercentage.value < 100) {
-    return mixedOptions;
+  const _options = [];
+  if (watched.value) _options.push(...removeOptions);
+  else if (watchedPercentage.value > 0 && watchedPercentage.value < 100) {
+    _options.push(...mixedOptions);
+  } else {
+    _options.push(...timeOptions);
   }
-  return timeOptions;
+  if (!hasRelease.value) {
+    return _options.filter(option => option.value !== PanelButtonsOption.Release);
+  }
+  return _options;
 });
 
 const collectionOptions = computed(() => {
-  if (collected.value) return removeOptions;
-  if (collectionPercentage.value > 0 && collectionPercentage.value < 100) {
-    return mixedOptions;
+  const _options = [];
+  if (collected.value) _options.push(...removeOptions);
+  else if (collectionPercentage.value > 0 && collectionPercentage.value < 100) {
+    _options.push(...mixedOptions);
+  } else {
+    _options.push(...timeOptions);
+  }
+  if (!hasRelease.value) {
+    return _options.filter(option => option.value !== PanelButtonsOption.Release);
   }
-  return timeOptions;
+  return _options;
 });
 
 const { lists, listsLoading } = useListsStoreRefs();