@mundogamernetwork/shared-ui 1.0.0

package/stores/announcement.ts

@@ -0,0 +1,129 @@
+import { defineStore } from "pinia";
+
+export interface AnnouncementBanner {
+	id: number;
+	preset_id: number | null;
+	preset: { id: number; key: string; text: string } | null;
+	/** Resolved message: preset text or custom translatable message */
+	message: string;
+	link_url: string | null;
+	link_text: string | null;
+	type: "info" | "warning" | "success" | "danger";
+	bg_color: string | null;
+	text_color: string | null;
+	platform_ids: number[];
+	language_id: number | null;
+	country_id: number | null;
+	is_global: boolean;
+	is_active: boolean;
+	starts_at: string | null;
+	ends_at: string | null;
+}
+
+const DISMISSED_PREFIX = "mg_announcement_dismissed_";
+const CACHE_KEY = "mg_announcement_banner_cache";
+const CACHE_TTL_MS = 15 * 60 * 1000; // 15 minutes
+
+interface CacheEntry {
+	banner: AnnouncementBanner | null;
+	cachedAt: number;
+}
+
+function readCache(platformId: number, locale: string): AnnouncementBanner | null | undefined {
+	try {
+		const raw = localStorage.getItem(`${CACHE_KEY}_${platformId}_${locale}`);
+		if (!raw) return undefined;
+		const entry: CacheEntry = JSON.parse(raw);
+		if (Date.now() - entry.cachedAt > CACHE_TTL_MS) return undefined;
+		return entry.banner; // null = cached "no active banner"
+	} catch {
+		return undefined;
+	}
+}
+
+function writeCache(platformId: number, locale: string, banner: AnnouncementBanner | null) {
+	try {
+		const entry: CacheEntry = { banner, cachedAt: Date.now() };
+		localStorage.setItem(`${CACHE_KEY}_${platformId}_${locale}`, JSON.stringify(entry));
+	} catch {
+		// localStorage unavailable or full — silently skip
+	}
+}
+
+export const useAnnouncementStore = defineStore("announcement-store", {
+	state: () => ({
+		banner: null as AnnouncementBanner | null,
+		dismissed: false,
+		loaded: false,
+	}),
+
+	actions: {
+		async fetchBanner() {
+			if (this.loaded) return;
+
+			const runtimeConfig = useRuntimeConfig();
+			const networkBaseUrl =
+				runtimeConfig.public.mgSharedUi?.networkBaseUrl ||
+				import.meta.env.VITE_BASE_URL_NETWORK;
+			const platformId = Number(
+				runtimeConfig.public.mgSharedUi?.systemId || import.meta.env.VITE_SYSTEM_ID,
+			);
+
+			if (!networkBaseUrl || !platformId) {
+				this.loaded = true;
+				return;
+			}
+
+			const { locale } = useI18n();
+			const localeVal = locale.value || "en";
+
+			// ── Try cache first ────────────────────────────────────────────────
+			const cached = readCache(platformId, localeVal);
+			if (cached !== undefined) {
+				this.banner = cached;
+				if (cached) {
+					this.dismissed = !!localStorage.getItem(`${DISMISSED_PREFIX}${cached.id}`);
+				}
+				this.loaded = true;
+				return;
+			}
+
+			// ── Cache miss — fetch from API ────────────────────────────────────
+			try {
+				const params = new URLSearchParams({ platform_id: String(platformId) });
+				params.set("locale", localeVal);
+
+				const url = `${networkBaseUrl}/announcement-banners/active?${params.toString()}`;
+				const data: any = await $fetch(url, { credentials: "include" });
+
+				const banner: AnnouncementBanner | null = data?.data ?? null;
+				this.banner = banner;
+
+				if (banner) {
+					this.dismissed = !!localStorage.getItem(`${DISMISSED_PREFIX}${banner.id}`);
+				}
+
+				writeCache(platformId, localeVal, banner);
+			} catch {
+				// Silently fail — banner is non-critical; do not cache on error
+			} finally {
+				this.loaded = true;
+			}
+		},
+
+		dismiss() {
+			if (this.banner) {
+				localStorage.setItem(`${DISMISSED_PREFIX}${this.banner.id}`, "1");
+			}
+			this.dismissed = true;
+		},
+	},
+
+	getters: {
+		isVisible: (state) => !!state.banner && !state.dismissed,
+	},
+});
+
+if (import.meta.hot) {
+	import.meta.hot.accept(acceptHMRUpdate(useAnnouncementStore, import.meta.hot));
+}

