@mundogamernetwork/shared-ui 1.2.1 → 1.2.6

package/locales/de.json

@@ -51,7 +51,8 @@
       "restriction": {
         "exclusive_official": "Official streamers only",
         "level_official": "Official",
-        "level_affiliate": "Affiliate"
+        "level_affiliate": "Affiliate",
+        "tier_locked": "Exklusiv für den Plan {tier} oder höher"
       },
       "status_key": {
         "see_key": "View key",

package/locales/en.json

@@ -51,7 +51,8 @@
       "restriction": {
         "exclusive_official": "Official streamers only",
         "level_official": "Official",
-        "level_affiliate": "Affiliate"
+        "level_affiliate": "Affiliate",
+        "tier_locked": "Exclusive to {tier} plan or higher"
       },
       "status_key": {
         "see_key": "View key",

package/locales/pt-BR.json

@@ -51,7 +51,8 @@
       "restriction": {
         "exclusive_official": "Official streamers only",
         "level_official": "Official",
-        "level_affiliate": "Affiliate"
+        "level_affiliate": "Affiliate",
+        "tier_locked": "Exclusiva para o plano {tier} ou superior"
       },
       "status_key": {
         "see_key": "View key",

package/locales/ro.json

@@ -51,7 +51,8 @@
       "restriction": {
         "exclusive_official": "Official streamers only",
         "level_official": "Official",
-        "level_affiliate": "Affiliate"
+        "level_affiliate": "Affiliate",
+        "tier_locked": "Exclusiv pentru planul {tier} sau superior"
       },
       "status_key": {
         "see_key": "View key",

package/nuxt.config.ts

@@ -1,4 +1,5 @@
-import { addComponentsDir, createResolver, defineNuxtModule } from "@nuxt/kit";
+import { createRequire } from "node:module";
+import { dirname } from "node:path";
 
 // Nuxt's built-in `components` module resolves cross-layer name collisions by
 // picking the highest `priority` directory (see `scanComponents` in
@@ -13,33 +14,83 @@ import { addComponentsDir, createResolver, defineNuxtModule } from "@nuxt/kit";
 // (MgBanners, MgLoginModal, MgAppInstallBanner, Playtest components, etc.) to
 // silently fail to resolve.
 //
-// Fix: register shared-ui's own component directory explicitly via
-// `addComponentsDir`, with an explicit `priority` far above anything
-// `layerCount - i` could ever produce (realistic layer counts are single
-// digits), so shared-ui always wins regardless of the consuming app's layer
-// ordering/count.
+// A second, separate footgun discovered while fixing this: `~/components`
+// (a bare alias string) in *this* config is NOT resolved relative to
+// shared-ui's own directory when loaded as an extended layer — Nuxt resolves
+// `~` against the *consuming app's* srcDir (aliases are global, not
+// per-layer), so a plain `"~/components"` entry here silently pointed at
+// community-frontend's own `components/` directory and never scanned
+// shared-ui's components at all. An absolute path is required instead.
+//
+// IMPORTANT: do NOT import anything from `@nuxt/kit` (e.g. `createResolver`,
+// `resolveModule`) at the top of this file, and do NOT reference
+// `import.meta` anywhere in it. Older Nuxt/c12 toolchains (e.g. Nuxt 3.13.x,
+// still used by agency-frontend) load layer `nuxt.config.ts` files through an
+// older jiti (1.x) that evaluates them via `vm.Script` in a non-ESM context.
+// Any `import.meta` reference is a hard SyntaxError there ("Cannot use
+// 'import.meta' outside a module") — and critically, importing *anything*
+// from `@nuxt/kit`'s bundle drags jiti into re-transpiling that whole bundle
+// in the same non-ESM vm context too, which itself uses `import.meta.url` /
+// `import.meta.dev` internally and throws the same error, even though none
+// of @nuxt/kit's own `import.meta` usage has anything to do with the specific
+// export being imported. Only Node.js builtins (`node:module`, `node:path`)
+// are safe to import here — jiti 1.x and 2.x both transpile plain builtin
+// imports into `require()` trivially without walking into this trap.
+//
+// Fix: declare shared-ui's own components dir with an absolute path (resolved
+// via `createRequire` + `require.resolve`, no @nuxt/kit, no import.meta) and
+// an explicit `priority` far above anything `layerCount - i` could ever
+// produce (realistic layer counts are single digits), so shared-ui always
+// wins regardless of the consuming app's layer ordering/count.
+//
+// NOTE: do NOT also call `addComponentsDir` for this same path — Nuxt's
+// `scanComponents` dedups purely by `dir.path` via a `scannedPaths` guard, so
+// a *second* dir entry pointing at an already-scanned path is silently
+// skipped (its files never even get globbed), regardless of priority.
+// Declaring the dir once, correctly, is required.
 const SHARED_UI_COMPONENT_PRIORITY = 1000;
 
-const registerSharedUiComponents = defineNuxtModule({
-	meta: {
-		name: "shared-ui-components",
-	},
-	setup() {
-		// Resolve relative to this file (shared-ui's package root), not the
-		// consuming app's `srcDir`/`~` alias — this is the standard Nuxt Kit
-		// pattern (`createResolver(import.meta.url)`) and keeps registration
-		// correct no matter which app extends this layer.
-		const resolver = createResolver(import.meta.url);
-		addComponentsDir({
-			path: resolver.resolve("./components"),
+const require = createRequire(`${process.cwd()}/`);
+const packageRoot = dirname(require.resolve("@mundogamernetwork/shared-ui/package.json"));
+
+export default defineNuxtConfig({
+	components: [
+		{
+			path: `${packageRoot}/components`,
 			pathPrefix: false,
 			priority: SHARED_UI_COMPONENT_PRIORITY,
-		});
+		},
+	],
+	// @pinia/nuxt only auto-scans the top-level app's own storesDirs by
+	// default — it does NOT pick up an extended layer's stores/ directory on
+	// its own. Every consuming app previously had to hand-list these specific
+	// files in its own nuxt.config.ts pinia.storesDirs (see tv-frontend/
+	// community-frontend/agency-frontend history) — easy to forget for new
+	// apps and a real cause of a production 500 (useAnnouncementStore /
+	// useAppInstallBannerStore "is not defined") when tv-frontend's list
+	// went stale relative to shared-ui.
+	//
+	// Nuxt/c12 merges extended-layer config via defu, which concatenates
+	// arrays, so declaring these here gets picked up by every consumer
+	// automatically without they having to list them — consumers can still
+	// add their own storesDirs entries and this list just gets appended.
+	//
+	// Deliberately an explicit file list, NOT "${packageRoot}/stores/**" —
+	// shared-ui also ships auth/chat/contact/institutional/index stores that
+	// collide by name with consuming apps' own, more full-featured local
+	// versions; a full glob would silently override them.
+	//
+	// Absolute paths (via packageRoot), same reasoning as the components dir
+	// above: a relative path here resolves against the *consuming app's*
+	// srcDir when this file is loaded as an extended layer, not shared-ui's
+	// own directory.
+	pinia: {
+		storesDirs: [
+			`${packageRoot}/stores/announcement.ts`,
+			`${packageRoot}/stores/appInstallBanner.ts`,
+			`${packageRoot}/stores/promotion.ts`,
+		],
 	},
-});
-
-export default defineNuxtConfig({
-	modules: [registerSharedUiComponents],
 	css: [
 		"@mundogamernetwork/shared-ui/assets/kit/kit-base.css",
 		"@mundogamernetwork/shared-ui/assets/kit/kit-theme.css",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mundogamernetwork/shared-ui",
-  "version": "1.2.1",
+  "version": "1.2.6",
   "description": "Mundo Gamer Network - Shared UI Layer (Nuxt 3)",
   "type": "module",
   "main": "./nuxt.config.ts",

package/pages/key-campaigns/index.vue

@@ -361,6 +361,10 @@ const campaignsStore = useCampaignsStore()
 
 const currentStep = ref(1)
 const searchTerm = ref("")
+// Guards against out-of-order responses — e.g. clearing the search box right
+// after typing could let the (slower) filtered response resolve after the
+// (faster) unfiltered one, silently reverting the list to stale results.
+let loadRequestToken = 0
 const currentSlide = ref(0)
 const slider = ref<HTMLElement | null>(null)
 let slideInterval: ReturnType<typeof setInterval> | null = null
@@ -499,6 +503,8 @@ async function loadFeaturedCampaigns() {
 }
 
 async function loadCampaigns(page = 1) {
+	const requestToken = ++loadRequestToken
+
 	if (page === 1) {
 		loading.value = true
 		cards.value = []
@@ -515,9 +521,18 @@ async function loadCampaigns(page = 1) {
 
 	if (activeFilter.value !== null) params["filter[type_id]"] = activeFilter.value
 	if (activePlatformFilter.value !== null) params["filter[platform_id]"] = activePlatformFilter.value
+	// Server-side search — the campaign list is paginated by id desc, so a
+	// campaign not on the first page(s) would never match a client-side-only
+	// filter over whatever happens to already be loaded.
+	if (searchTerm.value.trim()) params["filter[name]"] = searchTerm.value.trim()
 
 	try {
 		const response = await campaignsStore.fetchCampaigns(params, mgPlatform)
+
+		// A newer request already started (e.g. user kept typing/cleared the
+		// box) — discard this now-stale response instead of overwriting cards.
+		if (requestToken !== loadRequestToken) return
+
 		const keysData = response.data || []
 		const pagination = response.meta?.pagination || {}
 
@@ -564,11 +579,14 @@ async function loadCampaigns(page = 1) {
 		loadError.value = false
 		applyUserRequestStatuses()
 	} catch {
+		if (requestToken !== loadRequestToken) return
 		hasMoreItems.value = false
 		if (page === 1) loadError.value = true
 	} finally {
-		loading.value = false
-		loadingMore.value = false
+		if (requestToken === loadRequestToken) {
+			loading.value = false
+			loadingMore.value = false
+		}
 	}
 }
 
@@ -704,6 +722,19 @@ const resetAutoplay = () => {
 // ------------------------------------------------------------------
 // Step watcher
 // ------------------------------------------------------------------
+// Debounced server-side search — re-queries the backend by name instead of
+// only filtering whatever page(s) happen to already be loaded client-side.
+let searchDebounce: ReturnType<typeof setTimeout> | null = null
+watch(searchTerm, () => {
+	if (currentStep.value !== 1) return
+	if (searchDebounce) clearTimeout(searchDebounce)
+	searchDebounce = setTimeout(() => {
+		currentPage.value = 1
+		hasMoreItems.value = true
+		loadCampaigns(1)
+	}, 400)
+})
+
 watch(currentStep, (newVal) => {
 	activeFilter.value = null
 	activePlatformFilter.value = null

package/services/campaignService.ts

@@ -234,7 +234,7 @@ export const fetchFeaturedCampaigns = (mgPlatform = "MGTV") => {
 			filter: {
 				is_public: true,
 				status: 1,
-				is_featured: true,
+				featured: true,
 				mg_platform: mgPlatform,
 			},
 			sort: "id",