@saooti/octopus-sdk 40.1.21 → 40.2.0-SNAPSHOT

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

@@ -0,0 +1,216 @@
+<template>
+  <div class="d-flex flex-column align-items-center">
+    <div class="d-flex flex-grow-1">
+      <div class="d-flex flex-column flex-shrink-0 me-3">
+        <h2 class="mb-3">
+          {{ $t("Configure your Newsletter tile") }}
+        </h2>
+        <div
+          v-for="colors in arrayColors"
+          :key="colors.mainText"
+          class="d-flex align-items-center mb-3"
+        >
+          <VSwatches
+            v-model="colors.color"
+            class="c-hand me-2"
+            show-fallback
+            fallback-input-type="color"
+            colors="text-advanced"
+            popover-to="right"
+            :data-color="colors.color"
+          />
+          <div class="d-flex flex-column">
+            <div class="fw-bold">{{ colors.mainText }}</div>
+            <div v-if="colors.secondText" class="description-text">
+              {{ colors.secondText }}
+            </div>
+          </div>
+        </div>
+      </div>
+      <!-- eslint-disable vue/no-v-html -->
+      <div class="border p-3" v-html="newsletterHtml" />
+      <!-- eslint-enable -->
+    </div>
+    <button
+      class="btn btn-primary w-fit-content my-3"
+      @click="onCopyCode(newsletterHtml, afterCopy)"
+    >
+      {{ $t("Copy code") }}
+    </button>
+    <div>{{ $t("And paste it in your newsletter") }}</div>
+    <SnackBar ref="snackbar" position="bottom-left" />
+  </div>
+</template>
+
+<script lang="ts">
+import SnackBar from "../../misc/SnackBar.vue";
+import { VSwatches } from "vue3-swatches";
+import "vue3-swatches/dist/style.css";
+import displayHelper from "../../../helper/displayHelper";
+import { Podcast } from "@/stores/class/general/podcast";
+import { defineComponent } from "vue";
+import { useSaveFetchStore } from "../../../stores/SaveFetchStore";
+import { useAuthStore } from "../../../stores/AuthStore";
+import { mapState, mapActions } from "pinia";
+import { Emission } from "@/stores/class/general/emission";
+import { Playlist } from "@/stores/class/general/playlist";
+export default defineComponent({
+  name: "SahreNewsletter",
+
+  components: {
+    SnackBar,
+    VSwatches,
+  },
+
+  props: {
+    podcast: { default: undefined, type: Object as () => Podcast },
+    emission: { default: undefined, type: Object as () => Emission },
+    playlist: { default: undefined, type: Object as () => Playlist },
+  },
+
+  emits: ["close"],
+
+  data() {
+    return {
+      arrayColors: [
+        {
+          color: "#40a372",
+          mainText: this.$t("Choose main color"),
+          secondText: this.$t("Newsletter elements"),
+        },
+        { color: "#000000", mainText: this.$t("Choose text color") },
+        { color: "#FFFFFF", mainText: this.$t("Choose background color") },
+      ],
+      shareUrl: window.location.href,
+    };
+  },
+  computed: {
+    ...mapState(useAuthStore, ["authOrgaId"]),
+    newsletterInfo() {
+      if (this.podcast) {
+        return {
+          imageUrl: `${this.podcast.imageUrl}" alt="${this.$t(
+            "Episode name image",
+            { name: this.podcast.title },
+          )}`,
+          title: this.podcast.title,
+          description: this.podcast.description ?? "",
+          shareText: this.$t("Listen this episode"),
+          emissionHtml: `<tr><td style="padding:5px 0;">
+          <div style="display:flex; margin-top:5px;">
+          <div style="font-size:20px; color:${
+            this.arrayColors[1].color
+          }; margin-right:5px;text-wrap: nowrap;">${this.$t("Emission")} :</div>
+          <a href="${this.shareUrl}" style="font-size: 18px;color: ${
+            this.arrayColors[0].color
+          };overflow: hidden;text-overflow: ellipsis;white-space: nowrap;">${
+            this.podcast.emission.name
+          }</a>
+          </div></td></tr>`,
+          articleHtml:
+            !this.podcast?.article || 0 === this.podcast.article?.length
+              ? ``
+              : `<tr><td style="padding:5px 0;">
+          <div style="display:flex;">
+          <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24"><path fill="currentColor" d="M7 17h7v-2H7zm0-4h10v-2H7zm0-4h10V7H7zM5 21q-.825 0-1.412-.587T3 19V5q0-.825.588-1.412T5 3h14q.825 0 1.413.588T21 5v14q0 .825-.587 1.413T19 21zm0-2h14V5H5zM5 5v14z"/></svg>
+          <a href="${this.podcast.article}" style="color: ${
+            this.arrayColors[1].color
+          };margin-top:2px">${this.$t("See associated article")}</a>
+          </div></td></tr>
+          `,
+          colorTitle: `color:${this.arrayColors[1].color};`,
+        };
+      }
+      if (this.emission) {
+        return {
+          imageUrl: `${this.emission.imageUrl}" alt="${this.$t(
+            "Emission image",
+          )}`,
+          title: this.emission.name,
+          description: this.emission.description ?? "",
+          shareText: this.$t("Listen to all episodes"),
+          emissionHtml: ``,
+          articleHtml: ``,
+          colorTitle: `color:${this.arrayColors[0].color};`,
+        };
+      }
+      return {
+        imageUrl: `${this.playlist?.imageUrl}" alt="${this.$t(
+          "Playlist image",
+        )}`,
+        title: this.playlist?.title,
+        description: this.playlist?.description ?? "",
+        shareText: this.$t("Listen to all episodes"),
+        emissionHtml: ``,
+        articleHtml: ``,
+        colorTitle: `color:${this.arrayColors[0].color};`,
+      };
+    },
+    newsletterHtml(): string {
+      return `<table style="background:${this.arrayColors[2].color};color:${
+        this.arrayColors[1].color
+      };table-layout: fixed;width:100%;font-size: 14px;">
+<tr>
+<td valign="top" width="30%" rowspan="7" style="padding-right:5px;"><img width="100%" src="${
+        this.newsletterInfo.imageUrl
+      }" style="border-radius: 4px;"></td>
+<td valign="top" width="70%" style="padding:5px 0;"><div style="margin-top:5px;font-size: 24px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;font-weight:bold;${
+        this.newsletterInfo.colorTitle
+      }">${this.newsletterInfo.title}</div></td>
+</tr>${this.newsletterInfo.emissionHtml}
+<tr><td style="padding:5px 0;"><div style="overflow: hidden;display: -webkit-box;-webkit-line-clamp: 6;-webkit-box-orient: vertical;word-break: break-word;">${
+        this.newsletterInfo.description
+      }</div></td></tr>
+<tr><td valign="top" style="padding:5px 0;"><a href="${
+        this.shareUrl
+      }" style="color: ${this.arrayColors[0].color};">${this.$t(
+        "See more",
+      )}</a></td></tr>
+<tr>${this.newsletterInfo.articleHtml}
+<td width="1" style="padding:5px 0;"><a href="${
+        this.shareUrl
+      }" style="font-size: 18px;color: ${
+        this.arrayColors[0].color
+      };text-decoration: none; display:flex;"><svg xmlns="http://www.w3.org/2000/svg" width="50" height="50" viewBox="0 0 24 24"><path fill="currentColor" d="m9.5 16.5l7-4.5l-7-4.5zM12 22q-2.075 0-3.9-.788t-3.175-2.137q-1.35-1.35-2.137-3.175T2 12q0-2.075.788-3.9t2.137-3.175q1.35-1.35 3.175-2.137T12 2q2.075 0 3.9.788t3.175 2.137q1.35 1.35 2.138 3.175T22 12q0 2.075-.788 3.9t-2.137 3.175q-1.35 1.35-3.175 2.138T12 22"/></svg><div style="margin-top: 15px; color:${
+        this.arrayColors[1].color
+      };">${this.newsletterInfo.shareText}</div></a></td>
+</tr>
+</table>
+`;
+    },
+  },
+  created() {
+    this.initData();
+  },
+  methods: {
+    ...mapActions(useSaveFetchStore, ["getOrgaAttributes"]),
+    onCopyCode(link: string, callback: () => void){
+      displayHelper.onCopyCode(link, callback);
+    },
+    afterCopy(): void {
+      (this.$refs.snackbar as InstanceType<typeof SnackBar>).open(
+        this.$t("Data in clipboard"),
+      );
+    },
+    async initData(): Promise<void> {
+      const orgaId = this.authOrgaId;
+      if (!orgaId?.length) {
+        return;
+      }
+      const attributes = await this.getOrgaAttributes(orgaId ?? "");
+      if (
+        Object.hasOwn(attributes, "podcastmakerUrl") &&
+        (attributes.podcastmakerUrl as string | undefined | null)?.length
+      ) {
+        this.shareUrl =
+          attributes.podcastmakerUrl +
+          window.location.pathname +
+          window.location.search;
+      }
+      if (Object.hasOwn(attributes, "COLOR")) {
+        this.arrayColors[0].color = attributes.COLOR as string;
+      }
+    },
+  },
+});
+</script>

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

