@saooti/octopus-sdk 41.0.8-SNAPSHOT → 41.0.10-SNAPSHOT

package/index.ts

@@ -108,7 +108,7 @@ import {useMetaTitleWatch} from "./src/components/composable/useMetaTitleWatch.t
 import {useOrganisationFilter} from "./src/components/composable/useOrganisationFilter.ts";
 import {useInit} from "./src/components/composable/useInit.ts";
 import {useErrorHandler} from "./src/components/composable/useErrorHandler.ts";
-
+import { useSimplePageParam } from "./src/components/composable/route/useSimplePageParam";
 
 
 //helper
@@ -157,6 +157,7 @@ export {
     useOrganisationFilter,
     useInit,
     useErrorHandler,
+    useSimplePageParam,
     debounce,
     useVastStore,
     useSaveFetchStore,

package/package.json

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

package/src/components/composable/player/usePlayerLive.ts

@@ -16,7 +16,7 @@ export const usePlayerLive = (hlsReady: Ref<boolean>)=>{
   const audioElement: Ref<HTMLAudioElement | null>= ref(null);
   const hls: Ref<any>= ref(null);
   const hlsRetryTimeout: Ref<ReturnType<typeof setTimeout> | undefined>= ref(undefined);
-  const playPromise: Ref<any>= ref(undefined);
+  const playPromise: Ref<Promise<void>|undefined>= ref(undefined);
   const errorHls= ref(false);
 
 

package/src/components/composable/player/usePlayerVast.ts

@@ -3,10 +3,10 @@ import { useVastStore } from "../../../stores/VastStore";
 import { loadScript } from "../../../helper/loadScript";
 import {nextTick, Ref, ref, watch} from 'vue';
 import dayjs from "dayjs";
-let adsLoader: any;
-let adsManager:any;
-let adDisplayContainer:any;
-let adsRequest: any;
+let adsLoader: google.ima.AdsLoader;
+let adsManager:google.ima.AdsManager;
+let adDisplayContainer:google.ima.AdDisplayContainer;
+let adsRequest: google.ima.AdsRequest;
 export const usePlayerVast = ()=>{
   const imaLoaded = ref(false);
   const isContentFinished = ref(false);
@@ -83,7 +83,7 @@ export const usePlayerVast = ()=>{
     adsRequest.adTagUrl = vastUrl;
   }
 
-  function onAdsManagerLoaded(adsManagerLoadedEvent: any) {
+  function onAdsManagerLoaded(adsManagerLoadedEvent: google.ima.AdsManagerLoadedEvent) {
     const adsRenderingSettings = new google.ima.AdsRenderingSettings();
     adsRenderingSettings.restoreCustomPlaybackStateOnAdBreakComplete = true;
     adsManager = adsManagerLoadedEvent.getAdsManager(audioContainer.value, adsRenderingSettings);
@@ -117,7 +117,7 @@ export const usePlayerVast = ()=>{
     }
   }
 
-  function onAdError(adErrorEvent: any) {
+  function onAdError(adErrorEvent: google.ima.AdErrorEvent) {
     console.log(adErrorEvent.getError());
     destroyAdManager();
   }
@@ -132,7 +132,7 @@ export const usePlayerVast = ()=>{
     isAdRequested.value = false;
   }
 
-  function onAdEvent(adEvent: any) {
+  function onAdEvent(adEvent: google.ima.AdEvent) {
     const ad = adEvent.getAd();
     if(ad){
       vastStore.updateCurrentAd(ad);

package/src/components/composable/route/useRouteUpdateParams.ts

@@ -12,14 +12,14 @@ export const useRouteUpdateParams = ()=>{
     return ['podcasts', 'emissions'].includes(route.name?.toString()??"");
   }
 
-  function updatePaginateSize(ps:number){
-    if(checkPage()){
+  function updatePaginateSize(ps:number, force= false){
+    if(force ||checkPage()){
       router.push({query: {...route.query, ...{ps:ps, pr:1}}});
     }
   }
 
-  function updateRouteParam(update: {[key:string]: string|undefined}){
-    if(checkPage()){
+  function updateRouteParam(update: {[key:string]: string|undefined}, force= false){
+    if(force || checkPage()){
       router.push({query: {...route.query, ...update}});
     }
   }

package/src/components/composable/route/useSimplePageParam.ts

@@ -2,7 +2,7 @@ import { useFilterStore } from '../../../stores/FilterStore';
 import { useRouteUpdateParams } from './useRouteUpdateParams';
 import { computed, onMounted, Ref, ref, watch } from "vue";
 
-export const useSimplePageParam = (props: any)=>{
+export const useSimplePageParam = (props: {readonly [key:string]: string|number}, force=false)=>{
 
   const { updateRouteParam } = useRouteUpdateParams();
 
@@ -17,13 +17,13 @@ export const useSimplePageParam = (props: any)=>{
     if(!props.pr){
       return 0;
     }
-    return  Math.max((props.pr - 1 ) * props.ps, 0);
+    return  Math.max(((props.pr as number) - 1 ) * (props.ps as number), 0);
   });
 
   watch(searchPattern, () => {
     updateRouteParam({
       q: searchMinSize.value.length ? searchMinSize.value : undefined,
-    });
+    }, force);
   });
 
   onMounted(() => {
@@ -33,10 +33,10 @@ export const useSimplePageParam = (props: any)=>{
   })
 
   function initSearchPattern(){
-    searchPattern.value = props.routeQuery ?? "";
+    searchPattern.value = (props.routeQuery as string) ?? "";
   }
   function initOrga(){
-    organisationId.value = filterStore.filterOrgaId ?? props.routeOrga;
+    organisationId.value = filterStore.filterOrgaId ?? (props.routeOrga as string);
   }
 
 
@@ -47,6 +47,7 @@ export const useSimplePageParam = (props: any)=>{
     paginateFirst,
     initSearchPattern,
     initOrga,
+    updateRouteParam,
     isInit
 	}
 }

package/src/components/display/categories/CategoryChooser.vue

@@ -13,6 +13,7 @@
     :multiple="multiple"
     :min-search-length="1"
     :width="width"
+    :height="height"
     :is-disabled="isDisabled"
     :no-deselect="noDeselect"
     :display-required="displayRequired"
@@ -32,6 +33,7 @@ import { useI18n } from "vue-i18n";
 const props = defineProps({
   defaultanswer: { default: "", type: String },
   width: { default: "100%", type: String },
+  height: { default: undefined, type: String },
   multiple: { default: false, type: Boolean },
   isDisabled: { default: false, type: Boolean },
   initCategories: {

package/src/components/display/list/ListPaginate.vue

@@ -54,7 +54,7 @@ import PaginateParams from "./PaginateParams.vue";
 import PaginateSection from "./PaginateSection.vue";
 import {useResizePhone} from "../../composable/useResizePhone";
 import { useRouteUpdateParams } from "../../composable/route/useRouteUpdateParams";
-import { computed, ref, watch } from "vue";
+import { computed, watch } from "vue";
 import { usePlayerStore } from "../../../stores/PlayerStore";
 import { useI18n } from "vue-i18n";
 
@@ -72,13 +72,12 @@ const props = defineProps({
   isMobile: { default: false, type: Boolean },
   justSizeChosen: { default: false, type: Boolean },
   playerResponsive: { default: false, type: Boolean },
+  forceUpdateParameters: { default: false, type: Boolean },
 })
 
 //Emits
 const emit = defineEmits(["update:first", "update:rowsPerPage", "update:isMobile"]);
 
-//Data 
-const internSizeChange = ref(false);
   
 //Composables
 const { t } = useI18n();
@@ -99,13 +98,6 @@ const rangeSize = computed(() => {
 
 //Watch
 watch(isPhone, () => {emit("update:isMobile", isPhone.value);}, {immediate: true});
-watch(()=>props.first,  () => {
-  if (internSizeChange.value) {
-    internSizeChange.value = false;
-    return;
-  }
-  updateRouteParam({pr:(Math.floor(props.first / props.rowsPerPage) + 1).toString()});
-});
 
 //Methods
 function fetchMore() {
@@ -114,14 +106,12 @@ function fetchMore() {
 function changeFirst(firstValue: number) {
   scrollToTop();
   emit("update:first", firstValue);
+  updateRouteParam({pr:(Math.floor(firstValue/ props.rowsPerPage) + 1).toString()}, props.forceUpdateParameters);
 }
 function changeSize(sizeValue: number) {
   scrollToTop();
-  if (0 !== props.first) {
-    internSizeChange.value = true;
-  }
   emit("update:rowsPerPage", sizeValue);
-  updatePaginateSize(sizeValue);
+  updatePaginateSize(sizeValue, props.forceUpdateParameters);
 }
 function scrollToTop() {
   const element = document.getElementById(props.id);

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

@@ -12,8 +12,8 @@
     />
     <ListPaginate
       id="podcastPlaylistListPaginate"
-      v-model:first="first"
-      v-model:rows-per-page="size"
+      v-model:first="dfirst"
+      v-model:rows-per-page="dsize"
       v-model:is-mobile="isMobile"
       :text-count="
         podcasts.length > 1
@@ -29,6 +29,7 @@
           : undefined
       "
       :player-responsive="true"
+      :force-update-parameters="true"
     >
       <template #list>
         <div class="octopus-element-list">
@@ -73,14 +74,20 @@ import { useI18n } from "vue-i18n";
 //Props 
 const props = defineProps({
   playlist: { default: () => ({}), type: Object as () => Playlist },
+  first: { default: 0, type: Number },
+  size: { default: 30, type: Number },
+  query: { default: undefined, type: String },
 })
 
+//Emits
+const emit = defineEmits(["update:query"]);
+
 //Data 
 const loading = ref(true);
 const podcasts: Ref<Array<Podcast>> = ref([]);
 const podcastsQuery: Ref<Array<Podcast>> = ref([]);
-const size = ref(30);
-const first = ref(0);
+const dfirst = ref(props.first);
+const dsize = ref(props.size);
 const searchPattern = ref("");
 const isMobile = ref(false);
 
@@ -96,18 +103,19 @@ const podcastsDisplay = computed(() => {
   if (isMobile.value) {
     return podcastsQuery.value.slice(
       0,
-      Math.min(first.value + size.value, podcasts.value.length),
+      Math.min(dfirst.value + dsize.value, podcasts.value.length),
     );
   }
   return podcastsQuery.value.slice(
-    first.value,
-    Math.min(first.value + size.value, podcasts.value.length),
+    dfirst.value,
+    Math.min(dfirst.value + dsize.value, podcasts.value.length),
   );
 });
 const editRight = computed(() =>isEditRights(props.playlist.organisation?.id));
 
 //Watch
 watch(searchPattern,() => {
+  emit('update:query', searchPattern.value);
   if ("" !== searchPattern.value) {
     podcastsQuery.value = podcasts.value.filter((el: Podcast) => {
       return el.title
@@ -141,6 +149,7 @@ async function fetchContent(): Promise<void> {
         });
       }
       podcastsQuery.value = podcasts.value;
+      searchPattern.value = props.query ?? "";
     } catch (error) {
       handle403(error as AxiosError);
     }

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

@@ -3,9 +3,10 @@
     <h3 class="mb-2">
       {{ titleFilter }}
     </h3>
-    <div class="d-flex align-items-center flex-wrap mb-2">
+    <div class="d-flex align-items-stretch flex-wrap mb-2">
       <div id="podcast-filter-list-category-chooser" class="w-50-responsive pe-3">
         <CategoryChooser
+          height="100%"
           :defaultanswer="t('No category filter')"
           @selected="onCategorySelected"
         />
@@ -18,8 +19,8 @@
       />
     </div>
     <PodcastList
-      :first="first"
-      :size="size"
+      :first="dfirst"
+      :size="dsize"
       :iab-id="iabId"
       :query="query"
       :participant-id="participantId"
@@ -29,6 +30,7 @@
       :include-hidden="editRight"
       :show-count="showCount"
       :display-sort-text="false"
+      :force-update-parameters="forceUpdateParameters"
       @fetch="fetch"
     />
   </section>
@@ -47,6 +49,9 @@ const CategoryChooser = defineAsyncComponent(
 
 //Props 
 const props = defineProps({
+  first: { default: 0, type: Number },
+  size: { default: 30, type: Number },
+  query: { default: undefined, type: String },
   participantId: { default: undefined, type: Number },
   name: { default: undefined, type: String },
   emissionId: { default: undefined, type: Number },
@@ -55,15 +60,16 @@ const props = defineProps({
   editRight: { default: false, type: Boolean },
   productorId: { default: () => [], type: Array as () => Array<string> },
   showCount: { default: false, type: Boolean },
+  forceUpdateParameters: { default: false, type: Boolean },
 })
 
 //Emits
-const emit = defineEmits(["fetch"]);
+const emit = defineEmits(["fetch", "update:query"]);
 
 //Data 
-const first = ref(0);
-const size = ref(30);
-const searchPattern = ref("");
+const dfirst = ref(props.first);
+const dsize = ref(props.size);
+const searchPattern = ref(props.query ?? "");
 const reloadList = ref(false);
 const iabId : Ref<number | undefined>= ref(undefined);
 
@@ -82,6 +88,9 @@ const query = computed(() => searchPattern.value.length >= 3 ? searchPattern.val
 watch(()=>props.reload, () => {
   reloadList.value = !reloadList.value;
 });
+watch(searchPattern, () => {
+  emit('update:query', searchPattern.value);
+});
 
 //Methods
 function onCategorySelected(category: Category | undefined): void {

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

@@ -19,6 +19,7 @@
     "
     :just-size-chosen="justSizeChosen"
     :player-responsive="true"
+    :force-update-parameters="forceUpdateParameters"
   >
     <template #list>
       <div class="octopus-element-list">
@@ -85,6 +86,7 @@ const props = defineProps({
   justSizeChosen: { default: false, type: Boolean },
   withVideo: { default: undefined, type: Boolean },
   includeTag:{ default: () => [], type: Array as () => Array<string> },
+  forceUpdateParameters: { default: false, type: Boolean },
 })
 
 //Emits

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

@@ -137,7 +137,7 @@ onMounted(()=>{
 function isNumeric(value: string): boolean {
   return /^-?\d+$/.test(value);
 }
-function selectChange($event: any) {
+function selectChange($event: Event) {
   const val = $event.target.value;
   if (!val) {
     return;

package/src/components/form/ClassicMultiselect.vue

@@ -5,7 +5,7 @@
       'multiselect-no-deselect': noDeselect,
       'form-margin': displayLabel,
     }"
-    :style="{ width: width }"
+    :style="{ width: width, height: height }"
   >
     <label :class="displayLabel ? '' : 'd-none'" :for="id" class="form-label">{{
       label
@@ -28,6 +28,7 @@
       "
       :filter="fakeSearch"
       :selectable="() => !maxOptionsSelected"
+      class="h-100"
       :class="{ 'border border-danger': textDanger?.length }"
       @open="onSearch"
       @search="onSearch"
@@ -93,6 +94,7 @@ const props = defineProps({
   multiple: { default: false, type: Boolean },
   isDisabled: { default: false, type: Boolean },
   width: { default: "100%", type: String },
+  height: { default: undefined, type: String },
   maxElement: { default: 50, type: Number },
   minSearchLength: { default: 3, type: Number },
   optionChosen: { default: undefined, type: Object as () => unknown },
@@ -209,6 +211,7 @@ defineExpose({
 
   .vs__dropdown-toggle {
     padding: 0;
+    height: 100%;
   }
 
   .vs__search:focus {

package/src/components/misc/ClassicPopover.vue

@@ -72,7 +72,7 @@ const router= useRouter();
 const popoverId = computed(() => "popover" + props.target);
 const positionInlineStyle = computed(() => `left: ${posX.value}px; top: ${posY.value}px;max-height:${maxHeight.value}`);
 const displayPopover = computed(() => show.value && !props.disable);
-const isTopLayerPopover = computed(() => (props.isTopLayer || "octopus-modal"===props.relativeClass) && HTMLElement.prototype.hasOwnProperty("popover"));
+const isTopLayerPopover = computed(() => (props.isTopLayer || "octopus-modal"===props.relativeClass) && Object.hasOwn(HTMLElement.prototype, "popover"));
 
 
 //Watch

package/src/components/misc/FooterSection.vue

@@ -74,7 +74,6 @@
 
 <script setup lang="ts">
 import cookiesHelper from "../../helper/cookiesHelper";
-import { useRubriquesFilterComputed } from "../composable/route/useRubriquesFilterComputed";
 import ClassicSelect from "../form/ClassicSelect.vue";
 import AcpmImage from "./AcpmImage.vue";
 import { state } from "../../stores/ParamSdkStore";
@@ -103,7 +102,6 @@ const reset = ref(false);
 const organisationId: Ref<string | undefined> = ref(undefined);
 
 //Composables
-const { rubriqueQueryParam } = useRubriquesFilterComputed();
 const generalStore = useGeneralStore();
 const filterStore = useFilterStore();
 const authStore = useAuthStore();
@@ -140,20 +138,6 @@ watch(()=>filterStore.filterOrgaId, () => {
 
 
 //Methods
-function getQueriesRouter(routeName: string) {
-  if (
-    "podcasts" !== routeName &&
-    "emissions" !== routeName &&
-    "home" !== routeName
-  ) {
-    return { productor: filterStore.filterOrgaId };
-  }
-  return {
-    productor: filterStore.filterOrgaId,
-    iabId: filterStore.filterIab?.id,
-    rubriquesId: rubriqueQueryParam.value,
-  };
-}
 function changeLanguage(): void {
   cookiesHelper.setCookie("octopus-language", language.value);
   loadLocaleMessages(

package/src/components/pages/EmissionPage.vue

@@ -70,12 +70,17 @@
             :emission-id="emissionId"
           />
           <PodcastFilterList
+            v-if="isInit"
+            v-model:query="searchPattern"
             class="mx-2"
+            :first="paginateFirst"
+            :size="ps"
             :show-count="true"
             :emission-id="emissionId"
             :category-filter="false"
             :edit-right="editRight"
             :productor-id="[emission.orga.id]"
+            :force-update-parameters="true"
             @fetch="podcastsFetched"
           />
         </section>
@@ -110,6 +115,7 @@ import { useFilterStore } from "../../stores/FilterStore";
 import { Podcast } from "@/stores/class/general/podcast";
 import { useI18n } from "vue-i18n";
 import { useRoute } from "vue-router";
+import { useSimplePageParam } from "../composable/route/useSimplePageParam";
 const ShareAnonymous = defineAsyncComponent(() => import("../display/sharing/ShareAnonymous.vue"));
 const PodcastFilterList = defineAsyncComponent(
   () => import("../display/podcasts/PodcastFilterList.vue"),
@@ -143,6 +149,9 @@ const PodcastmakerHeader = defineAsyncComponent(
 //Props 
 const props = defineProps({
   emissionId: { default: undefined, type: Number },
+  pr: { default: 0, type: Number },
+  ps: { default: 30, type: Number },
+  routeQuery: { default: "", type: String },
 })
 
 
@@ -163,6 +172,11 @@ const authStore = useAuthStore();
 const filterStore = useFilterStore();
 const generalStore= useGeneralStore();
 const route= useRoute();
+const {
+  searchPattern,
+  paginateFirst,
+  isInit
+} = useSimplePageParam(props, true);
 
 
 //Computed

package/src/components/pages/ParticipantPage.vue

@@ -47,12 +47,17 @@
       </section>
       <!-- productorId define to avoid overwrite #12817 -->
       <PodcastFilterList
+        v-if="isInit"
+        v-model:query="searchPattern"
+        :first="paginateFirst"
+        :size="ps"
         :participant-id="participantId"
         :name="name"
         :category-filter="true"
         :productor-id="['']"
         :reload="reload"
         :show-count="true"
+        :force-update-parameters="true"
       />
     </template>
     <ClassicLoading
@@ -77,6 +82,7 @@ import { computed, defineAsyncComponent, ref, Ref, watch } from "vue";
 import { AxiosError } from "axios";
 import { useI18n } from "vue-i18n";
 import { useRoute } from "vue-router";
+import { useSimplePageParam } from "../composable/route/useSimplePageParam";
 const ShareSocialsButtons = defineAsyncComponent(
   () => import("../display/sharing/ShareSocialsButtons.vue"),
 );
@@ -92,6 +98,9 @@ const ShareAnonymous = defineAsyncComponent(() => import("../display/sharing/Sha
 //Props
 const props = defineProps({
   participantId: { default: undefined, type: Number },
+  pr: { default: 0, type: Number },
+  ps: { default: 30, type: Number },
+  routeQuery: { default: "", type: String },
 });
 
 
@@ -110,6 +119,11 @@ const {  isEditRights } = useOrgaComputed();
 const { updatePathParams } = useSeoTitleUrl();
 const {handle403} = useErrorHandler();
 const filterStore = useFilterStore();
+const {
+  searchPattern,
+  paginateFirst,
+  isInit
+} = useSimplePageParam(props, true);
 
 
 //Computed

package/src/components/pages/PlaylistPage.vue

@@ -18,8 +18,7 @@
               width="250"
               height="250"
               aria-hidden="true"
-        alt=""
-              
+              alt=""
               :title="t('Playlist name image', { name: name })"
               class="img-box float-start me-3 mb-3"
             />
@@ -42,7 +41,13 @@
           :organisation-id="playlist.organisation.id"
         />
         <section class="module-box">
-          <PodcastList :playlist="playlist" />
+          <PodcastList 
+            v-if="isInit"
+            v-model:query="searchPattern"
+            :first="paginateFirst"
+            :size="ps"
+            :playlist="playlist"
+          />
         </section>
       </div>
     </template>
@@ -71,6 +76,7 @@ import {defineAsyncComponent, ref, Ref, computed, watch, onBeforeUnmount } from
 import { AxiosError } from "axios";
 import { useI18n } from "vue-i18n";
 import { useRoute } from "vue-router";
+import { useSimplePageParam } from "../composable/route/useSimplePageParam";
 const ShareSocialsButtons = defineAsyncComponent(
   () => import("../display/sharing/ShareSocialsButtons.vue"),
 );
@@ -89,6 +95,9 @@ const ShareAnonymous = defineAsyncComponent(() => import("../display/sharing/Sha
 //Props
 const props = defineProps({
   playlistId: { default: undefined, type: Number },
+  pr: { default: 0, type: Number },
+  ps: { default: 30, type: Number },
+  routeQuery: { default: "", type: String },
 });
 
 
@@ -108,7 +117,11 @@ const {handle403} = useErrorHandler();
 const authStore = useAuthStore();
 const filterStore = useFilterStore();
 const generalStore = useGeneralStore();
-
+const {
+  searchPattern,
+  paginateFirst,
+  isInit
+} = useSimplePageParam(props, true);
 
 
 //Computed

package/src/helper/loadScript.ts

@@ -1,4 +1,4 @@
-function loadScript(src: string, async:boolean, callback: any) {
+function loadScript(src: string, async:boolean, callback: (isLoaded:boolean) => void) {
   const firstElement = document.getElementsByTagName('head')[0] || document.documentElement,
   scriptElement = document.createElement('script');
   scriptElement.type = 'text/javascript';
@@ -6,13 +6,13 @@ function loadScript(src: string, async:boolean, callback: any) {
   scriptElement.async = async;
   scriptElement.addEventListener('load', function() {
     if(callback && typeof callback === 'function') {
-      callback(true, window);
+      callback(true);
     }
   }, false);
-  scriptElement.addEventListener('error', function(error) {
+  scriptElement.addEventListener('error', function() {
     firstElement.removeChild(scriptElement);
     if(callback && typeof callback === 'function') {
-      callback(false, error);
+      callback(false);
     }
   }, false);
   firstElement.insertBefore(scriptElement, firstElement.firstChild);

package/src/router/router.ts

@@ -144,9 +144,13 @@ const routes: Array<RouteRecordRaw> = [
     component: EmissionPage,
     props: (route: RouteLocationNormalized) => ({
       emissionId: parseInt(route.params.emissionId.toString(), 10),
+      pr: route.query.pr ? parseInt(route.query.pr.toString(), 10) : undefined,
+      ps: route.query.ps ? parseInt(route.query.ps.toString(), 10) : undefined,
+      routeQuery: route.query.q ?? "",
     }),
     meta:{
-      title: ""
+      title: "",
+      noScroll:true
     }
   },
   {
@@ -177,9 +181,13 @@ const routes: Array<RouteRecordRaw> = [
     component: ParticipantPage,
     props: (route: RouteLocationNormalized) => ({
       participantId: parseInt(route.params.participantId.toString(), 10),
+      pr: route.query.pr ? parseInt(route.query.pr.toString(), 10) : undefined,
+      ps: route.query.ps ? parseInt(route.query.ps.toString(), 10) : undefined,
+      routeQuery: route.query.q ?? "",
     }),
     meta:{
-      title: ""
+      title: "",
+      noScroll:true
     }
   },
   {
@@ -266,9 +274,13 @@ const routes: Array<RouteRecordRaw> = [
     component: PlaylistPage,
     props: (route: RouteLocationNormalized) => ({
       playlistId: parseInt(route.params.playlistId.toString(), 10),
+      pr: route.query.pr ? parseInt(route.query.pr.toString(), 10) : undefined,
+      ps: route.query.ps ? parseInt(route.query.ps.toString(), 10) : undefined,
+      routeQuery: route.query.q ?? "",
     }),
     meta:{
-      title: ""
+      title: "",
+      noScroll:true
     }
   },
   //Fake route to avoid errors
@@ -321,7 +333,8 @@ const routes: Array<RouteRecordRaw> = [
 const router = createRouter({
   history: createWebHistory(),
   routes: routes,
-  scrollBehavior(): { left: number; top: number } {
+  scrollBehavior(to, from) {
+    if (to.name === from.name && to.meta.noScroll) return false;
     return { left: 0, top: 0 };
   },
 });

package/src/stores/AuthStore.ts

@@ -5,19 +5,19 @@ import { defineStore } from "pinia";
 import { KeycloakInfo } from "@/stores/class/user/person";
 import { VideoConfig } from "@/stores/class/config/videoConfig";
 import classicApi from "../api/classicApi";
-
+interface AuthParam{
+  accessToken?: string;
+  refreshToken?: string;
+  expiration?: Date|string;
+  clientId?: string;
+}
 interface AuthState {
   authReload: number;
   authName: string;
   authOrgaId?: string;
   authOrgaName?: string;
   authRole: Array<string>;
-  authParam: {
-    accessToken?: string;
-    refreshToken?: string;
-    expiration?: Date;
-    clientId?: string;
-  };
+  authParam:AuthParam;
   authProfile?: Profile;
   authOrganisation: Organisation;
   authVideoConfig: VideoConfig;
@@ -115,25 +115,25 @@ export const useAuthStore = defineStore("AuthStore", {
     },
   },
   actions: {
-    authUpdate(authentication: any) {
+    authUpdate(authentication: {name?:string, organisationId?:string,organisationName?:string, role?:Array<string>}) {
       this.authName = authentication.name ?? this.authName;
       this.authOrgaId = authentication.organisationId ?? this.authOrgaId;
       this.authOrgaName = authentication.organisationName ?? this.authOrgaName;
       this.authRole = authentication.role ?? this.authRole;
     },
-    authUpdateParam(oAuthParam: any) {
+    authUpdateParam(oAuthParam: AuthParam) {
       this.authParam = oAuthParam;
     },
-    authUpdateProfile(profile: any) {
+    authUpdateProfile(profile: Profile) {
       this.authProfile = profile;
       this.authName = profile.firstname + " " + profile.lastname;
     },
-    authUpdateOrganisation(organisation: any) {
+    authUpdateOrganisation(organisation: Organisation) {
       this.authOrganisation = organisation;
       const saveFetchStore = useSaveFetchStore();
       saveFetchStore.forceUpdateAttributes(
         organisation.id,
-        organisation.attributes,
+        organisation.attributes??{}
       );
       saveFetchStore.forceUpdateData(organisation.id, organisation);
     },

package/src/stores/VastStore.ts

@@ -2,7 +2,7 @@ import { defineStore } from "pinia";
 import { AdPosition } from "./class/adserver/adPosition";
 
 interface VastState {
-  currentAd: any;
+  currentAd: google.ima.Ad|undefined;
   isAdPlaying: boolean;
   isAdPaused: boolean;
   isAdSkippable: boolean;
@@ -79,7 +79,7 @@ export const useVastStore = defineStore("VastStore", {
     ) {
       this.adPositionsPodcasts[podcastId] = adPositions;
     },
-    updateCurrentAd(currentAd: any) {
+    updateCurrentAd(currentAd: google.ima.Ad) {
       this.currentAd = currentAd;
       this.isAdSkipped = false;
     },