From 7b02be63efea8fdc50fdf4f14180aeba115c6bc8 Mon Sep 17 00:00:00 2001
From: Slushie <suhailm0608@gmail.com>
Date: Fri, 10 Nov 2023 13:32:28 +0000
Subject: [PATCH] Add regional labels to Splatfest boxes

---
 src/components/SplatfestBox.vue | 26 ++++++++++++++++++++++++++
 1 file changed, 26 insertions(+)

diff --git a/src/components/SplatfestBox.vue b/src/components/SplatfestBox.vue
index 3fa62f4..402438e 100644
--- a/src/components/SplatfestBox.vue
+++ b/src/components/SplatfestBox.vue
@@ -3,6 +3,7 @@
     <div class="space-y-2">
       <div class="font-splatoon1 text-2xl xl:text-3xl text-shadow mx-2">
         {{ $t(title) }}
+        {{ regions.length < 4 ? ` (${regions.join('/')})` : '' }}
       </div>
 
       <div class="flex justify-center mx-2">
@@ -41,12 +42,37 @@ import { computed } from 'vue';
 import ProductContainer from './ProductContainer.vue';
 import { STATUS_PAST, STATUS_ACTIVE, STATUS_UPCOMING } from '@/stores/splatfests';
 import SquidTape from './SquidTape.vue';
+import { useUSSplatfestsStore, useEUSplatfestsStore, useJPSplatfestsStore, useAPSplatfestsStore } from '@/stores/splatfests';
 
 const props = defineProps({
   festival: Object,
   historyMode: Boolean,
 });
 
+const usSplatfests = useUSSplatfestsStore();
+const euSplatfests = useEUSplatfestsStore();
+const jpSplatfests = useJPSplatfestsStore();
+const apSplatfests = useAPSplatfestsStore();
+
+const regions = computed(() => {
+  const availableRegions = [];
+  const id = props.festival.__splatoon3ink_id;
+  if (usSplatfests.festivals.map(f => f.__splatoon3ink_id).includes(id)) {
+    availableRegions.push('NA');
+  }
+  if (euSplatfests.festivals.map(f => f.__splatoon3ink_id).includes(id)) {
+    availableRegions.push('EU');
+  }
+  if (jpSplatfests.festivals.map(f => f.__splatoon3ink_id).includes(id)) {
+    availableRegions.push('JP');
+  }
+  if (apSplatfests.festivals.map(f => f.__splatoon3ink_id).includes(id)) {
+    availableRegions.push('AP');
+  }
+  return availableRegions;
+})
+
+
 const title = computed(() => {
   if (props.historyMode) {
     return 'festival.active';