@@ -0,0 +1,140 @@
+<template>
+  <section v-if="!isLoading && !isGarRole && (authOrgaId || !noSharing)" id="share-buttons-podcast-section" class="module-box">
+    <h3 class="mb-2">
+      {{ $t("Share in one click") }}
+    </h3>
+    <div class="d-flex align-items-center">
+      <template v-for="button in arrayShareButtons" :key="button.title">
+        <a
+          v-if="button.condition"
+          rel="noreferrer noopener"
+          target="_blank"
+          :href="button.url"
+          class="btn share-btn mb-2 text-dark me-2"
+          :title="$t('New window', {text: button.title})"
+        >
+          <component :is="button.icon" :size="34" />
+        </a>
+      </template>
+      <slot name="additional-buttons"/>
+      <!--   <div v-if="shareAiAuth" class="d-flex flex-column ms-4">
+          <h3 class="mb-2">
+            {{ $t("Generate a social media post (with AI)") }}
+          </h3>
+          <div class="d-flex align-items-center justify-content-center">
+            <router-link
+              class="btn share-btn mb-2 text-dark"
+              :title="$t('Generate a social media post (with AI)')"
+              :to="{
+                name: 'advancedShare',
+                params: { podcastId: podcast.podcastId },
+              }"
+            >
+              <CreationIcon />
+            </router-link>
+          </div>
+        </div> -->
+    </div>
+  </section>
+</template>
+
+<script lang="ts">
+import XIcon from "../../icons/XIcon.vue";
+import BlueSkyIcon from "../../icons/BlueSkyIcon.vue";
+import WhatsappIcon from "vue-material-design-icons/Whatsapp.vue";
+import LinkedinIcon from "vue-material-design-icons/Linkedin.vue";
+import FacebookIcon from "vue-material-design-icons/Facebook.vue";
+import { useSaveFetchStore } from "../../../stores/SaveFetchStore";
+import { mapActions, mapState } from "pinia";
+import { useAuthStore } from "../../../stores/AuthStore";
+import { defineComponent } from "vue";
+
+export default defineComponent({
+  components: {
+    FacebookIcon,
+    LinkedinIcon,
+    WhatsappIcon,
+    XIcon,
+    BlueSkyIcon
+  },
+  props: {
+    organisationId: { default: undefined, type: String },
+  },
+  data() {
+    return {
+      noSharing: true as boolean,
+      isLoading: true as boolean,
+    };
+  },
+  computed: {
+    ...mapState(useAuthStore, [
+      "isGarRole",
+      "authOrgaId"
+     /*  "authOrganisation",
+      "isRoleProduction" */
+    ]),
+   /*  shareAiAuth(): boolean {
+      return (
+        !this.isPodcastmaker &&
+        undefined !== this.authOrgaId &&
+        undefined !== this.podcast &&
+        this.isRoleProduction &&
+        (this.authOrganisation.attributes?.["openAi.active"] as
+          | string
+          | undefined) === "true"
+      );
+    }, */
+    arrayShareButtons() {
+      return [
+        {
+          title: "Facebook",
+          icon: "FacebookIcon",
+          url: `https://www.facebook.com/sharer/sharer.php?u=${this.urlPage}`,
+          condition: true,
+        },
+        {
+          title: "X",
+          icon: "XIcon",
+          url: `https://twitter.com/intent/tweet?text=${this.urlPage}`,
+          condition: true,
+        },
+        {
+          title: "Linkedin",
+          icon: "LinkedinIcon",
+          url: `https://www.linkedin.com/sharing/share-offsite/?url=${this.urlPage}`,
+          condition: true,
+        },
+        {
+          title: "Bluesky",
+          icon: "BlueSkyIcon",
+          url: `https://bsky.app/intent/compose?text=${this.urlPage}`,
+          condition: true,
+        },
+        {
+          title: "Whatsapp",
+          icon: "WhatsappIcon",
+          url: `whatsapp://send?text=${this.urlPage}`,
+          condition: window.matchMedia("(hover: none)").matches,
+        },
+      ];
+    },
+    urlPage(): string {
+      return window.location.href;
+    },
+  },
+  created() {
+    this.initShareButtons();
+  },
+  methods: {
+    ...mapActions(useSaveFetchStore, ["getOrgaAttributes"]),
+    async initShareButtons() {
+      if (!this.organisationId) {
+        return;
+      }
+      const attributes = await this.getOrgaAttributes(this.organisationId);
+      this.noSharing = "true" === attributes.noSharing;
+      this.isLoading = false;
+    },
+  },
+});
+</script>

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

