@saooti/octopus-sdk 37.0.6 → 37.0.8

package/src/components/display/podcasts/PodcastList.vue

@@ -4,25 +4,25 @@
     v-model:first="dfirst"
     v-model:rowsPerPage="dsize"
     v-model:isMobile="isMobile"
-    :text-count="showCount && podcasts.length > 1 ? $t('Number podcasts', { nb: totalCount }) + sortText : undefined"
+    :text-count="
+      showCount && podcasts.length > 1
+        ? $t('Number podcasts', { nb: totalCount }) + sortText
+        : undefined
+    "
     :total-count="totalCount"
     :loading="loading"
-    :loading-text="loading?$t('Loading podcasts ...'):undefined"
-    :error-text="!loading && !podcasts.length?$t(`No podcast match your query`):undefined"
+    :loading-text="loading ? $t('Loading podcasts ...') : undefined"
+    :error-text="
+      !loading && !podcasts.length
+        ? $t(`No podcast match your query`)
+        : undefined
+    "
     :just-size-chosen="justSizeChosen"
   >
     <template #list>
-      <div
-        class="podcast-list"
-      >
-        <template
-          v-for="p in displayArray"
-          :key="p.podcastId"
-        >
-          <PodcastItem
-            v-if="0!==p.podcastId"
-            :podcast="p"
-          />
+      <div class="podcast-list">
+        <template v-for="p in displayArray" :key="p.podcastId">
+          <PodcastItem v-if="0 !== p.podcastId" :podcast="p" />
         </template>
       </div>
     </template>
@@ -30,52 +30,52 @@
 </template>
 
 <script lang="ts">
