76 lines
2.3 KiB
JavaScript
76 lines
2.3 KiB
JavaScript
import {defineStore} from 'pinia'
|
|
import {useClient} from "@/plugins/api.js";
|
|
import {useSessionStorage} from "@vueuse/core";
|
|
import {ref, watch} from "vue";
|
|
import {useRoute} from "vue-router";
|
|
|
|
export const useBrandingStore = defineStore(
|
|
'branding',
|
|
() => {
|
|
|
|
const currentBrand = ref(undefined)
|
|
const loading = ref(false)
|
|
|
|
const value = useSessionStorage(
|
|
'branding',
|
|
{},
|
|
{writeDefaults: false})
|
|
|
|
const defaultColors = {
|
|
"background": "#f4f4f4",
|
|
"error": "#f4f4f4",
|
|
"primary": "#f4f4f4",
|
|
"secondary": "#f4f4f4",
|
|
"surface": "#f4f4f4",
|
|
"onBackground": "#000",
|
|
"onError": "#000",
|
|
"onPrimary": "#000",
|
|
"onSecondary": "#000",
|
|
"onSurface": "#000",
|
|
}
|
|
const colors = ref(defaultColors)
|
|
const presentationInfos = ref([])
|
|
|
|
const route = useRoute()
|
|
watch(
|
|
() => route.params.creator,
|
|
async (newCreator, oldCreator) => {
|
|
loading.value = true
|
|
|
|
if (newCreator !== oldCreator) {
|
|
if (newCreator !== undefined) {
|
|
value.value = await fetchCreatorData(newCreator)
|
|
currentBrand.value = newCreator
|
|
colors.value = value.value.colors
|
|
presentationInfos.value = value.value.presentationInfos
|
|
} else {
|
|
value.value = {}
|
|
currentBrand.value = undefined
|
|
colors.value = defaultColors
|
|
presentationInfos.value = []
|
|
}
|
|
}
|
|
|
|
loading.value = false
|
|
}
|
|
)
|
|
|
|
const fetchCreatorData = async (creatorAlias) => {
|
|
try {
|
|
const client = useClient()
|
|
const response = await client.get(`/api/creators/@${creatorAlias}`)
|
|
return response.data
|
|
} catch (error) {
|
|
console.error(`Error fetching content: ${error}`)
|
|
}
|
|
}
|
|
|
|
return {
|
|
currentBrand,
|
|
value,
|
|
colors,
|
|
loading,
|
|
presentationInfos
|
|
}
|
|
})
|