package/stores/auth.ts

@@ -0,0 +1,86 @@
+import { defineStore } from "pinia";
+import { default as AuthService } from "../services/authService";
+import type { MgUser } from "../types";
+
+// Kept outside state so it never gets serialized to localStorage
+let _fetchPromise: Promise<void> | null = null;
+
+export const useAuthStore = defineStore({
+	id: "auth-store",
+	state: () => {
+		return {
+			user: {} as MgUser | any,
+			signedIn: false,
+			initialized: false,
+			loading: false,
+		};
+	},
+	actions: {
+		// `force` skips the 30s cooldown. `fresh` adds ?fresh=1 to the
+		// auth/user request so the API also busts its cache — needed right
+		// after a subscription/payment confirmation so the user immediately
+		// sees their new plan instead of the stale Free.
+		async getUser(force: boolean | { force?: boolean; fresh?: boolean } = false, fresh = false) {
+			// Backward-compat: original signature was getUser(force?: boolean).
+			// Allow getUser({ force: true, fresh: true }) too.
+			let forceFlag = false;
+			let freshFlag = false;
+			if (typeof force === "object" && force !== null) {
+				forceFlag = !!force.force;
+				freshFlag = !!force.fresh;
+			} else {
+				forceFlag = !!force;
+				freshFlag = !!fresh;
+			}
+
+			if (!forceFlag && this.signedIn && this.initialized && this.user?.uuid) return;
+			// Deduplicate concurrent calls
+			if (_fetchPromise) return _fetchPromise;
+
+			_fetchPromise = (async () => {
+				this.loading = true;
+				try {
+					const data = await AuthService.getUser({ fresh: freshFlag });
+					if (data) {
+						this.user = { ...this.user, ...data };
+						this.signedIn = true;
+					} else {
+						this.user = {};
+						this.signedIn = false;
+					}
+				} catch {
+					this.user = {};
+					this.signedIn = false;
+				} finally {
+					this.loading = false;
+					this.initialized = true;
+					_fetchPromise = null;
+				}
+			})();
+
+			return _fetchPromise;
+		},
+		clearUser() {
+			this.user = {};
+			this.signedIn = false;
+			this.initialized = false;
+			this.loading = false;
+		},
+	},
+	getters: {
+		userId: (state) => (state.user ? state.user.id : null),
+		isSignedIn: (state) => state.signedIn,
+	},
+	persist: {
+		storage: persistedState.localStorage,
+		pick: ["user", "signedIn"],
+		afterHydrate: ({ store }) => {
+			store.initialized = false;
+			store.loading = false;
+		},
+	},
+});
+
+if (import.meta.hot) {
+	import.meta.hot.accept(acceptHMRUpdate(useAuthStore, import.meta.hot));
+}

package/stores/chat.ts

