feature/authors-articles-viewcount/draft/0 (#2309)

* build(scores-lib): update to 4.1.1

* feat(endpoint): update

[1] ────
Update 'endpoint/author.article.ts' for a new logic for increment of target article viewcount. Logic available in 'scores-lib:4.1.1'.

* feat(store,types): update

[1] ────
Update 'store/session.ts' for new data value of 'userAgent' that contains incoming (a.k.a original) user data.
[2] ────
Update respective 'types.session.d.ts' values.

* feat(utils,layout): update

[1] ────
Update 'utils/device.ts' for new logic 'isUserAgentBot(..)' for identifying target user-agent of type bot/crawler.
[2] ────
Update 'layout.server.ts' + 'layout.svelte' for update in the use of the 'user-agent' cascading data and value set.

* feat(author): update

[1] ────
Initialize new '_helpers.ts' for the 'page/author' path, containing respective related logic used in target webpage.
[2] ────
Update respective 'page/author' path 'Layout.svelte' for use of the new '_helpers.ts' logic.

* fix(author): update

[1] ────
Update 'page/author' Layout.svelte for removal of unwanted 'console.log(..)' entry.

package.json

@@ -55,7 +55,7 @@
 	},
 	"dependencies": {
 		"@betarena/ad-engine": "0.0.70",
-		"@betarena/scores-lib": "4.0.40",
+		"@betarena/scores-lib": "4.1.1",
 		"@lukeed/uuid": "2.0.1",
 		"@metamask/sdk": "0.1.0",
 		"@moralisweb3/client-firebase-auth-utils": "2.18.4",

src/lib/components/section/authors/page/author/Layout.svelte

@@ -38,12 +38,16 @@
   // │ 5. type(s) imports(s)                                                  │
   // ╰────────────────────────────────────────────────────────────────────────╯
 
+  import { browser } from '$app/environment';
   import { page } from '$app/stores';
+  import { onDestroy, onMount } from 'svelte';
 
   import SvelteSeo from 'svelte-seo';
   import AuthorWidget from './content/Author-Widget.svelte';
 
+  import { isUserAgentBot } from '$lib/utils/device.js';
   import { tryCatch } from '@betarena/scores-lib/dist/util/common.js';
+  import { startArticleViewIncrement } from './_helpers.js';
 
   import type { IPageAuhtorArticleDataFinal } from '@betarena/scores-lib/types/v8/preload.authors.js';
 
@@ -79,6 +83,48 @@
 
   // #endregion ➤ 📌 VARIABLES
 
+  // #region ➤ 🔄 LIFECYCLE [SVELTE]
+
+  // ╭────────────────────────────────────────────────────────────────────────╮
+  // │ NOTE:                                                                  │
+  // │ Please add inside 'this' region the 'logic' that should run            │
+  // │ immediately and as part of the 'lifecycle' of svelteJs,                │
+  // │ as soon as 'this' .svelte file is ran.                                 │
+  // ╰────────────────────────────────────────────────────────────────────────╯
+
+  onMount
+  (
+    () =>
+    {
+      // [🐞]
+      if (!isUserAgentBot() && browser)
+        setTimeout
+        (
+          () =>
+          {
+            startArticleViewIncrement();
+          },
+          10000
+        );
+      ;
+
+      return;
+    }
+  );
+
+  onDestroy
+  (
+    () =>
+    {
+      // window.removeEventListener('scroll', checkArticleViewIncrement);
+      // window.removeEventListener('mousemove', checkArticleViewIncrement);
+
+      return;
+    }
+  );
+
+  // #endregion ➤ 🔄 LIFECYCLE [SVELTE]
+
 </script>
 
 <!--

src/lib/components/section/authors/page/author/_helpers.ts

@@ -0,0 +1,97 @@
+// ╭──────────────────────────────────────────────────────────────────────────────────╮
+// │ 📌 High Order Overview                                                           │
+// ┣──────────────────────────────────────────────────────────────────────────────────┫
+// │ ➤ Code Format   // V.8.0                                                         │
+// │ ➤ Status        // 🔒 LOCKED                                                     │
+// │ ➤ Author(s)     // @migbash                                                      │
+// │ ➤ Maintainer(s) // @migbash                                                      │
+// │ ➤ Created on    // 2025-01-19                                                    │
+// ┣──────────────────────────────────────────────────────────────────────────────────┫
+// │ 📝 Description                                                                   │
+// ┣──────────────────────────────────────────────────────────────────────────────────┫
+// │ BETARENA (Module)
+// │ |: <insert-module-summary-here>
+// ╰──────────────────────────────────────────────────────────────────────────────────╯
+
+// #region ➤ 📦 Package Imports
+
+import { browser } from '$app/environment';
+
+import { get } from '$lib/api/utils.js';
+import session from '$lib/store/session.js';
+
+import type { Page } from '@sveltejs/kit';
+
+// #endregion ➤ 📦 Package Imports
+
+/**
+ * @author
+ *  @migbash
+ * @description
+ *  📝 Data Response
+ * @returns { void }
+ */
+export function startArticleViewIncrement
+(
+): void
+{
+  // [🐞]
+  // console.log
+  // (
+  //   '🚏 checkpoint ➤ startArticleViewIncrement(..)'
+  // );
+
+  window.addEventListener
+  (
+    'scroll',
+    checkArticleViewIncrement
+  );
+
+  return;
+}
+
+/**
+ * @author
+ *  @migbash
+ * @description
+ *  📝 Data Response
+ * @return { Promise < void > }
+ */
+export async function checkArticleViewIncrement
+(
+): Promise < void >
+{
+  if (!browser) return;
+
+  // [🐞]
+  // console.log
+  // (
+  //   '🚏 checkpoint ➤ checkArticleView(..)'
+  // );
+
+  const
+    /**
+     * @description
+     * 📣 `articleId` from `sessionStore`.
+     */
+    articleId = (session.extract<Page>('page'))?.data.dataArticle?.article?.id
+  ;
+
+  // [🐞]
+  // console.log('articleId', articleId);
+
+  if (!articleId) return;
+
+  window.removeEventListener
+  (
+    'scroll',
+    checkArticleViewIncrement
+  );
+
+  await get
+  (
+    `/api/data/author/article?articleId=${articleId}`
+  );
+
+  return;
+}

src/lib/store/session.ts

@@ -42,6 +42,7 @@ const
       page: null,
       deviceType: 'mobile',
       viewportType: "mobile",
+      userAgent: undefined,
       isUserActive: true,
       windowWidth: 0,
       firebaseListeners: [],
@@ -126,6 +127,7 @@ type IDataProp =
   | 'globalStateAdd'
   | 'globalStateRemove'
   | 'windowWidth'
+  | 'userAgent'
 ;
 
 /**
@@ -134,10 +136,12 @@ type IDataProp =
 type IDataGetProp =
   Extract < IDataProp,
     'lang' |
-    'routeId'
+    'routeId' |
+    'userAgent'
   >
   | 'globalState'
   | 'page'
+  | 'userAgent'
 ;
 
 // #endregion ➤ 📌 VARIABLES
@@ -425,6 +429,8 @@ function createLocalStore
             return sessionStoreObj.globalState as Typ1 | NullUndef;
           else if (dataPoint == 'page')
             return sessionStoreObj.page as Typ1 | NullUndef;
+          else if (dataPoint == 'userAgent')
+            return sessionStoreObj.userAgent as Typ1 | NullUndef;
           ;
           return;
         },

src/lib/sveltekit/endpoint/author.article.ts

@@ -21,7 +21,7 @@
 import { json, type RequestEvent } from '@sveltejs/kit';
 // import { dev } from '$app/environment';
 
-import { entryAuthorArticleTranslation } from '@betarena/scores-lib/dist/functions/v8/authors.articles.js';
+import { entryAuthorArticleTranslation, entryAuthorArticleViewsIncrement } from '@betarena/scores-lib/dist/functions/v8/authors.articles.js';
 import { entryTargetDataArticle } from '@betarena/scores-lib/dist/functions/v8/main.preload.authors.js';
 import { tryCatchAsync } from '@betarena/scores-lib/dist/util/common.js';
 
@@ -62,7 +62,8 @@ export async function main
 
       const
         queryParamPermalink = request.url.searchParams.get('permalink'),
-        queryParamLanguage = request.url.searchParams.get('lang')
+        queryParamLanguage = request.url.searchParams.get('lang'),
+        queryParamArticleId = request.url.searchParams.get('articleId')
       ;
 
       // ╭──────────────────────────────────────────────────────────────────╮
@@ -155,6 +156,23 @@ export async function main
       // │:| (default) data.                                                │
       // ╰──────────────────────────────────────────────────────────────────╯
 
+      if (queryParamArticleId)
+      {
+        const
+          /**
+           * @description
+           * 📝 Data Response.
+           */
+          data
+            = await entryAuthorArticleViewsIncrement
+            (
+              Number(queryParamArticleId),
+            )
+        ;
+
+        return json(null);
+      }
+
       return json
       (
         null

src/lib/types/types.session.d.ts

@@ -106,6 +106,11 @@ export interface ISessionStore
    *  📣 Wether user is currently `active` on the platform.
    */
   isUserActive: boolean;
+  /**
+   * @description
+   * 📣 User `user-agent` data (Original Request).
+   */
+  userAgent: string;
   /**
    * @description
    *  📣 Current window `width`.

src/lib/utils/device.ts

@@ -15,6 +15,7 @@
 import DeviceDetector from 'device-detector-js';
 import parser from 'ua-parser-js';
 
+import session from '$lib/store/session.js';
 import { dlog, dlogv2 } from '$lib/utils/debug';
 
 // #endregion ➤ 📦 Package Imports
@@ -195,3 +196,37 @@ export function viewportChangeV2
     isOtherView
   ];
 }
+
+/**
+ * @author
+ *  @migbash
+ * @summary
+ *  - 🔹 HELPER
+ * @description
+ *  📣 Determines wether `user-agent` is a `bot`.
+ * @param { string } userAgent
+ *  💠 **[required]** `user-agent` string.
+ * @returns { boolean }
+ *  📤 Wether `user-agent` is a `bot`.
+ */
+export function isUserAgentBot
+(
+): boolean
+{
+  const
+    /**
+     * @description
+     * 📣 `session` data.
+     */
+    strUserAgent = session.extract<string>('userAgent')
+  ;
+
+  if (!strUserAgent)
+  {
+    // [🐞]
+    console.error('No user agent found');
+    return false;
+  }
+
+  return /bot|googlebot|crawler|spider|robot|crawling/i.test(strUserAgent);
+}

src/routes/+layout.server.ts

@@ -53,7 +53,10 @@ export async function load
     );
   */
   const res = await main(event);
-  event.depends("autthor:translations")
+  event.depends('autthor:translations')
+
+  res.userAgent = event.request.headers.get('user-agent');
+
   return res
 }
 

src/routes/+layout.svelte

@@ -179,6 +179,8 @@
     | "desktop";
   $sessionStore.fixturesTodayNum =
     navbarTranslationData?.scores_header_fixtures_information?.football ?? 0;
+  $sessionStore.userAgent = $page.data.userAgent as string ?? navigator.userAgent;
+
   // #endregion ➤ 📌 VARIABLES
 
   // #region ➤ 🛠️ METHODS
@@ -380,7 +382,7 @@
 
     // IMPORTANT
     sessionStore.updateData([
-      ["windowWidth", document.documentElement.clientWidth],
+      ["windowWidth", document.documentElement.clientWidth]
     ]);
     // IMPORTANT
     if (isPWA()) $sessionStore.globalState.add("IsPWA");
@@ -391,6 +393,8 @@
     if (adminSet)
       scoresAdminStore.toggleAdminState(adminSet == "true" ? true : false);
     return;
+
+
   });
 
   afterNavigate(async (e): Promise<void> => {