@betarena/ad-engine/src/lib/utils/device.ts

Betarena ad-engine widget

// ╭──────────────────────────────────────────────────────────────────────────────────╮
// │ 📌 High Order Overview                                                           │
// ┣──────────────────────────────────────────────────────────────────────────────────┫
// │ ➤ Code Format   // V.8.0                                                         │
// │ ➤ Status        // 🔒 LOCKED                                                     │
// │ ➤ Author(s)     // @migbash                                                      │
// │ ➤ Maintainer(s) // @migbash                                                      │
// │ ➤ Created on    // <date-created>                                                │
// ┣──────────────────────────────────────────────────────────────────────────────────┫
// │ 📝 Description                                                                   │
// ┣──────────────────────────────────────────────────────────────────────────────────┫
// │ BETARENA (Module)
// │ |: Device Logic
// ╰──────────────────────────────────────────────────────────────────────────────────╯

// #region ➤ 📦 Package Imports

import DeviceDetector from 'device-detector-js';
import { UAParser } from 'ua-parser-js';

import { logger } from './debug.js';

import type { IDeviceType } from '@betarena/scores-lib/types/ad-engine/index.js';

// #endregion ➤ 📦 Package Imports

/**
 * @author
 *  @migbash
 * @summary
 *  🟦 HELPER
 * @description
 *  📝 Detect device used from `User-Agent` data.
 * @see https://discord.com/channels/457912077277855764/1067871458233159750
 * @see https://discord.com/channels/457912077277855764/1067529519294070885/1067827869004341319
 * @return { string }
 *  📤 `device` type.
 */
export function detectDeviceWithUA
(
): IDeviceType
{
  let
    /**
     * @description
     *  📝 `device type`.
     */
    deviceType: IDeviceType = 'mobile'
  ;

  const
    /**
     * @description
     *  📝 `user-agent` data.
     * @example
     * => 'Mozilla/5.0 (Linux; Android 10; K) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/131.0.0.0 Safari/537.36'
     * => [production] navigator.userAgent
     */
    userAgent = navigator.userAgent,
    /**
     * @description
     *  📝 Using `ua-parser-js` module.
     */
    methodRes0
      // eslint-disable-next-line new-cap
      = UAParser
      (
        userAgent
      ),
    /**
     * @description
     *  📝 Using 'device-detector-js' module.
     */
    methodRes1
      = new DeviceDetector().parse
      (
        userAgent
      )
  ;

  // [🐞]
  logger
  (
    [
      `🔹 [var] ➤ userAgent ${userAgent}`,
      // `🔹 [var] ➤ methodRes0 ${JSON.stringify(methodRes0, null, 4)}`,
      `🔹 [var] ➤ methodRes1 ${JSON.stringify(methodRes1, null, 4)}`,
      `🔹 [var] ➤ deviceType ${deviceType}`,
      '🚏 checkpoint ➤ detectDeviceWithUA(..) // END'
    ]
  );

  // ╭─────
  // │ NOTE:
  // │ |: Alternative method to get device type.
  // ╰─────
  // deviceType = (methodRes0.device.type ?? 'mobile');

  if (methodRes1.device?.type === 'smartphone')
    deviceType = 'mobile';
  else if (methodRes1.device?.type === 'tablet')
    deviceType = 'tablet';
  else
    deviceType = 'desktop';
  ;

  return deviceType;
}