Adds subscriptions

src/views/creators/SubscribeButton.vue

@@ -0,0 +1,49 @@
+<script setup>
+import {useSubscriptionStore} from "@/stores/subscriptionStore.js";
+import {computed} from "vue";
+
+const props = defineProps({
+  creator: {type: Object, required: true},
+});
+
+const subscriptionStore = useSubscriptionStore()
+
+const isSubscribe = computed(() => !subscriptionStore.isSubscribeTo(props.creator.id))
+
+function subscribeToCreator() {
+  subscriptionStore.subscribeTo(props.creator.id)
+}
+
+function unsubscribeFromCreator() {
+  subscriptionStore.unsubscribeFrom(props.creator.id)
+}
+
+</script>
+
+<template>
+  
+  <template v-if="isSubscribe">
+    <v-btn class="action"
+           @click="subscribeToCreator()"
+           style="transition: background-color 0.3s ease;">
+      S'ABONNER
+    </v-btn>
+  </template>
+  
+  <template v-else>
+    <v-btn class="action"
+           @click="unsubscribeFromCreator()"
+           style="transition: background-color 0.3s ease;">
+      SE DESABONNER
+    </v-btn>
+  </template>
+  
+</template>
+
+<style scoped>
+
+.action {
+  @apply py-2 px-4 rounded bg-gray-100 hover:bg-gray-300
+}
+
+</style>