@@ -0,0 +1,150 @@
+import { defineStore } from "pinia";
+import { ref } from "vue";
+import { getChat } from "../services/chatService";
+import type { MgChat } from "../types";
+
+export const useChatStore = defineStore("chat-store", () => {
+	const hasNewMessage = ref(false);
+	const currentMessageData = ref<any | null>(null);
+	const refetchChat = ref(false);
+	const chatMessagesWidget = ref<any[]>([]);
+	const pollingIntervals: Record<string, number> = {};
+
+	const callNewMessage = (messageData: any) => {
+		Promise.resolve().then(() => {
+			hasNewMessage.value = true;
+			currentMessageData.value = messageData;
+
+			const index = chatMessagesWidget.value.findIndex((chat) => chat.data.id === messageData.chat_id);
+			if (index !== -1) {
+				if (!chatMessagesWidget.value[index].data.chat_messages) {
+					chatMessagesWidget.value[index].data.chat_messages = [];
+				}
+
+				const messageExists = chatMessagesWidget.value[index].data.chat_messages.some(
+					(msg: any) => msg.id === messageData.message_object.id,
+				);
+
+				if (!messageExists) {
+					chatMessagesWidget.value[index].data.chat_messages.push(messageData.message_object);
+					chatMessagesWidget.value = [...chatMessagesWidget.value];
+					nextTick(() => {
+						refetchChat.value = true;
+					});
+				}
+			}
+		});
+	};
+
+	const startPollingForMessages = (chatId: string | number, interval = 3000) => {
+		const pollingId = `polling-${chatId}`;
+
+		if (pollingIntervals[pollingId]) {
+			clearInterval(pollingIntervals[pollingId]);
+		}
+
+		pollingIntervals[pollingId] = window.setInterval(async () => {
+			try {
+				const isWebSocketConnected = window.Echo?.connector?.pusher?.connection?.state === "connected";
+
+				if (isWebSocketConnected) {
+					clearInterval(pollingIntervals[pollingId]);
+					delete pollingIntervals[pollingId];
+					return;
+				}
+
+				await handleChatMessages(chatId);
+			} catch {
+				// polling failure — will retry on next interval
+			}
+		}, interval);
+	};
+
+	const readedNewMessage = () => {
+		hasNewMessage.value = false;
+	};
+
+	const getRefetchChat = () => {
+		refetchChat.value = true;
+	};
+
+	const resetRefetchChat = () => {
+		refetchChat.value = false;
+	};
+
+	const addLoadingChat = (chatId: string | number, users: any[] = []) => {
+		const index = chatMessagesWidget.value.findIndex((c: any) => c?.data?.id === chatId);
+		if (index === -1) {
+			chatMessagesWidget.value.push({ data: { id: chatId, chat_messages: null, users } } as any);
+		}
+	};
+
+	const setChatMessagesWidget = (data: any, refresh: boolean = false) => {
+		const index = chatMessagesWidget.value.findIndex((chat) => chat.data.id === data.data.id);
+		if (index === -1) {
+			chatMessagesWidget.value.push(data);
+		} else if (refresh) {
+			chatMessagesWidget.value[index] = data;
+		}
+	};
+
+	const handleChatMessages = async (chatId: string | number) => {
+		try {
+			const response = await getChat({ chat_id: chatId });
+			setChatMessagesWidget(response.data, true);
+
+			const isWebSocketConnected = window.Echo?.connector?.pusher?.connection?.state === "connected";
+			if (!isWebSocketConnected) {
+				startPollingForMessages(chatId);
+			}
+		} catch {
+			// polling failure — will retry
+		}
+	};
+
+	const stopAllPolling = () => {
+		Object.values(pollingIntervals).forEach(clearInterval);
+		Object.keys(pollingIntervals).forEach((key) => delete pollingIntervals[key]);
+	};
+
+	const removeChatFromWidgetList = (chatId: string | number) => {
+		chatMessagesWidget.value = chatMessagesWidget.value.filter((chat) => chat.data.id !== chatId);
+	};
+
+	const newChat = (data: any) => {
+		setChatMessagesWidget(data);
+	};
+
+	const substituteUserChat = (chatId: string | number, userId: string | number) => {
+		chatMessagesWidget.value = chatMessagesWidget.value.map((chat) => {
+			if (chat.data.id === userId) {
+				return { ...chat, data: { ...chat.data, id: chatId } };
+			}
+			return chat;
+		});
+		handleChatMessages(chatId);
+	};
+
+	return {
+		hasNewMessage,
+		currentMessageData,
+		callNewMessage,
+		readedNewMessage,
+		refetchChat,
+		resetRefetchChat,
+		getRefetchChat,
+		addLoadingChat,
+		setChatMessagesWidget,
+		chatMessagesWidget,
+		handleChatMessages,
+		removeChatFromWidgetList,
+		newChat,
+		substituteUserChat,
+		startPollingForMessages,
+		stopAllPolling,
+	};
+});
+
+if (import.meta.hot) {
+	import.meta.hot.accept(acceptHMRUpdate(useChatStore, import.meta.hot));
+}

