Adds brandingStore.

Split userStore into userProfileStore and creatorProfileStore

src/views/creators/SubscribeButton.vue

@@ -1,25 +1,22 @@
 <script setup>
 import {useSubscriptionStore} from "@/stores/subscriptionStore.js";
 import {computed, ref} from "vue";
+import {useBrandingStore} from "@/stores/brandingStore.js";
 
-const props = defineProps({
-  creator: {type: Object, required: true},
-  backgroundColor: {required: true},
-});
+const brandingStore = useBrandingStore()
+const subscriptionStore = useSubscriptionStore()
 
-const subscriptionStore = useSubscriptionStore();
-
-const isSubscribe = computed(() => !subscriptionStore.isSubscribeTo(props.creator.id));
+const isSubscribe = computed(() => !subscriptionStore.isSubscribeTo(brandingStore.value.id));
 
 function subscribeToCreator() {
-  subscriptionStore.subscribeTo(props.creator.id);
+  subscriptionStore.subscribeTo(brandingStore.value.id);
 }
 
 // Référence pour contrôler l'affichage du modal
 const showUnsubscribeModal = ref(false);
 
 function unsubscribeFromCreator() {
-  subscriptionStore.unsubscribeFrom(props.creator.id);
+  subscriptionStore.unsubscribeFrom(brandingStore.value.id);
   // Fermer le modal après désabonnement
   showUnsubscribeModal.value = false;
 }
@@ -31,7 +28,7 @@ function unsubscribeFromCreator() {
         :style="{ 
           width: '150px',
           height: '28px',
-          backgroundColor: backgroundColor, 
+          backgroundColor: brandingStore.value.colors.secondary, 
           color: 'white', 
           borderRadius: '0 8px 8px 0',
           padding: '10px 24px',
@@ -42,7 +39,7 @@ function unsubscribeFromCreator() {
         }"
         @click="subscribeToCreator"
     >
-     {{ $t('subscribebutton.subscribe') }}
+      {{ $t('subscribebutton.subscribe') }}
     </v-btn>
   </template>
 
@@ -51,7 +48,7 @@ function unsubscribeFromCreator() {
         :style="{ 
        width: '150px',
               height: '28px',
-        backgroundColor: backgroundColor, 
+        backgroundColor: brandingStore.value.colors.secondary, 
         color: 'white', 
       borderRadius: '0 8px 8px 0',
         padding: '10px 24px',
@@ -68,7 +65,7 @@ function unsubscribeFromCreator() {
 
   <v-dialog v-model="showUnsubscribeModal" max-width="500">
     <v-card class="text-center rounded-xl"
-            :style="{ border: `3px solid ${creator.colors.menu}` }">
+            :style="{ border: `3px solid ${brandingStore.value.colors.secondary}` }">
 
       <div class="flex items-center justify-between py-4 text-2xl font-bold border-b mb-2">
         <div class="flex-1 text-center">
@@ -83,11 +80,12 @@ function unsubscribeFromCreator() {
                :style="{ backgroundColor: 'rgba(255, 255, 255, 0.1)', color: 'rgba(0, 0, 0, 0.4)' }"
                @click="unsubscribeFromCreator">Oui
         </v-btn>
- 
+
         <v-btn class="flex-grow-1"
-               :style="{ borderColor: creator.colors.menu, color: creator.colors.menu }" variant="outlined"
+               :style="{ borderColor: brandingStore.value.colors.secondary, color: brandingStore.value.colors.secondary }"
+               variant="outlined"
                @click="showUnsubscribeModal = false">
-          <div :style="{ color: creator.colors.menu }">Non</div>
+          <div :style="{ color: brandingStore.value.colors.secondary }">Non</div>
         </v-btn>
       </v-card-actions>
     </v-card>