@@ -116,6 +116,8 @@ export default defineComponent({
     return {
       hiddenLinks: [] as Array<Link>,
       lastWindowWidth: 420 as number,
+      exclusive: false as boolean,
+      notExclusive: false as boolean,
     };
   },
   computed: {

package/src/components/misc/ClassicNav.vue

@@ -89,6 +89,9 @@ export default defineComponent({
     border-bottom: solid 1px var(--octopus-border-default);
     background-color: var(--octopus-background);
   }
+  .octopus-nav.light  .octopus-tab-content{
+    border-top: solid 1px var(--octopus-border-default);
+  }
 
 
   .octopus-nav.light .octopus-nav-item {
@@ -122,10 +125,13 @@ export default defineComponent({
   }
 
   .octopus-nav.light .octopus-nav-link {
-    border-top: 0 !important;
-    border-right: 0 !important;
-    border-left: 0 !important;
     font-weight: bold;
+    background:var(--octopus-border-default);
+    &:active{
+      border-bottom-color: var(--octopus-primary);
+      background: transparent;
+      color: var(--octopus-primary);
+    }
   }
 
 

package/src/components/misc/ClassicPopover.vue

@@ -245,7 +245,7 @@ export default defineComponent({
         return;
       }
       //Exception timepicker in popover
-      var result = Array.from(e?.target?.classList ?? []).findIndex((val) => { return val.startsWith("dp__");});
+      const result = Array.from(e?.target?.classList ?? []).findIndex((val) => { return val.startsWith("dp__");});
       if (-1!==result) {
         return;
       }

package/src/components/misc/modal/NewsletterModal.vue

@@ -1,52 +1,16 @@
 <template>
   <ClassicModal
     id-modal="newsletter-modal"
-    :title-modal="newsletterInfo.titleModal"
+    :title-modal="modalTitle"
     :closable="false"
     @close="closePopup"
   >
     <template #body>
-      <div class="d-flex flex-column">
-        <div class="d-flex">
-          <div class="d-flex flex-column flex-shrink-0 me-3">
-            <h4 class="mb-3">
-              {{ $t("Configure your Newsletter tile") }}
-            </h4>
-            <div
-              v-for="colors in arrayColors"
-              :key="colors.mainText"
-              class="d-flex align-items-center mb-3"
-            >
-              <VSwatches
-                v-model="colors.color"
-                class="c-hand me-2"
-                show-fallback
-                fallback-input-type="color"
-                colors="text-advanced"
-                popover-to="right"
-                :data-color="colors.color"
-              />
-              <div class="d-flex flex-column">
-                <div class="fw-bold">{{ colors.mainText }}</div>
-                <div v-if="colors.secondText" class="description-text">
-                  {{ colors.secondText }}
-                </div>
-              </div>
-            </div>
-          </div>
-          <!-- eslint-disable vue/no-v-html -->
-          <div v-html="newsletterHtml" />
-          <!-- eslint-enable -->
-        </div>
-        <button
-          class="btn d-flex justify-content-center align-items-center flex-grow-1 mt-3 fw-bold"
-          @click="onCopyCode(newsletterHtml, afterCopy)"
-        >
-          <ContentCopyIcon class="me-2" />
-          {{ $t("Copy and embed the HTML code into your email tool") }}
-        </button>
-        <SnackBar ref="snackbar" position="bottom-left" />
-      </div>
+      <ShareNewsletter
+        :podcast="podcast"
+        :emission="emission"
+        :playlist="playlist"
+      />
     </template>
     <template #footer>
       <button class="btn btn-primary m-1" @click="closePopup">
@@ -57,27 +21,18 @@
 </template>
 
 <script lang="ts">
-import ContentCopyIcon from "vue-material-design-icons/ContentCopy.vue";
 import ClassicModal from "../modal/ClassicModal.vue";
-import SnackBar from "../../misc/SnackBar.vue";
-import { VSwatches } from "vue3-swatches";
-import "vue3-swatches/dist/style.css";
-import displayHelper from "../../../helper/displayHelper";
+import ShareNewsletter from "../../display/sharing/ShareNewsletter.vue";
 import { Podcast } from "@/stores/class/general/podcast";
 import { defineComponent } from "vue";
-import { useSaveFetchStore } from "../../../stores/SaveFetchStore";
-import { useAuthStore } from "../../../stores/AuthStore";
-import { mapState, mapActions } from "pinia";
 import { Emission } from "@/stores/class/general/emission";
 import { Playlist } from "@/stores/class/general/playlist";
 export default defineComponent({
   name: "NewsletterModal",
 
   components: {
-    SnackBar,
-    VSwatches,
-    ClassicModal,
-    ContentCopyIcon,
+    ShareNewsletter,
+    ClassicModal
   },
 
   props: {
@@ -87,154 +42,21 @@ export default defineComponent({
   },
 
   emits: ["close"],
-
-  data() {
-    return {
-      arrayColors: [
-        {
-          color: "#40a372",
-          mainText: this.$t("Choose main color"),
-          secondText: this.$t("Newsletter elements"),
-        },
-        { color: "#000000", mainText: this.$t("Choose text color") },
-        { color: "#FFFFFF", mainText: this.$t("Choose background color") },
-      ],
-      shareUrl: window.location.href,
-    };
-  },
-  computed: {
-    ...mapState(useAuthStore, ["authOrgaId"]),
-    newsletterInfo() {
+  computed:{
+    modalTitle() {
       if (this.podcast) {
-        return {
-          titleModal: this.$t("Share the episode in your newsletter"),
-          imageUrl: `${this.podcast.imageUrl}" alt="${this.$t(
-            "Episode name image",
-            { name: this.podcast.title },
-          )}`,
-          title: this.podcast.title,
-          description: this.podcast.description ?? "",
-          shareText: this.$t("Listen this episode"),
-          emissionHtml: `<tr><td style="padding:5px 0;">
-          <div style="display:flex; margin-top:5px;">
-          <div style="font-size:20px; color:${
-            this.arrayColors[1].color
-          }; margin-right:5px;text-wrap: nowrap;">${this.$t("Emission")} :</div>
-          <a href="${this.shareUrl}" style="font-size: 18px;color: ${
-            this.arrayColors[0].color
-          };overflow: hidden;text-overflow: ellipsis;white-space: nowrap;">${
-            this.podcast.emission.name
-          }</a>
-          </div></td></tr>`,
-          articleHtml:
-            !this.podcast?.article || 0 === this.podcast.article?.length
-              ? ``
-              : `<tr><td style="padding:5px 0;">
-          <div style="display:flex;">
-          <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24"><path fill="currentColor" d="M7 17h7v-2H7zm0-4h10v-2H7zm0-4h10V7H7zM5 21q-.825 0-1.412-.587T3 19V5q0-.825.588-1.412T5 3h14q.825 0 1.413.588T21 5v14q0 .825-.587 1.413T19 21zm0-2h14V5H5zM5 5v14z"/></svg>
-          <a href="${this.podcast.article}" style="color: ${
-            this.arrayColors[1].color
-          };margin-top:2px">${this.$t("See associated article")}</a>
-          </div></td></tr>
-          `,
-          colorTitle: `color:${this.arrayColors[1].color};`,
-        };
+        return this.$t("Share the episode in your newsletter");
       }
       if (this.emission) {
-        return {
-          titleModal: this.$t("Share the series in your newsletter"),
-          imageUrl: `${this.emission.imageUrl}" alt="${this.$t(
-            "Emission image",
-          )}`,
-          title: this.emission.name,
-          description: this.emission.description ?? "",
-          shareText: this.$t("Listen to all episodes"),
-          emissionHtml: ``,
-          articleHtml: ``,
-          colorTitle: `color:${this.arrayColors[0].color};`,
-        };
+        return this.$t("Share the series in your newsletter");
       }
-      return {
-        titleModal: this.$t("Share the playlist in your newsletter"),
-        imageUrl: `${this.playlist?.imageUrl}" alt="${this.$t(
-          "Playlist image",
-        )}`,
-        title: this.playlist?.title,
-        description: this.playlist?.description ?? "",
-        shareText: this.$t("Listen to all episodes"),
-        emissionHtml: ``,
-        articleHtml: ``,
-        colorTitle: `color:${this.arrayColors[0].color};`,
-      };
-    },
-    newsletterHtml(): string {
-      return `<table style="background:${this.arrayColors[2].color};color:${
-        this.arrayColors[1].color
-      };table-layout: fixed;width:100%;font-size: 14px;">
-<tr>
-<td valign="top" width="30%" rowspan="7" style="padding-right:5px;"><img width="100%" src="${
-        this.newsletterInfo.imageUrl
-      }" style="border-radius: 4px;"></td>
-<td valign="top" width="70%" style="padding:5px 0;"><div style="margin-top:5px;font-size: 24px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;font-weight:bold;${
-        this.newsletterInfo.colorTitle
-      }">${this.newsletterInfo.title}</div></td>
-</tr>${this.newsletterInfo.emissionHtml}
-<tr><td style="padding:5px 0;"><div style="overflow: hidden;display: -webkit-box;-webkit-line-clamp: 6;-webkit-box-orient: vertical;word-break: break-word;">${
-        this.newsletterInfo.description
-      }</div></td></tr>
-<tr><td valign="top" style="padding:5px 0;"><a href="${
-        this.shareUrl
-      }" style="color: ${this.arrayColors[0].color};">${this.$t(
-        "See more",
-      )}</a></td></tr>
-<tr>${this.newsletterInfo.articleHtml}
-<td width="1" style="padding:5px 0;"><a href="${
-        this.shareUrl
-      }" style="font-size: 18px;color: ${
-        this.arrayColors[0].color
-      };text-decoration: none; display:flex;"><svg xmlns="http://www.w3.org/2000/svg" width="50" height="50" viewBox="0 0 24 24"><path fill="currentColor" d="m9.5 16.5l7-4.5l-7-4.5zM12 22q-2.075 0-3.9-.788t-3.175-2.137q-1.35-1.35-2.137-3.175T2 12q0-2.075.788-3.9t2.137-3.175q1.35-1.35 3.175-2.137T12 2q2.075 0 3.9.788t3.175 2.137q1.35 1.35 2.138 3.175T22 12q0 2.075-.788 3.9t-2.137 3.175q-1.35 1.35-3.175 2.138T12 22"/></svg><div style="margin-top: 15px; color:${
-        this.arrayColors[1].color
-      };">${this.newsletterInfo.shareText}</div></a></td>
-</tr>
-</table>
-`;
+      return this.$t("Share the playlist in your newsletter");
     },
   },
-  created() {
-    this.initData();
-  },
   methods: {
-    ...mapActions(useSaveFetchStore, ["getOrgaAttributes"]),
-    onCopyCode(link: string, callback: () => void){
-      displayHelper.onCopyCode(link, callback);
-    },
     closePopup(): void {
       this.$emit("close");
     },
-    afterCopy(): void {
-      (this.$refs.snackbar as InstanceType<typeof SnackBar>).open(
-        this.$t("Data in clipboard"),
-      );
-    },
-    async initData(): Promise<void> {
-      const orgaId = this.authOrgaId;
-      if (!orgaId?.length) {
-        return;
-      }
-      const attributes = await this.getOrgaAttributes(orgaId ?? "");
-      if (
-        Object.hasOwn(attributes, "podcastmakerUrl") &&
-        (attributes.podcastmakerUrl as string | undefined | null)?.length
-      ) {
-        this.shareUrl =
-          attributes.podcastmakerUrl +
-          window.location.pathname +
-          window.location.search;
-      }
-      if (Object.hasOwn(attributes, "COLOR")) {
-        this.arrayColors[0].color = attributes.COLOR as string;
-      }
-    },
   },
 });
 </script>

package/src/components/misc/modal/QrCodeModal.vue

@@ -5,7 +5,7 @@
     @close="closePopup"
   >
     <template #body>
-      <QrCode :url="urlPage" />
+      <QrCode :url="urlPage" :orga-for-color="orgaForColor" />
     </template>
     <template #footer>
       <button class="btn btn-primary m-1" @click="closePopup">
@@ -27,6 +27,7 @@ export default defineComponent({
   },
   props: {
     urlPage: { default: undefined, type: String },
+    orgaForColor: { default: undefined, type: String },
   },
   emits: ["close"],
   methods: {