-import ListPaginate from '../list/ListPaginate.vue';
-import { handle403 } from '../../mixins/handle403';
-import octopusApi from '@saooti/octopus-api';
-import PodcastItem from './PodcastItem.vue';
-import { state } from '../../../stores/ParamSdkStore';
-import { useAuthStore } from '@/stores/AuthStore';
-import { useFilterStore } from '@/stores/FilterStore';
-import { mapState } from 'pinia';
-import { Podcast, emptyPodcastData } from '@/stores/class/general/podcast';
-import { defineComponent } from 'vue'
-import { FetchParam } from '@/stores/class/general/fetchParam';
-import { AxiosError } from 'axios';
+import ListPaginate from "../list/ListPaginate.vue";
+import { handle403 } from "../../mixins/handle403";
+import octopusApi from "@saooti/octopus-api";
+import PodcastItem from "./PodcastItem.vue";
+import { state } from "../../../stores/ParamSdkStore";
+import { useAuthStore } from "@/stores/AuthStore";
+import { useFilterStore } from "@/stores/FilterStore";
+import { mapState } from "pinia";
+import { Podcast, emptyPodcastData } from "@/stores/class/general/podcast";
+import { defineComponent } from "vue";
+import { FetchParam } from "@/stores/class/general/fetchParam";
+import { AxiosError } from "axios";
 export default defineComponent({
-  name: 'PodcastList',
+  name: "PodcastList",
 
   components: {
     PodcastItem,
-    ListPaginate
+    ListPaginate,
   },
 
   mixins: [handle403],
 
   props: {
-    first: { default: 0, type: Number},
-    size: { default: 30, type: Number},
-    organisationId: { default:  () => [], type: Array as ()=> Array<string>},
-    emissionId: { default: undefined, type: Number},
-    iabId: { default: undefined, type: Number},
-    participantId: { default: undefined, type: Number},
-    query: { default: undefined, type: String},
-    monetization: { default: undefined, type: String},
-    popularSort: { default: false, type: Boolean},
-    reload: { default: false, type: Boolean},
-    before: { default: undefined, type: String},
-    after: { default: undefined, type: String},
-    includeHidden: { default: false, type: Boolean},
+    first: { default: 0, type: Number },
+    size: { default: 30, type: Number },
+    organisationId: { default: () => [], type: Array as () => Array<string> },
+    emissionId: { default: undefined, type: Number },
+    iabId: { default: undefined, type: Number },
+    participantId: { default: undefined, type: Number },
+    query: { default: undefined, type: String },
+    monetization: { default: undefined, type: String },
+    popularSort: { default: false, type: Boolean },
+    reload: { default: false, type: Boolean },
+    before: { default: undefined, type: String },
+    after: { default: undefined, type: String },
+    includeHidden: { default: false, type: Boolean },
     showCount: { default: false, type: Boolean },
     displaySortText: { default: true, type: Boolean },
-    sortCriteria: { default: undefined, type: String},
-    notValid: { default: undefined , type: Boolean},
-    rubriqueId: { default: () => [], type: Array as ()=>Array<number> },
-    rubriquageId:{ default: () => [], type: Array as ()=>Array<number> },
-    noRubriquageId: { default: () => [], type: Array as ()=>Array<number> },
-    justSizeChosen:{default: false, type: Boolean}
+    sortCriteria: { default: undefined, type: String },
+    notValid: { default: undefined, type: Boolean },
+    rubriqueId: { default: () => [], type: Array as () => Array<number> },
+    rubriquageId: { default: () => [], type: Array as () => Array<number> },
+    noRubriquageId: { default: () => [], type: Array as () => Array<number> },
+    justSizeChosen: { default: false, type: Boolean },
   },
-  emits: ['fetch', 'emptyList'],
+  emits: ["fetch", "emptyList"],
 
   data() {
     return {
@@ -89,37 +89,44 @@ export default defineComponent({
   },
 
   computed: {
-    ...mapState(useFilterStore, ['filterOrgaId']),
-    ...mapState(useAuthStore, ['authProfile']),
-    displayArray(): Array<Podcast>{
-      if(this.isMobile || this.justSizeChosen){
+    ...mapState(useFilterStore, ["filterOrgaId"]),
+    ...mapState(useAuthStore, ["authProfile"]),
+    displayArray(): Array<Podcast> {
+      if (this.isMobile || this.justSizeChosen) {
         return this.podcasts;
       }
-      return this.podcasts.slice(this.dfirst, Math.min(this.dfirst + this.dsize,this.totalCount));
-		},
+      return this.podcasts.slice(
+        this.dfirst,
+        Math.min(this.dfirst + this.dsize, this.totalCount),
+      );
+    },
     changed(): string {
       return `${this.first}|${this.size}|${this.organisation}|${this.emissionId}|${this.sortCriteria}|${this.sort}
       ${this.iabId}|${this.participantId}|${this.query}|${this.monetization}|${this.popularSort}|
       ${this.rubriqueId}|${this.rubriquageId}|${this.before}|${this.after}|${this.includeHidden}|${this.noRubriquageId}|${this.notValid}`;
     },
     organisation(): Array<string> {
-      if(this.organisationId){
+      if (this.organisationId) {
         return this.organisationId;
       }
       return this.filterOrgaId ? [this.filterOrgaId] : [];
     },
     sort(): string {
-      return this.popularSort? "POPULARITY" : this.sortCriteria??'DATE';
+      return this.popularSort ? "POPULARITY" : this.sortCriteria ?? "DATE";
     },
     sortText(): string {
-      if(!this.displaySortText){
+      if (!this.displaySortText) {
         return "";
       }
       switch (this.sortCriteria) {
-        case 'SCORE':return " "+this.$t('sort by score');
-        case 'DATE':return " "+this.$t('sort by date');
-        case 'NAME':return " "+this.$t('sort by alphabetical');
-        default:return " "+this.$t('sort by date');
+        case "SCORE":
+          return " " + this.$t("sort by score");
+        case "DATE":
+          return " " + this.$t("sort by date");
+        case "NAME":
+          return " " + this.$t("sort by alphabetical");
+        default:
+          return " " + this.$t("sort by date");
       }
     },
   },
@@ -130,20 +137,23 @@ export default defineComponent({
     reload(): void {
       this.reloadList();
     },
-    dsize():void{
+    dsize(): void {
       this.reloadList();
-		},
-		dfirst(): void{
-			if(!this.podcasts[this.dfirst] || 0===this.podcasts[this.dfirst].podcastId){
-				this.fetchContent(false);
-			}
-		},
+    },
+    dfirst(): void {
+      if (
+        !this.podcasts[this.dfirst] ||
+        0 === this.podcasts[this.dfirst].podcastId
+      ) {
+        this.fetchContent(false);
+      }
+    },
   },
   async created() {
     await this.fetchContent(true);
   },
   methods: {
-    reloadList(){
+    reloadList() {
       this.dfirst = 0;
       this.fetchContent(true);
     },
@@ -161,41 +171,62 @@ export default defineComponent({
         sort: this.sort,
         before: this.before,
         after: this.after,
-        noRubriquageId: this.noRubriquageId.length ? this.noRubriquageId : undefined,
+        noRubriquageId: this.noRubriquageId.length
+          ? this.noRubriquageId
+          : undefined,
         rubriqueId: this.rubriqueId.length ? this.rubriqueId : undefined,
         rubriquageId: this.rubriquageId.length ? this.rubriquageId : undefined,
         includeHidden: this.includeHidden,
-        validity: undefined !== this.notValid?!this.notValid: undefined,
-        publisherId:this.notValid && !(state.generalParameters.isProduction as boolean)?this.authProfile.userId:undefined,
-        includeStatus:["READY","PROCESSING"]
+        validity: undefined !== this.notValid ? !this.notValid : undefined,
+        publisherId:
+          this.notValid && !(state.generalParameters.isProduction as boolean)
+            ? this.authProfile?.userId
+            : undefined,
+        includeStatus: ["READY", "PROCESSING"],
       };
       try {
-        const data =await octopusApi.fetchDataWithParams<{count: number;result:Array<Podcast>;sort: string;}>(0, 'podcast/search',param, true);
+        const data = await octopusApi.fetchDataWithParams<{
+          count: number;
+          result: Array<Podcast>;
+          sort: string;
+        }>(0, "podcast/search", param, true);
         this.afterFetching(reset, data);
       } catch (error) {
-        this.handle403((error as AxiosError));
+        this.handle403(error as AxiosError);
       }
     },
-    afterFetching(reset: boolean, data:  {count: number, result: Array<Podcast>, sort: string}): void {
+    afterFetching(
+      reset: boolean,
+      data: { count: number; result: Array<Podcast>; sort: string },
+    ): void {
       if (reset) {
         this.podcasts.length = 0;
       }
-      if(this.dfirst > this.podcasts.length){
-        for (let i = this.podcasts.length-1, len = this.dfirst + this.dsize; i < len; i++) {
+      if (this.dfirst > this.podcasts.length) {
+        for (
+          let i = this.podcasts.length - 1, len = this.dfirst + this.dsize;
+          i < len;
+          i++
+        ) {
           this.podcasts.push(emptyPodcastData());
         }
       }
-      const responsePodcasts= data.result.filter((p: Podcast|null) => {
+      const responsePodcasts = data.result.filter((p: Podcast | null) => {
         return null !== p;
       });
-      this.podcasts = this.podcasts.slice(0, this.dfirst).concat(responsePodcasts).concat(this.podcasts.slice(this.dfirst+this.dsize, this.podcasts.length));
-      this.$emit('fetch', this.podcasts);
+      this.podcasts = this.podcasts
+        .slice(0, this.dfirst)
+        .concat(responsePodcasts)
+        .concat(
+          this.podcasts.slice(this.dfirst + this.dsize, this.podcasts.length),
+        );
+      this.$emit("fetch", this.podcasts);
       this.totalCount = this.justSizeChosen ? this.size : data.count;
       if (0 === this.podcasts.length) {
-        this.$emit('emptyList');
+        this.$emit("emptyList");
       }
       this.loading = false;
     },
   },
-})
-</script>
+});
+</script>

package/src/components/display/podcasts/PodcastModuleBox.vue

@@ -5,9 +5,9 @@
         <PodcastImage
           :class="[
             isLiveReadyToRecord &&
-              fetchConference &&
-              'null' !== fetchConference &&
-              fetchConference.status
+            fetchConference &&
+            'null' !== fetchConference &&
+            fetchConference.status
               ? fetchConference.status.toLowerCase() + '-shadow'
               : '',
           ]"
@@ -17,30 +17,20 @@
           :playing-podcast="playingPodcast"
           :fetch-conference="fetchConference"
           :is-animator-live="isOctopusAndAnimator"
-          @playPodcast="playPodcast"
+          @play-podcast="playPodcast"
         />
-        <div
-          class="d-flex justify-content-between flex-wrap mb-2"
-        >
-          <div
-            v-if="0 !== date.length"
-            :class="!isLiveReady ? 'me-5' : ''"
-          >
+        <div class="d-flex justify-content-between flex-wrap mb-2">
+          <div v-if="0 !== date.length" :class="!isLiveReady ? 'me-5' : ''">
             {{ date }}
           </div>
           <div>
             {{ duration }}
           </div>
-          <div
-            v-if="isLiveReady"
-            class="text-danger"
-          >
-            {{ $t('Episode record in live') }}
+          <div v-if="isLiveReady" class="text-danger">
+            {{ $t("Episode record in live") }}
           </div>
         </div>
-        <div
-          class="text-uppercase h2 mb-3"
-        >
+        <div class="text-uppercase h2 mb-3">
           {{ podcast.title }}
         </div>
         <!-- eslint-disable vue/no-v-html -->
@@ -55,7 +45,7 @@
             :participants="podcast.animators"
           />
           <div class="mb-1">
-            {{ $t('Emission') + ' : ' }}
+            {{ $t("Emission") + " : " }}
             <router-link
               :to="{
                 name: 'emission',
@@ -68,11 +58,8 @@
               {{ podcast.emission.name }}
             </router-link>
           </div>
-          <div
-            v-if="!isPodcastmaker"
-            class="mb-1"
-          >
-            {{ $t('Producted by : ') }}
+          <div v-if="!isPodcastmaker" class="mb-1">
+            {{ $t("Producted by : ") }}
             <router-link
               :to="{
                 name: 'productor',
@@ -85,17 +72,11 @@
               {{ podcast.organisation.name }}
             </router-link>
           </div>
-          <div
-            v-if="''!==photoCredit"
-            class="mb-1"
-          >
-            {{ $t('Photo credits') + " : "+ photoCredit }}
+          <div v-if="'' !== photoCredit" class="mb-1">
+            {{ $t("Photo credits") + " : " + photoCredit }}
           </div>
-          <div
-            v-if="''!==audioCredit"
-            class="mb-1"
-          >
-            {{ $t('Audio credits') + " : "+ audioCredit }}
+          <div v-if="'' !== audioCredit" class="mb-1">
+            {{ $t("Audio credits") + " : " + audioCredit }}
           </div>
           <a
             v-if="podcast.article"
@@ -105,7 +86,7 @@
             target="_blank"
           >
             <span class="saooti-newspaper me-1" />
-            <div>{{ $t('See associated article') }}</div>
+            <div>{{ $t("See associated article") }}</div>
           </a>
           <ParticipantDescription
             class="mb-1"
@@ -118,61 +99,60 @@
           />
           <div v-if="editRight && !isPodcastmaker">
             <div
-              v-if="podcast.annotations && 'RSS'===podcast.annotations.SOURCE_KIND"
+              v-if="
+                podcast.annotations && 'RSS' === podcast.annotations.SOURCE_KIND
+              "
               class="me-5 text-secondary"
             >
-              {{ $t('From RSS') }}
+              {{ $t("From RSS") }}
             </div>
-            <ErrorMessage
-              v-if="''!==errorMessage"
-              :message="errorMessage"
-            />
+            <ErrorMessage v-if="'' !== errorMessage" :message="errorMessage" />
           </div>
         </div>
       </div>
     </div>
     <RecordingItemButton
-      v-if="
-        !!fetchConference &&
-          isLiveReadyToRecord &&
-          isOctopusAndAnimator
-      "
+      v-if="!!fetchConference && isLiveReadyToRecord && isOctopusAndAnimator"
       :podcast="podcast"
       :live="true"
       :recording="fetchConference"
-      @deleteItem="removeDeleted"
-      @validatePodcast="$emit('updatePodcast', $event)"
+      @delete-item="removeDeleted"
+      @validate-podcast="$emit('updatePodcast', $event)"
     />
     <EditBox
       v-else-if="editRight && isEditBox"
       :podcast="podcast"
       :display-studio-access="isDebriefing"
-      @validatePodcast="$emit('updatePodcast', $event)"
-    />
-    <TagList
-      :tag-list="podcast.tags"
+      @validate-podcast="$emit('updatePodcast', $event)"
     />
+    <TagList :tag-list="podcast.tags" />
   </div>
 </template>
 
 <script lang="ts">
-import PodcastPlayBar from './PodcastPlayBar.vue';
-import PodcastImage from './PodcastImage.vue';
-import ParticipantDescription from './ParticipantDescription.vue';
-import TagList from './TagList.vue';
-import { state } from '../../../stores/ParamSdkStore';
-import dayjs from 'dayjs';
+import PodcastPlayBar from "./PodcastPlayBar.vue";
+import PodcastImage from "./PodcastImage.vue";
+import ParticipantDescription from "./ParticipantDescription.vue";
+import TagList from "./TagList.vue";
+import { state } from "../../../stores/ParamSdkStore";
+import dayjs from "dayjs";
 // @ts-ignore
-import humanizeDuration from 'humanize-duration';
-import displayMethods from '../../mixins/displayMethods';
-import { orgaComputed } from '../../mixins/orgaComputed';
-import { Podcast } from '@/stores/class/general/podcast';
-import { Conference } from '@/stores/class/conference/conference';
+import humanizeDuration from "humanize-duration";
+import displayMethods from "../../mixins/displayMethods";
+import { orgaComputed } from "../../mixins/orgaComputed";
+import { Podcast } from "@/stores/class/general/podcast";
+import { Conference } from "@/stores/class/conference/conference";
 
-import { defineComponent, defineAsyncComponent } from 'vue';
-const ErrorMessage = defineAsyncComponent(() => import('../../misc/ErrorMessage.vue'));
-const RecordingItemButton = defineAsyncComponent(() => import('@/components/display/studio/RecordingItemButton.vue'));
-const EditBox = defineAsyncComponent(() => import('@/components/display/edit/EditBox.vue'));
+import { defineComponent, defineAsyncComponent } from "vue";
+const ErrorMessage = defineAsyncComponent(
+  () => import("../../misc/ErrorMessage.vue"),
+);
+const RecordingItemButton = defineAsyncComponent(
+  () => import("@/components/display/studio/RecordingItemButton.vue"),
+);
+const EditBox = defineAsyncComponent(
+  () => import("@/components/display/edit/EditBox.vue"),
+);
 export default defineComponent({
   name: "PodcastModuleBox",
   components: {
@@ -181,41 +161,41 @@ export default defineComponent({
     TagList,
     ErrorMessage,
     PodcastPlayBar,
-    EditBox, 
-    RecordingItemButton
+    EditBox,
+    RecordingItemButton,
   },
 
-  mixins:[displayMethods, orgaComputed],
+  mixins: [displayMethods, orgaComputed],
 
   props: {
-    playingPodcast: { default: undefined, type: Object as ()=> Podcast},
-    podcast: { default: undefined, type: Object as ()=> Podcast},
-    fetchConference: { default: undefined, type: Object as ()=> Conference},
+    playingPodcast: { default: undefined, type: Object as () => Podcast },
+    podcast: { default: undefined, type: Object as () => Podcast },
+    fetchConference: { default: undefined, type: Object as () => Conference },
   },
 
-  emits: ['playPodcast', 'updatePodcast'],
+  emits: ["playPodcast", "updatePodcast"],
 
   computed: {
-    errorMessage(): string{
-      if(!this.podcast?.availability.visibility){
-        return this.$t('Podcast is not visible for listeners');
+    errorMessage(): string {
+      if (!this.podcast?.availability.visibility) {
+        return this.$t("Podcast is not visible for listeners");
       }
-      if('ERROR' === this.podcast?.processingStatus){
-        return this.$t('Podcast in ERROR, please contact Saooti');
+      if ("ERROR" === this.podcast?.processingStatus) {
+        return this.$t("Podcast in ERROR, please contact Saooti");
       }
-      return this.podcastNotValid ? this.$t('Podcast not validated') : '';
+      return this.podcastNotValid ? this.$t("Podcast not validated") : "";
     },
     isPodcastmaker(): boolean {
-      return (state.generalParameters.podcastmaker as boolean);
+      return state.generalParameters.podcastmaker as boolean;
     },
     date(): string {
-      if (this.podcast && 1970 !== dayjs(this.podcast.pubDate).year()){
-        return dayjs(this.podcast.pubDate).format('D MMMM YYYY');
+      if (this.podcast && 1970 !== dayjs(this.podcast.pubDate).year()) {
+        return dayjs(this.podcast.pubDate).format("D MMMM YYYY");
       }
-      return '';
+      return "";
     },
     duration(): string {
-      if (!this.podcast || this.podcast.duration <= 1) return '';
+      if (!this.podcast || this.podcast.duration <= 1) return "";
       if (this.podcast.duration > 600000) {
         return humanizeDuration(this.podcast.duration, {
           language: this.$i18n.locale,
@@ -230,23 +210,31 @@ export default defineComponent({
       });
     },
     editRight(): boolean {
-      return (true===this.authenticated &&
-        this.myOrganisationId === this.podcast?.organisation.id) ||true===state.generalParameters.isAdmin
+      return (
+        (true === this.authenticated &&
+          this.myOrganisationId === this.podcast?.organisation.id) ||
+        true === state.generalParameters.isAdmin
+      );
     },
     isLiveReadyToRecord(): boolean {
-      return (undefined!==this.podcast && undefined!==this.podcast.conferenceId && 0 !== this.podcast.conferenceId && 'READY_TO_RECORD' === this.podcast.processingStatus);
+      return (
+        undefined !== this.podcast &&
+        undefined !== this.podcast.conferenceId &&
+        0 !== this.podcast.conferenceId &&
+        "READY_TO_RECORD" === this.podcast.processingStatus
+      );
     },
     isLiveReady(): boolean {
       return (
-        undefined!==this.podcast?.conferenceId &&
+        undefined !== this.podcast?.conferenceId &&
         0 !== this.podcast?.conferenceId &&
-        'READY' === this.podcast?.processingStatus
+        "READY" === this.podcast?.processingStatus
       );
     },
     isDebriefing(): boolean {
       return (
-        undefined!==this.fetchConference &&
-        'DEBRIEFING' === this.fetchConference.status
+        undefined !== this.fetchConference &&
+        "DEBRIEFING" === this.fetchConference.status
       );
     },
     isOctopusAndAnimator(): boolean {
@@ -257,29 +245,32 @@ export default defineComponent({
       );
     },
     podcastNotValid(): boolean {
-      return undefined!==this.podcast?.availability && false === this.podcast?.valid;
+      return (
+        undefined !== this.podcast?.availability &&
+        false === this.podcast?.valid
+      );
     },
-    photoCredit():string{
-      return (this.podcast?.annotations?.photoCredit as string) ?? '';
+    photoCredit(): string {
+      return (this.podcast?.annotations?.photoCredit as string) ?? "";
     },
-    audioCredit():string{
-      return (this.podcast?.annotations?.audioCredit as string) ?? '';
+    audioCredit(): string {
+      return (this.podcast?.annotations?.audioCredit as string) ?? "";
     },
-    isEditBox(): boolean{
-      return (state.podcastPage.EditBox as boolean)?? false;
+    isEditBox(): boolean {
+      return (state.podcastPage.EditBox as boolean) ?? false;
     },
   },
   methods: {
     playPodcast(podcast: Podcast): void {
-      this.$emit('playPodcast', podcast);
+      this.$emit("playPodcast", podcast);
     },
     removeDeleted(): void {
       if (window.history.length > 1) {
         this.$router.go(-1);
       } else {
-        this.$router.push('/');
+        this.$router.push("/");
       }
     },
   },
-})
-</script>
+});
+</script>