package/stores/contact.ts

@@ -0,0 +1,28 @@
+import { fetchContactCountry, fetchSubject } from "../services/contactService";
+import { defineStore } from "pinia";
+
+export const useContactStore = defineStore({
+	id: "contact-store",
+	state: () => ({
+		country: { data: {} as any, status: "init" },
+		subject: { data: {} as any, status: "init" },
+	}),
+	actions: {
+		async fetchCountry(params: any) {
+			this.country.status = "pending";
+			const { data } = await fetchContactCountry(params);
+			this.country.data = data;
+			this.country.status = "success";
+		},
+		async fetchSubject(params: any) {
+			this.subject.status = "pending";
+			const { data } = await fetchSubject(params);
+			this.subject.data = data;
+			this.subject.status = "success";
+		},
+	},
+});
+
+if (import.meta.hot) {
+	import.meta.hot.accept(acceptHMRUpdate(useContactStore, import.meta.hot));
+}

package/stores/document.ts

@@ -0,0 +1,27 @@
+import { fetchDocuments } from "../services/documentService";
+import { defineStore } from "pinia";
+
+export const useDocumentStore = defineStore({
+	id: "document-store",
+	state: () => ({
+		document: {
+			data: {} as any,
+			status: "init",
+		},
+	}),
+	actions: {
+		async fetchDocument(params: any) {
+			this.document.status = "pending";
+			const { data } = await fetchDocuments(params);
+			this.document.data = data;
+			this.document.status = "success";
+		},
+	},
+	getters: {
+		getDocument: (state) => state.document,
+	},
+});
+
+if (import.meta.hot) {
+	import.meta.hot.accept(acceptHMRUpdate(useDocumentStore, import.meta.hot));
+}

package/stores/index.ts

@@ -0,0 +1,34 @@
+import { defineStore } from "pinia";
+
+export const useIndexStore = defineStore({
+	id: "index-store",
+	state: () => {
+		return {
+			showUserModal: false,
+			modalUserText: "",
+			isSidebarOpened: false,
+		};
+	},
+	actions: {
+		toggleSidebar() {
+			this.isSidebarOpened = !this.isSidebarOpened;
+		},
+		async toggleUserModal(text: any) {
+			this.showUserModal = !this.showUserModal;
+			this.modalUserText = text;
+		},
+		resetModal() {
+			this.showUserModal = false;
+			this.modalUserText = "";
+		},
+	},
+	getters: {
+		sidebarState: (state) => state.isSidebarOpened,
+		getUserModalState: (state) => state.showUserModal,
+		getUserModalText: (state) => state.modalUserText,
+	},
+});
+
+if (import.meta.hot) {
+	import.meta.hot.accept(acceptHMRUpdate(useIndexStore, import.meta.hot));
+}

package/stores/institutional.ts

