Feature/issue 1063/migration to scores lib

.vscode/settings.json

@@ -74,7 +74,9 @@
       "borderRadius": "2px"
     }
   ],
-  // NOTE: SVELTE Specific Extensions (Config)
+  // -----------
+  // NOTE: [BELOW] SVELTE Specific Extensions (Config)
+  // -----------
   // DOC: https://discord.com/channels/457912077277855764/1036919129782878218
   // DOC: https://discord.com/channels/457912077277855764/1036369208721813554
   "svelte.plugin.svelte.compilerWarnings": {

package.json

@@ -24,7 +24,7 @@
 		"quick:preview:local:spin": "vite build && npm run preview",
 		"start:docker": "node server-docker.js",
 		"start:heroku": "node server-heroku.js",
-		"@betarena/scores-lib:pull:next": "npm i @betarena/scores-lib",
+		"@betarena/scores-lib:pull:next": "npm i @betarena/scores-lib@latest",
 		"@betarena/scores-lib:link": "npm link @betarena/scores-lib"
 	},
 	"devDependencies": {
@@ -50,7 +50,7 @@
 	},
 	"type": "module",
 	"dependencies": {
-		"@betarena/scores-lib": "^0.5.7",
+		"@betarena/scores-lib": "^0.7.1",
 		"@lukeed/uuid": "^2.0.0",
 		"@metamask/sdk": "^0.1.0",
 		"@moralisweb3/client-firebase-auth-utils": "^2.14.2",

src/lib/components/_main_/auth/Auth_Widget.svelte

@@ -140,7 +140,7 @@ COMPONENT JS (w/ TS)
 	// (SSR) LANG SVELTE | IMPORTANT
 	// ~~~~~~~~~~~~~~~~~~~~~
 
-	let server_side_language = platfrom_lang_ssr(
+	$: server_side_language = platfrom_lang_ssr(
 		$page?.route?.id,
 		$page?.error,
 		$page?.params?.lang

src/lib/components/_main_/header/Header.svelte

@@ -3,7 +3,7 @@ COMPONENT JS - BASIC
 [TypeScript]
 =================== -->
 <script lang="ts">
-	import { browser } from '$app/environment';
+	import { browser, dev } from '$app/environment';
 	import { goto } from '$app/navigation';
 	import { page } from '$app/stores';
 	import { onMount } from 'svelte';
@@ -14,7 +14,7 @@ COMPONENT JS - BASIC
 	import {
 		getUserLocation,
 		getUserLocationFromIP
-	} from '$lib/geoJs/init';
+	} from '$lib/geo-js/init';
 	import { dlog, dlogv2, NB_W_STY, NB_W_TAG, NB_W_TOG } from '$lib/utils/debug';
 	import arrow_down_fade from './assets/arrow-down-fade.svg';
 	import arrow_down from './assets/arrow-down.svg';
@@ -29,8 +29,8 @@ COMPONENT JS - BASIC
 	import profile_avatar from './assets/profile-avatar.svg';
 	import light_icon_theme from './assets/theme-light-icon.svg';
 
-	import type { GeoJsResponse } from '$lib/models/geojs-types';
 	import type { Cache_Single_Lang_Header_Translation_Response } from '$lib/models/_main_/navbar/types';
+	import type { GeoJsResponse } from '$lib/types/geojs-types';
 
 	import { db_firestore } from '$lib/firebase/init';
 	import { sessionStore } from '$lib/store/session';
@@ -60,8 +60,8 @@ COMPONENT JS - BASIC
 	let langSelected: boolean = false;
 
   const OMIT_URLS: string[] = [
-    '[[lang=lang]]/[sport]/[country]/[league_name]',
-    '[[lang=lang]]/[sport]/[fixture=fixture]'
+    '/[[lang=lang]]/[sport]/[country]/[league_name]',
+    '/[[lang=lang]]/[sport]/[fixture=fixture]'
   ]
 
   const PROFILE_URL: string = '/u/[view]/[lang=lang]'
@@ -93,16 +93,6 @@ COMPONENT JS - BASIC
 	//  COMPONENT METHODS
 	// ~~~~~~~~~~~~~~~~~~~~~
 
-  let setUserLang = false;
-  $: if ($userBetarenaSettings?.user != undefined 
-    && !setUserLang 
-    && PROFILE_URL != $page.route.id
-  ) {
-    setUserLang = true
-    let userlang = $userBetarenaSettings.user?.scores_user_data?.lang
-    dlog(`${NB_W_TAG} 🔵 User Detected! Setting Auth language!`, NB_W_TOG, NB_W_STY)
-    selectLanguage(userlang)
-  }
 
   // Set a Cookie
   function setCookie(cName, cValue, expDays) {
@@ -195,11 +185,17 @@ COMPONENT JS - BASIC
 	async function selectLanguage(
     lang: string
   ): Promise<void> {
+
+    // [ℹ] validation (exit);
+    if (server_side_language == lang) {
+      return;
+    }
+
 		// [ℹ] get past instance of LANG;
 		const pastLang: string =
-			$userBetarenaSettings.lang == 'en'
+      server_side_language == 'en'
 				? '/'
-				: `/${$userBetarenaSettings.lang}`
+				: `/${server_side_language}`
     ;
 		// [ℹ] set the user-lang to corresponding value;
 		userBetarenaSettings.setLang(lang);
@@ -208,6 +204,7 @@ COMPONENT JS - BASIC
       `${NB_W_TAG} selectLanguage()`,
       [
         `$userBetarenaSettings.lang: ${$userBetarenaSettings.lang}`,
+        `server_side_language: ${server_side_language}`,
         `lang: ${lang}`,
         `pastLang: ${pastLang}`,
         `$page.route.id: ${$page.route.id}`
@@ -233,7 +230,7 @@ COMPONENT JS - BASIC
 		}
 
 		// [ℹ] onError, navigate back to homepage
-		if ($page.error) {
+		if ($page.error && !dev) {
 			if (lang == 'en') {
         dlog(`${NB_W_TAG} -> EN`, true, NB_W_STY)
 				await goto('/');
@@ -350,7 +347,7 @@ COMPONENT JS - BASIC
 			return;
 		}
 		const userGeoResponse: GeoJsResponse = await getUserLocation();
-    dlog(userGeoResponse, true);
+    dlog(`${NB_W_TAG} ${userGeoResponse}`, true);
 
 		let userGeo =
 			userGeoResponse.country_code === undefined
@@ -434,9 +431,23 @@ COMPONENT JS - BASIC
 		}
 	}
 
+  let setUserLang = false;
+  $: if ($userBetarenaSettings?.user != undefined 
+    && !setUserLang 
+    && PROFILE_URL != $page.route.id
+  ) {
+    setUserLang = true
+    let userlang = $userBetarenaSettings.user?.scores_user_data?.lang
+    dlog(`${NB_W_TAG} 🔵 User Detected! Setting Auth language! ${userlang}`, NB_W_TOG, NB_W_STY)
+    selectLanguage(userlang)
+  }
+
+  // [ℹ] (archive) -> && PROFILE_URL == $page.route.id
   $: if ($userBetarenaSettings?.lang 
     && !$page.error
-    && PROFILE_URL == $page.route.id) {
+    && $page.route.id
+    && $userBetarenaSettings?.user != undefined
+    && setUserLang) {
     update_select_lang()
   }
 
@@ -446,8 +457,8 @@ COMPONENT JS - BASIC
    * @returns {Promise<void>}
 	 */
   async function update_select_lang(): Promise<void> {
-		dlog('🔵 Updating platform lang...');
 		const lang = $userBetarenaSettings?.lang;
+		dlog(`${NB_W_TAG} 🔵 Updating platform user lang ${lang}`, true);
     // [ℹ] (update)from localStorage()
 		userBetarenaSettings.updateLang(
 			lang
@@ -462,7 +473,7 @@ COMPONENT JS - BASIC
 		await updateDoc(userRef, {
 			lang: lang
 		});
-		dlog('🟢 Language has been updated', true);
+		dlog(`${NB_W_TAG} 🟢 User language has been updated`, true);
   }
 
   /**

src/lib/components/page/fixture/Breadcrumb.svelte

@@ -49,10 +49,10 @@
 
   <img
     src="/assets/svg/tournaments/arrow-right.svg"
-    alt=""
+    alt="Arrow Right Icon"
     class="m-r-10"
-    width="14px"
-    height="14px"
+    width="14"
+    height="14"
   />
 
   <!-- 
@@ -80,10 +80,10 @@
 
   <img
     src="/assets/svg/tournaments/arrow-right.svg"
-    alt=""
+    alt="Arrow Right Icon"
     class="m-r-10"
-    width="14px"
-    height="14px"
+    width="14"
+    height="14"
   />
 
   <!-- 
@@ -111,10 +111,10 @@
 
   <img
     src="/assets/svg/tournaments/arrow-right.svg"
-    alt=""
+    alt="Arrow Right Icon"
     class="m-r-10"
-    width="14px"
-    height="14px"
+    width="14"
+    height="14"
   />
 
   <!-- 

src/lib/components/page/fixture/Layout.svelte

@@ -70,7 +70,7 @@
 	import FeaturedBettingSitesWidget from '$lib/components/page/home/featured_betting_sites/_FeaturedBettingSitesWidget.svelte';
 	import type { Cache_Single_SportbookDetails_Data_Response } from '$lib/models/tournaments/league-info/types';
 	import { dlog } from '$lib/utils/debug';
-	import { viewport_change } from '$lib/utils/platform-functions';
+	import { platfrom_lang_ssr, viewport_change } from '$lib/utils/platform-functions';
 	import SvelteSeo from 'svelte-seo';
 	import Breadcrumb from './Breadcrumb.svelte';
 
@@ -201,6 +201,16 @@
 		);
 	});
 
+  // ~~~~~~~~~~~~~~~~~~~~~
+	// (SSR) LANG SVELTE | IMPORTANT
+	// ~~~~~~~~~~~~~~~~~~~~~
+
+	$: server_side_language = platfrom_lang_ssr(
+		$page?.route?.id,
+		$page?.error,
+		$page?.params?.lang
+	);
+
 	// ~~~~~~~~~~~~~~~~~~~~~
 	// REACTIVE SVELTE METHODS
 	// CRITICAL
@@ -209,7 +219,7 @@
   // TODO: FIXME: replace into a single __layout.svelte method [?]
 	// TODO: FIXME: using page-stores [?]
 	// [ℹ] listen to change in LANG SELECT of `$userBetarenaSettings.lang`
-	let current_lang: string = $userBetarenaSettings.lang;
+	let current_lang: string = server_side_language;
 	$: refresh_lang = $userBetarenaSettings.lang;
 	$: lang_intent = $sessionStore.lang_intent;
 

src/lib/components/page/fixture/about/About_Loader.svelte

@@ -82,9 +82,9 @@
 					>
 						<img
 							src="/assets/svg/chevron-down.svg"
-							alt=""
-							width="20px"
-							height="20px"
+							alt="Arrow down icon"
+							width="20"
+							height="20"
 						/>
 					</div>
 				</div>

src/lib/components/page/fixture/content/Content_Widget.svelte

@@ -320,9 +320,9 @@
                 [ℹ] featured-media -->
 								<img
 									src={item?.featured_media}
-									alt=""
-									width="80px"
-									height="80px"
+									alt="Featured Media"
+									width="80"
+									height="80"
 								/>
 								<!-- 
                 [ℹ] media-title + post-info -->

src/lib/components/page/fixture/head-2-head/Head_2_Head_Widget.svelte

@@ -154,7 +154,7 @@
 			fixture_time,
 			fixture_id
 		);
-		if (firebase_odds.length != 0) {
+		if (firebase_odds && firebase_odds?.length != 0) {
 			check_fixture_odds_inject(firebase_odds);
 		}
 
@@ -233,7 +233,7 @@
 	// (SSR) LANG SVELTE | IMPORTANT
 	// ~~~~~~~~~~~~~~~~~~~~~
 
-	let server_side_language = platfrom_lang_ssr(
+	$: server_side_language = platfrom_lang_ssr(
 		$page?.route?.id,
 		$page?.error,
 		$page?.params?.lang

src/lib/components/page/fixture/incidents/Incident_Row.svelte

@@ -118,10 +118,10 @@
       [ℹ] event minute -->
 			<img
 				src={icon}
-				alt=""
+				alt="Incident Icon"
 				class="event-icon"
-				width="18px"
-				height="18px"
+				width="18"
+				height="18"
 			/>
 			<p
 				class="
@@ -434,10 +434,10 @@
       -->
 			<img
 				src={icon}
-				alt=""
+				alt="Incident Icon"
 				class="event-icon"
-				width="18px"
-				height="18px"
+				width="18"
+				height="18"
 			/>
 		{/if}
 	</div>

src/lib/components/page/fixture/incidents/Incidents_Widget.svelte

@@ -35,7 +35,7 @@
 	import {
 		FIXTURE_FULL_TIME_OPT,
 		FIXTURE_NOT_START_OPT
-	} from '$lib/models/sportmonks';
+	} from "@betarena/scores-lib/dist/api/sportmonks.js";
 	import no_visual from './assets/no_visual.svg';
 	import no_visual_dark from './assets/no_visual_dark.svg';
 
@@ -488,9 +488,9 @@
 						<img
 							src={FIXTURE_INCIDENTS?.home
 								?.team_logo}
-							alt=""
-							width="24px"
-							height="24px"
+							alt="Team image"
+							width="24"
+							height="24"
 						/>
 						<p
 							class="
@@ -521,9 +521,9 @@
 						<img
 							src={FIXTURE_INCIDENTS?.away
 								?.team_logo}
-							alt=""
-							width="24px"
-							height="24px"
+							alt="Team image"
+							width="24"
+							height="24"
 						/>
 					</div>
 				</div>