tethys.backend/resources/js/Stores/main.js

import { defineStore } from 'pinia';
import axios from 'axios';

export const MainService = defineStore('main', {
	state: () => ({
		/* User */
		userName: '',
		userEmail: null,
		userAvatar: null,

		/* Field focus with ctrl+k (to register only once) */
		isFieldFocusRegistered: false,

		/* Sample data for starting dashboard(commonly used) */
		clients: [],
		history: [],
		authors: [],
		datasets: []
	}),
	actions: {
		// payload = authenticated user
		setUser(payload) {
			if (payload.name) {
				this.userName = payload.name;
			}
			if (payload.email) {
				this.userEmail = payload.email;
			}
			if (payload.avatar) {
				this.userAvatar = payload.avatar;
			}
		},

		fetch(sampleDataKey) {
			// sampleDataKey= clients or history
			axios
				.get(`data-sources/${sampleDataKey}.json`)
				.then((r) => {
					if (r.data && r.data.data) {
						this[sampleDataKey] = r.data.data;
					}
				})
				.catch((error) => {
					alert(error.message);
				});
		},

		fetchApi(sampleDataKey) {
			// sampleDataKey= clients or history
			axios
				.get(`api/${sampleDataKey}`)
				.then((r) => {
					if (r.data) {
						this[sampleDataKey] = r.data;
					}
				})
				.catch((error) => {
					alert(error.message);
				});
		},
	},
});