@@ -0,0 +1,231 @@
+import {
+	fetchPress, fetchCareer, fetchStatus, fetchGeneralStatus, fetchRoadmap,
+	fetchDepartment, fetchCountry, fetchTeam, fetchOperationalArea,
+	fetchPartner, fetchBlog, fetchBlogCategory, fetchBlogTag,
+	fetchFaq, fetchMagazine, fetchLanguage,
+} from "../services/institutionalService";
+import { defineStore } from "pinia";
+
+export const useInstitutionalStore = defineStore({
+	id: "institutional-store",
+	state: () => ({
+		press: { data: {} as any, status: "init" },
+		career: { data: {} as any, status: "init" },
+		status: { data: {} as any, status: "init" },
+		generalStatus: { data: {} as any, status: "init" },
+		roadmap: { data: {} as any, status: "init" },
+		country: { data: {} as any, status: "init" },
+		department: { data: {} as any, status: "init" },
+		team: { data: {} as any, status: "init" },
+		operationalArea: { data: {} as any, status: "init" },
+		blog: { data: {} as any, status: "init" },
+		popularBlog: { data: {} as any, status: "init" },
+		blogCategory: { data: {} as any, status: "init" },
+		blogTag: { data: {} as any, status: "init" },
+		faq: { data: {} as any, status: "init" },
+		partner: { data: {} as any, status: "init" },
+		magazine: { data: {} as any, status: "init" },
+		language: { data: {} as any, status: "init" },
+		showPartnersModal: false,
+		partners: "",
+		isFaqOpened: [] as boolean[],
+	}),
+	actions: {
+		async fetchPress(params: any) {
+			this.press.status = "pending";
+			const locale = useNuxtApp().$i18n.locale;
+			const { data } = await fetchPress(locale.value, params);
+			this.press.data = data;
+			this.press.status = "success";
+		},
+		async fetchLatestPress(params: any) {
+			this.press.status = "pending";
+			const locale = useNuxtApp().$i18n.locale;
+			const { data } = await fetchPress(locale.value, params);
+			const responseMeta = data.meta;
+			const tempLatestPress = [...data.data];
+			this.press.data = tempLatestPress;
+			this.press.data.meta = responseMeta;
+			this.press.status = "success";
+		},
+		async fetchMoreLatestPress(params: any) {
+			this.press.status = "pending";
+			const locale = useNuxtApp().$i18n.locale;
+			const { data } = await fetchPress(locale.value, params);
+			this.press.data = [...this.press.data, ...data.data];
+			this.press.status = "success";
+		},
+
+		async fetchCareer(params: any) {
+			this.career.status = "pending";
+			this.career.data = [];
+			const locale = useNuxtApp().$i18n.locale;
+			const { data } = await fetchCareer(locale.value, params);
+			const responseMeta = data.meta;
+			const tempCareer = [...data.data];
+			this.career.data = tempCareer;
+			this.career.data.meta = responseMeta;
+			this.career.status = "success";
+		},
+		async fetchMoreCareer(params: any) {
+			this.career.status = "pending";
+			const locale = useNuxtApp().$i18n.locale;
+			const { data } = await fetchCareer(locale.value, params);
+			this.career.data = [...this.career.data, ...data.data];
+			this.career.status = "success";
+		},
+
+		async fetchStatus(params: any) {
+			this.status.status = "pending";
+			const locale = useNuxtApp().$i18n.locale;
+			const { data } = await fetchStatus(locale.value, params);
+			this.status.data = data;
+			this.status.status = "success";
+		},
+		async fetchGeneralStatus(params: any) {
+			this.generalStatus.status = "pending";
+			const locale = useNuxtApp().$i18n.locale;
+			const { data } = await fetchGeneralStatus(locale.value, params);
+			this.generalStatus.data = data;
+			this.generalStatus.status = "success";
+		},
+
+		async fetchRoadmap(params: any) {
+			this.roadmap.status = "pending";
+			const locale = useNuxtApp().$i18n.locale;
+			const { data } = await fetchRoadmap(locale.value, params);
+			this.roadmap.data = data;
+			this.roadmap.status = "success";
+		},
+
+		async fetchCountry(params: any) {
+			this.country.status = "pending";
+			const { data } = await fetchCountry(params);
+			this.country.data = data;
+			this.country.status = "success";
+		},
+
+		async fetchDepartment(params: any) {
+			this.department.status = "pending";
+			const { data } = await fetchDepartment(params);
+			this.department.data = data;
+			this.department.status = "success";
+		},
+
+		async fetchTeam(params: any) {
+			this.team.status = "pending";
+			const locale = useNuxtApp().$i18n.locale;
+			const { data } = await fetchTeam(locale.value, params);
+			this.team.data = data;
+			this.team.status = "success";
+		},
+		async fetchOperationalArea(params: any) {
+			this.operationalArea.status = "pending";
+			const { data } = await fetchOperationalArea(params);
+			this.operationalArea.data = data;
+			this.operationalArea.status = "success";
+		},
+
+		async fetchPartner(params: any) {
+			this.partner.status = "pending";
+			const lang: string = useCookie("i18n_redirected").value || "en";
+			const { data } = await fetchPartner(lang, params);
+			this.partner.data = data;
+			this.partner.status = "success";
+		},
+
+		async fetchBlog(params: any) {
+			this.blog.status = "pending";
+			this.blog.data = [];
+			const locale = useNuxtApp().$i18n.locale;
+			const { data } = await fetchBlog(locale.value, params);
+			const responseMeta = data.meta;
+			const tempBlog = [...data.data];
+			this.blog.data = tempBlog;
+			this.blog.data.meta = responseMeta;
+			this.blog.status = "success";
+		},
+		async fetchMoreBlog(params: any) {
+			this.blog.status = "pending";
+			const locale = useNuxtApp().$i18n.locale;
+			const { data } = await fetchBlog(locale.value, params);
+			this.blog.data = [...this.blog.data, ...data.data];
+			this.blog.status = "success";
+		},
+		async fetchPopularBlog(params: any) {
+			this.popularBlog.status = "pending";
+			const locale = useNuxtApp().$i18n.locale;
+			const { data } = await fetchBlog(locale.value, params);
+			this.popularBlog.data = data;
+			this.popularBlog.status = "success";
+		},
+
+		async fetchBlogCategory(params: any) {
+			this.blogCategory.status = "pending";
+			const { data } = await fetchBlogCategory(params);
+			this.blogCategory.data = data;
+			this.blogCategory.status = "success";
+		},
+		async fetchBlogTag(params: any) {
+			this.blogTag.status = "pending";
+			const { data } = await fetchBlogTag(params);
+			this.blogTag.data = data;
+			this.blogTag.status = "success";
+		},
+
+		async fetchFaq(params: any) {
+			this.faq.status = "pending";
+			const locale = useNuxtApp().$i18n.locale;
+			const { data } = await fetchFaq(locale.value, params);
+			this.faq.data = data;
+			this.faq.status = "success";
+			this.isFaqOpened = [];
+		},
+
+		async fetchMagazine(params: any) {
+			this.magazine.status = "pending";
+			const { data } = await fetchMagazine(params);
+			this.magazine.data = data;
+			this.magazine.status = "success";
+		},
+		async fetchLatestMagazine(params: any) {
+			this.magazine.status = "pending";
+			const { data } = await fetchMagazine(params);
+			const responseMeta = data.meta;
+			const tempLatestMagazine = [...data.data];
+			this.magazine.data = tempLatestMagazine;
+			this.magazine.data.meta = responseMeta;
+			this.magazine.status = "success";
+		},
+		async fetchMoreLatestMagazine(params: any) {
+			this.magazine.status = "pending";
+			const { data } = await fetchMagazine(params);
+			this.magazine.data = [...this.magazine.data, ...data.data];
+			this.magazine.status = "success";
+		},
+		async fetchLanguage(params: any) {
+			this.language.status = "pending";
+			const { data } = await fetchLanguage(params);
+			this.language.data = data.data;
+			this.language.status = "success";
+		},
+
+		togglePartnersModal() {
+			this.showPartnersModal = !this.showPartnersModal;
+		},
+		togglePartners(val: string) {
+			this.partners = val;
+		},
+		toggleObject(val: any) {
+			this.showPartnersModal = !this.showPartnersModal;
+			this.partners = val.partners;
+		},
+		toggleFaq(index: number) {
+			this.isFaqOpened[index] = !this.isFaqOpened[index];
+		},
+	},
+});
+
+if (import.meta.hot) {
+	import.meta.hot.accept(acceptHMRUpdate(useInstitutionalStore, import.meta.hot));
+}