@saooti/octopus-sdk 41.9.3 → 41.9.5

package/CHANGELOG.md

@@ -1,5 +1,30 @@
 # CHANGELOG
 
+## 41.9.5 (17/04/2026)
+
+**Fixes**
+
+- **14433** - Correction problème lecture vidéo
+
+## 41.9.4 (16/04/2026)
+
+**Features**
+
+- Ajout fonction de formattage de date dans `useDayjs`
+- Ajout props de configuration pour `SubscribeButtons`
+- Ajout de définition de nouvelles annotations d'émission
+- Ajout de variables CSS pour la configuration de l'aspect du player
+
+**Fixes**
+
+- **14433** - Rétablissement bouton play vidéo
+- **14442** - Correction anomalie calcul langues
+- **14445** - Correction appel génération transcription
+
+**Misc**
+
+- Mise à jour dépendances avec vulnérabilités
+
 ## 41.9.3 (10/04/2026)
 
 **Features**

package/index.ts

@@ -71,7 +71,7 @@ export const getShareAnonymous = () => import("./src/components/display/sharing/
 export const getShareNewsletter = () => import("./src/components/display/sharing/ShareNewsletter.vue");
 export const getQrCode = () => import("./src/components/display/sharing/QrCode.vue");
 export const SubscribeButtons = defineAsyncComponent(() => import("./src/components/display/sharing/SubscribeButtons.vue"));
-
+export const PodcastSeasonInfo = defineAsyncComponent(() => import("./src/components/display/podcasts/PodcastSeasonInfo.vue"));
 
 
 export const getEmissionInlineList = () => import("./src/components/display/emission/EmissionInlineList.vue");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@saooti/octopus-sdk",
-  "version": "41.9.3",
+  "version": "41.9.5",
   "private": false,
   "description": "Javascript SDK for using octopus",
   "author": "Saooti",

package/src/api/transcriptionApi.ts

@@ -108,7 +108,7 @@ async function getRawTranscription(podcastId: number): Promise<string> {
  * @param params Transcription parameters
  */
 async function generateTranscription(podcastId: number, language: string, params: ModifyPodcastConfig): Promise<void> {
-    await classicApi.putData({
+    await classicApi.postData({
         api: ModuleApi.SPEECHTOTEXT,
         path: `convert/${language}/${podcastId}`,
         dataToSend: params

package/src/components/composable/useDayjs.ts

@@ -13,6 +13,8 @@ dayjs.extend(duration);
 import localizedFormat from "dayjs/plugin/localizedFormat";
 dayjs.extend(localizedFormat);
 
+import { state } from "../../stores/ParamSdkStore";
+
 export const useDayjs = () => {
     const { locale } = useI18n();
 
@@ -21,7 +23,14 @@ export const useDayjs = () => {
     }
     composableDayjs.duration = dayjs.duration;
 
+    function formatDate(param: string|number|Date|Dayjs, forceTime?: boolean): string {
+        const withTime = forceTime ?? state.generalParameters.showTimeWithDates === true;
+        const format = withTime ? 'D MMMM YYYY - HH:mm' : 'D MMMM YYYY';
+        return composableDayjs(param).format(format);
+    }
+
     return {
+        formatDate,
         dayjs: composableDayjs
     }
 }

package/src/components/composable/useTranslation.ts

@@ -1,6 +1,5 @@
 import { getLanguage } from "../../helper/language";
 import { transcriptionApi, TranslationState, type PodcastTranslationData } from "../../api/transcriptionApi";
-import { useAuthStore } from "../../stores/AuthStore";
 import { CreateTranslation, defaultTranslationConfig, TranslationConfiguration } from "../../stores/class/transcript/transcriptParams";
 import { podcastApi } from "../../api/podcastApi";
 import { Emission } from "../../stores/class/general/emission";
@@ -22,8 +21,6 @@ enum Availability {
 
 export const useTranslation = () => {
 
-    const authStore = useAuthStore();
-
     /**
      * Convert SRT data to plain text
      * @param srt The data to convert
@@ -70,9 +67,9 @@ export const useTranslation = () => {
      * @param emission *(optional)* If set, will also check in emission settings
      * @returns Whether the language is available or not
      */
-    function getTranslationConfig(language: string, emission?: Emission): CreateTranslation {
-        const orgAttributes = authStore.authOrganisation.attributes;
-        const emissionTranslation = parseOrDefault(emission?.annotations['translation-config'] as string|undefined, true);
+    function getTranslationConfig(language: string, emission: Emission): CreateTranslation {
+        const orgAttributes = emission.orga.attributes;
+        const emissionTranslation = parseOrDefault(emission?.annotations?.['translation-config'] as string|undefined, true);
         const orgTranslation = parseOrDefault(orgAttributes?.['translation-config']);
 
         return getConfigurationFor(language, emissionTranslation, orgTranslation);

package/src/components/display/playlist/PodcastPlaylistInlineList.vue

@@ -30,7 +30,6 @@
 </template>
 
 <script setup lang="ts">
-import classicApi from "../../../api/classicApi";
 import PodcastInlineListTemplate from "../podcasts/PodcastInlineListTemplate.vue";
 import PodcastItem from "../podcasts/PodcastItem.vue";
 import SwiperList from "../list/SwiperList.vue";

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

@@ -5,17 +5,7 @@
                 {{ date }}
             </time>
 
-            <div class="podcast-item-season">
-                {{ formatSeason(podcast) }}
-                <BullhornIcon
-                    v-if="podcast.seasonEpisodeType === PodcastType.TRAILER"
-                    :title="$t('Podcast type - Trailer')"
-                />
-                <GiftIcon
-                    v-if="podcast.seasonEpisodeType === PodcastType.BONUS"
-                    :title="$t('Podcast type - Bonus')"
-                />
-            </div>
+            <PodcastSeasonInfo :podcast="podcast" />
         </div>
 
         <router-link
@@ -61,12 +51,10 @@
 import AnimatorsItem from "./AnimatorsItem.vue";
 import {useOrgaComputed} from "../../composable/useOrgaComputed";
 import { computed, defineAsyncComponent } from "vue";
-import { Podcast, PodcastType } from "../../../stores/class/general/podcast";
+import { Podcast } from "../../../stores/class/general/podcast";
 import { state } from "../../../stores/ParamSdkStore";
 import { useI18n } from "vue-i18n";
-import { useSeasonsManagement } from "../../composable/useSeasonsManagement";
-import BullhornIcon from 'vue-material-design-icons/Bullhorn.vue';
-import GiftIcon from 'vue-material-design-icons/Gift.vue';
+import PodcastSeasonInfo from "./PodcastSeasonInfo.vue";
 import { useDayjs } from "../../composable/useDayjs";
 const PodcastPlayBar = defineAsyncComponent(
     () => import("./PodcastPlayBar.vue"),
@@ -80,16 +68,12 @@ const props = defineProps({
 //Composables
 const { t } = useI18n();
 const { isPodcastmaker } = useOrgaComputed();
-const { formatSeason } = useSeasonsManagement();
-const { dayjs } = useDayjs();
 
 //Computed
-const date = computed(() => {
-    let format = "D MMMM YYYY";
-    if (state.generalParameters.showTimeWithDates === true) {
-        format = "D MMMM YYYY - HH:mm";
-    }
-    return dayjs(props.podcast.pubDate).format(format);
+const { formatDate } = useDayjs();
+
+const date = computed((): string => {
+    return formatDate(props.podcast.pubDate);
 });
 
 const orgaNameDisplay = computed(() =>{
@@ -120,19 +104,4 @@ const orgaNameDisplay = computed(() =>{
     display: flex;
     justify-content: space-between;
 }
-
-.podcast-item-season {
-    display: flex;
-    --icon-size: 0.8rem;
-
-    .material-design-icon {
-        position: relative;
-        top: -3px;
-        margin-left: 4px;
-
-        width: var(--icon-size);
-        height: var(--icon-size);
-        color: var(--octopus-primary);
-    }
-}
 </style>

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

@@ -91,7 +91,7 @@ import CancelIcon from "vue-material-design-icons/Cancel.vue";
 import AlertIcon from "vue-material-design-icons/Alert.vue";
 import DurationHelper from "../../../helper/durationHelper";
 import { state } from "../../../stores/ParamSdkStore";
-import { Podcast, PodcastProcessingStatus as ProcessingStatus } from "../../../stores/class/general/podcast";
+import { Podcast, PodcastProcessingStatus as ProcessingStatus, SimplifiedPodcast } from "../../../stores/class/general/podcast";
 import { Conference } from "@/stores/class/conference/conference";
 import { usePlayerStore } from "../../../stores/PlayerStore";
 import { computed, defineAsyncComponent, ref } from "vue";
@@ -100,13 +100,13 @@ import duration from "dayjs/plugin/duration";
 import { useI18n } from "vue-i18n";
 import { useRouter } from "vue-router";
 import { useResizePhone } from "../../composable/useResizePhone";
+import { podcastApi } from "../../../api/podcastApi";
 dayjs.extend(duration);
 const PodcastIsPlaying = defineAsyncComponent(() => import("./PodcastIsPlaying.vue"));
 
-
 //Props 
 const props = defineProps({
-  podcast: { default: () => ({}), type: Object as () => Podcast },
+  podcast: { default: () => ({}), type: Object as () => Podcast|SimplifiedPodcast },
   hidePlay: { default: false, type: Boolean },
   fetchConference: { default: undefined, type: Object as () => Conference },
   justButtons: { default: false, type: Boolean },
@@ -129,7 +129,8 @@ const isVideoPodcast = computed(() => {
   return (
     (props.fetchConference?.videoProfile?.includes("video_") &&
       ProcessingStatus.ReadyToRecord === props.podcast.processingStatus) ||
-    undefined !== props.podcast.video?.videoId
+    ('video' in props.podcast && undefined !== props.podcast.video?.videoId) ||
+    ('videoId' in props.podcast && undefined !== props.podcast.videoId)
   );
 });
 const playingLive = computed(() => {
@@ -276,7 +277,7 @@ const durationIso = computed(() => {
 });
 
 //Methods
-function play(isVideo: boolean): void {
+async function play(isVideo: boolean): Promise<void> {
   if (isLiveToBeRecorded.value) {
     return;
   }
@@ -288,18 +289,22 @@ function play(isVideo: boolean): void {
     router.push("/main/pub/video/" + props.podcast.podcastId);
     return;
   }
+
+  let podcast: Podcast|SimplifiedPodcast = props.podcast;
+  if (isVideo && !('video' in props.podcast)) {
+    podcast = await podcastApi.get(props.podcast.podcastId);
+  }
+  
   if (!recordingLive.value) {
-    playerStore.playerPlay(props.podcast, isVideo);
+    playerStore.playerPlay(podcast, isVideo);
   } else {
     playerStore.playerPlay(
       {
-        ...props.podcast,
-        ...{ 
-          conferenceId: props.fetchConference?.conferenceId,
-          hlsIdentifier: props.fetchConference?.hlsIdentifier,
-        },
+        ...podcast,
+        conferenceId: props.fetchConference?.conferenceId,
+        hlsIdentifier: props.fetchConference?.hlsIdentifier,
       },
-      isVideo,
+      isVideo
     );
   }
 }

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

@@ -0,0 +1,45 @@
+<template>
+    <span class="podcast-item-season">
+        {{ formatSeason(podcast) }}
+        <BullhornIcon
+            v-if="podcast.seasonEpisodeType === PodcastType.TRAILER"
+            :title="$t('Podcast type - Trailer')"
+        />
+        <GiftIcon
+            v-if="podcast.seasonEpisodeType === PodcastType.BONUS"
+            :title="$t('Podcast type - Bonus')"
+        />
+    </span>
+</template>
+
+<script setup lang="ts">
+import { Podcast, PodcastType } from "../../../stores/class/general/podcast";
+import BullhornIcon from 'vue-material-design-icons/Bullhorn.vue';
+import GiftIcon from 'vue-material-design-icons/Gift.vue';
+import { useSeasonsManagement } from "../../composable/useSeasonsManagement";
+
+const { podcast } = defineProps<{
+    /** Podcast for which to display info */
+    podcast: Podcast;
+}>();
+
+const { formatSeason } = useSeasonsManagement();
+</script>
+
+<style scoped lang="scss">
+.podcast-item-season {
+    display: inline-flex;
+    align-items: center;
+    --icon-size: 0.8rem;
+
+    .material-design-icon {
+        //position: relative;
+        //top: -3px;
+        margin-left: 4px;
+
+        width: var(--icon-size);
+        height: var(--icon-size);
+        color: var(--octopus-primary);
+    }
+}
+</style>

package/src/components/display/sharing/SubscribeButtons.vue

@@ -2,6 +2,7 @@
   <div
     v-if="subscriptionsDisplay.length || rssUrl"
     class="subscribe-buttons-container"
+    :class="{ 'justify-center': justifyCenter }"
   >
     <div ref="subscribeButtonsContainer">
       <a
@@ -10,28 +11,34 @@
         :key="sub.name"
         rel="noreferrer noopener"
         target="_blank"
-        :class="[
-          0 === index ? 'first' : '',
-          subscriptionsDisplay.length - 1 === index ? 'last' : '',
-        ]"
-        class="btn share-btn mx-2"
+        :class="{
+          first: 0 === index,
+          last: subscriptionsDisplay.length - 1 === index,
+          mono,
+          small
+        }"
+        class="btn share-btn"
         :href="sub.url"
         :title="t('New window', {text: sub.title})"
       >
-        <component :is="sub.icon" :fill-color="sub?.color" />
+        <component :is="sub.icon" :fill-color="fillColor(sub)" :size="iconSize" />
       </a>
     </div>
     <a
+      v-if="!noRss"
       id="rss-suscribe-button"
       rel="noreferrer noopener"
       target="_blank"
-      class="btn share-btn mx-2"
+      class="btn share-btn"
+      :class="{ mono, small }"
       :href="rssUrl"
       :title="t('New window', {text: t('Rss feed')})"
     >
-      <RssIcon />
+      <RssIcon :fill-color="fillColor()" :size="iconSize" />
     </a>
+
     <button
+      v-if="limit === undefined"
       v-show="hiddenLinks.length"
       id="subscribe-buttons-dropdown"
       class="btn share-btn mx-2"
@@ -54,7 +61,11 @@
         :href="link.url"
         :title="t('New window', {text: link.title})"
       >
-        <component :is="link.icon" :fill-color="link.color" class="me-1" />
+        <component
+          :is="link.icon"
+          :fill-color="fillColor(link)"
+          class="me-1"
+        />
         {{ link.title }}
       </a>
     </ClassicPopover>
@@ -71,6 +82,7 @@ import { type Component, computed, onMounted, Ref, ref, useTemplateRef, watch }
 import { useI18n } from "vue-i18n";
 import { Playlist } from "@/stores/class/general/playlist";
 import { useSharePlatforms } from "../../composable/share/useSharePlatforms";
+
 type Link = {
   name: string;
   icon: Component;
@@ -84,9 +96,21 @@ const props = withDefaults(defineProps<{
   content: Emission|Playlist;
   windowWidth?: number;
   justifyCenter?: boolean;
+  /** Display the icons with just the octopus primary color */
+  mono?: boolean;
+  /** If set, limit the number of icons (will not display plus button) */
+  limit?: number;
+  /** Disable the RSS icon */
+  noRss?: boolean;
+  /** Smaller icons */
+  small?: boolean;
 }>(), {
   windowWidth: 0,
-  justifyCenter: true
+  justifyCenter: true,
+  mono: false,
+  limit: undefined,
+  noRss: false,
+  small: false
 });
 
 //Data 
@@ -116,18 +140,22 @@ const rssUrl = computed(() => {
   return undefined;
 });
 
+const iconSize = computed((): number => {
+  return props.small ? 20 : 24;
+});
 
 //Watch
 watch(()=>props.windowWidth, () =>resizeWindow());
 
 onMounted(()=>resizeWindow());
 
-
 //Methods
 function showAllElements() {
   subscriptionsDisplay.value.forEach((element: Link) => {
     const el = subscribeButtonsContainerRef?.value?.querySelector('#subLink' + element.name);
-    if (!el) return;
+    if (!el) {
+      return;
+    }
     if (el.classList.contains("hid")) {
       el.classList.remove("hid");
     }
@@ -135,9 +163,11 @@ function showAllElements() {
 }
 function hideOnlyNecessaryElements() {
   let parentWidth = 0;
-  subscriptionsDisplay.value.forEach((element: Link) => {
+  subscriptionsDisplay.value.forEach((element: Link, index: number) => {
     const el = subscribeButtonsContainerRef?.value?.querySelector('#subLink' + element.name);
-    if (!el) return;
+    if (!el) {
+      return;
+    }
     if (!parentWidth) {
       const buttonMoreWidth = el.clientWidth + 20;
       parentWidth =
@@ -145,7 +175,7 @@ function hideOnlyNecessaryElements() {
         (el.parentElement?.offsetLeft ?? 0) -
         buttonMoreWidth;
     }
-    if (el.offsetLeft + el.clientWidth + 20 < parentWidth) {
+    if (el.offsetLeft + el.clientWidth + 20 < parentWidth && (props.limit === undefined || index < props.limit)) {
       return;
     }
     hiddenLinks.value.push(element);
@@ -178,15 +208,27 @@ function resizeWindow() {
   }
   subscribeList.style.flexGrow = "0";
 }
+
+function fillColor(link?: Link): string|undefined {
+  if (props.mono === true) {
+    return 'white';
+  } else {
+    return link?.color;
+  }
+}
 </script>
-<style lang="scss">
+
+<style scoped lang="scss">
 .octopus-app {
   .subscribe-buttons-container {
     max-width: 420px;
     align-self: center;
     display: inline-flex;
     width: 100%;
-    justify-content: center;
+
+    &.justify-center {
+      justify-content: center;
+    }
 
     & > div {
       display: inline-flex;
@@ -200,4 +242,20 @@ function resizeWindow() {
     }
   }
 }
+
+.share-btn {
+  margin-right: .5rem;
+  margin-left: .5rem;
+
+  &.mono {
+    background-color: var(--octopus-primary);
+  }
+
+  &.small {
+    height: 1.8rem !important;
+    width: 1.8rem !important;
+    margin-right: .2rem;
+    margin-left: .2rem;
+  }
+}
 </style>

package/src/components/misc/ProgressBar.vue

@@ -26,7 +26,7 @@
       />
     </template>
     <div
-      class="octopus-progress-bar bg-primary"
+      class="octopus-progress-bar current-progress"
       aria-valuenow="0"
       aria-valuemin="0"
       aria-valuemax="100"
@@ -135,15 +135,16 @@ function timeMediaToPercent(value: number | null): number {
 }
 </script>
 
-<style lang="scss">
+<style scoped lang="scss">
 .octopus-app{
   .octopus-progress{
     display: flex;
     overflow: hidden;
-    background-color:var(--octopus-secondary-lighter);
+    background-color: var(--octopus-player-progress-background-color);
     border-radius: var(--octopus-border-radius);
     position: relative;
     cursor: pointer;
+
     .octopus-progress-bar{
       position: absolute;
       display: flex;
@@ -154,6 +155,7 @@ function timeMediaToPercent(value: number | null): number {
       text-align: center;
       white-space: nowrap;
       background-color: var(--octopus-primary);
+      background-color: var(--octopus-player-progress-color-current);
       transition: width 0.6s ease;
     }
 
@@ -205,16 +207,16 @@ function timeMediaToPercent(value: number | null): number {
   }
 
   .player-container {
-  .octopus-small-popover {
-    font-size: 0.7rem;
-    background: var(--octopus-player-color);
-    color: white;
-    border: 0;
-
-    .p-2 {
-      padding: 0.2rem !important;
+    .octopus-small-popover {
+      font-size: 0.7rem;
+      background: var(--octopus-player-color);
+      color: white;
+      border: 0;
+
+      .p-2 {
+        padding: 0.2rem !important;
+      }
     }
   }
 }
-}
 </style>

package/src/components/misc/player/PlayerCompact.vue

@@ -2,7 +2,7 @@
   <div class="d-flex align-items-center flex-grow-1 ps-2">
     <PlayerImage />
     <PlayerPlayButton :player-error="playerError" />
-    <div class="text-light player-grow-content">
+    <div class="player-text player-grow-content">
       <div class="d-flex" :class="!radioUrl ? 'mb-1' : ''">
         <PlayerTitle :player-error="playerError" :hls-ready="hlsReady" />
         <div
@@ -25,14 +25,14 @@
     <button
       id="player-up-btn"
       :title="'' != transcriptText ? t('View transcript') : t('Enlarge')"
-      class="btn play-button-box btn-transparent text-light me-0"
+      class="btn play-button-box btn-transparent player-text me-0"
       @click="changePlayerLargeVersion"
     >
       <ChevronUpIcon />
     </button>
     <button
       :title="t('Close')"
-      class="btn play-button-box btn-transparent text-light"
+      class="btn play-button-box btn-transparent player-text"
       @click="stopPlayer"
     >
       <WindowCloseIcon />
@@ -87,7 +87,7 @@ function changePlayerLargeVersion() {
 }
 </script>
 
-<style lang="scss">
+<style scoped lang="scss">
 .octopus-app .player-grow-content {
   display: flex;
   flex-direction: column;
@@ -97,4 +97,8 @@ function changePlayerLargeVersion() {
   font-size: 0.8rem;
   padding: 0 0.5rem;
 }
+
+.player-text {
+  color: var(--octopus-player-text-color);
+}
 </style>

package/src/components/misc/player/PlayerLarge.vue

@@ -1,10 +1,10 @@
 <template>
   <div
-    class="d-flex flex-column align-items-center my-2 flex-grow-1 text-light position-relative overflow-y-auto"
+    class="d-flex flex-column align-items-center my-2 flex-grow-1 player-text position-relative overflow-y-auto"
   >
     <button
       :title="t('Reduce')"
-      class="player-reduce-button btn bg-transparent text-light"
+      class="player-reduce-button btn bg-transparent player-text"
       @click="changePlayerLargeVersion"
     >
       <ChevronDownIcon :size="40" />
@@ -64,7 +64,7 @@
     <div class="d-flex align-items-center flex-grow-1">
       <button
         title="-15''"
-        class="btn bg-transparent text-light"
+        class="btn bg-transparent player-text"
         :disabled="isAdPlaying"
         @click="seekClick(-15)"
       >
@@ -74,7 +74,7 @@
 
       <button
         title="+15''"
-        class="btn bg-transparent text-light"
+        class="btn bg-transparent player-text"
         :disabled="isAdPlaying"
         @click="seekClick(15)"
       >
@@ -195,4 +195,8 @@ function seekClick(addTime: number): void {
     background: var(--octopus-player-transcript-bg-color);
   }
 }
+
+.player-text {
+  color: var(--octopus-player-text-color);
+}
 </style>

package/src/components/misc/player/elements/PlayerTitle.vue

@@ -4,7 +4,7 @@
   </div>
   <component
     :is="vastStore.linkAdvertising ? 'a' : 'div'"
-    class="flex-grow-1 text-truncate text-light"
+    class="flex-grow-1 text-truncate"
     :class="titleClass"
     :href="vastStore.linkAdvertising"
     rel="noreferrer noopener"
@@ -54,12 +54,15 @@ const podcastTitle = computed(() => {
   if (playerStore.playerPodcast) {
     return playerStore.playerPodcast.title;
   }
-  if (playerStore.playerMedia) return playerStore.playerMedia.title;
+  if (playerStore.playerMedia) {
+    return playerStore.playerMedia.title;
+  }
   if (playerStore.playerLive) {
-    if (!props.hlsReady)
+    if (!props.hlsReady) {
       return (
         playerStore.playerLive.title + " (" + t("Start in a while") + ")"
       );
+    }
     return playerStore.playerLive.title;
   }
   return "";

package/src/components/pages/HomePage.vue

@@ -37,6 +37,7 @@
           <div style="min-height: 650px" />
         </template>
       </ClassicLazy>
+
       <template v-if="rubriqueDisplay && rubriqueDisplay.length > 0">
         <router-link
           v-if="rubriqueDisplay.length >= rubriqueMaxDisplay"

package/src/stores/PlayerStore.ts

@@ -136,8 +136,9 @@ export const usePlayerStore = defineStore("PlayerStore", {
         this.playerElapsed > 0 &&
         this.playerTotal &&
         this.playerTotal > 0
-      )
+      ) {
         return DurationHelper.formatDuration(Math.round(this.playerTotal));
+      }
       return "--:--";
     },
     isPlaying(): boolean {

package/src/stores/class/general/emission.ts

@@ -24,6 +24,10 @@ export interface Emission {
   annotations?: Annotations & {
     /** Subtitle of the emission */
     subtitle?: string;
+    /** Default animators (ids separated by commas) for newly created podcasts */
+    podcastDefaultAnimators?: string;
+    /** Default description for newly created podcasts */
+    podcastDefaultDescription?: string;
   };
   beneficiaries: string[];
   description: string;

package/src/style/_variables.scss

@@ -46,6 +46,12 @@
     // Player
     // Color for the transcript background
     --octopus-player-transcript-bg-color: oklch(from var(--octopus-player-color) calc(l + 0.1) c h);
+    // Color for the text
+    --octopus-player-text-color: oklch(98.16% 0.0017 247.84deg);
+    // Color for the progress bar
+    --octopus-player-progress-color-current: var(--octopus-primary);
+    // Color for the progress bar background
+    --octopus-player-progress-background-color: var(--octopus-secondary-lighter);
 
     // Smartlink
     --octopus-smartlink-title-color: var(--octopus-gray-text);

package/src/style/general.scss

@@ -141,7 +141,7 @@ main, #app{
 
 
   /** Page style */
-  .page-box{
+  .page-box {
     background-color: var(--octopus-background);
     padding: 1rem 3rem 3rem;
     flex-grow: 1;

package/tests/components/composable/useTranslation.spec.ts

@@ -2,9 +2,9 @@ import { describe, it, expect, vi, beforeEach } from 'vitest';
 import { defineComponent } from 'vue';
 import { mount as _mount } from '@vue/test-utils';
 import { setupPinia } from '@tests/utils';
-import { useAuthStore } from '@/stores/AuthStore';
 import { CreateTranslation } from '@/stores/class/transcript/transcriptParams';
 import { useTranslation } from '@/components/composable/useTranslation';
+import type { Emission } from '@/stores/class/general/emission';
 
 vi.mock('@/api/transcriptionApi', () => ({
     transcriptionApi: {
@@ -15,7 +15,7 @@ vi.mock('@/api/transcriptionApi', () => ({
 
 vi.mock('@/api/podcastApi', () => ({
     podcastApi: {
-        get: vi.fn().mockResolvedValue({ emission: undefined }),
+        get: vi.fn(),
     },
 }));
 
@@ -31,15 +31,26 @@ function makeTranslationData(overrides: Partial<PodcastTranslationData> = {}): P
     return { podcastId: 1, nativeLanguage: 'fr', translations: [], ...overrides };
 }
 
-function setOrgTranslationConfig(config: object) {
-    const authStore = useAuthStore();
-    authStore.$patch({
-        authOrganisation: {
+function makeEmission(orgConfig?: object): Emission {
+    return {
+        emissionId: 0,
+        name: '',
+        description: '',
+        orga: {
             id: 'test-org',
             imageUrl: '',
-            attributes: { 'translation-config': JSON.stringify(config) },
+            name: 'Test Org',
+            attributes: orgConfig ? { 'translation-config': JSON.stringify(orgConfig) } : undefined,
         },
-    });
+        beneficiaries: [],
+        rubriqueIds: [],
+        monetisable: 'UNDEFINED',
+        seasonMode: 'NO_SEASON' as never,
+    };
+}
+
+function setOrgTranslationConfig(config: object) {
+    vi.mocked(podcastApi.get).mockResolvedValue({ emission: makeEmission(config) } as never);
 }
 
 describe('useTranslation', () => {
@@ -48,7 +59,7 @@ describe('useTranslation', () => {
     beforeEach(() => {
         vi.clearAllMocks();
         vi.mocked(transcriptionApi.getTranslation).mockResolvedValue('srt content');
-        vi.mocked(podcastApi.get).mockResolvedValue({ emission: undefined } as never);
+        vi.mocked(podcastApi.get).mockResolvedValue({ emission: makeEmission() } as never);
         vi.mocked(getLanguage).mockReturnValue('fr');
 
         let result!: ReturnType<typeof useTranslation>;