cbsnexora/src/index.html

<!--
  Copyright since 2025 Mifos Initiative

  This Source Code Form is subject to the terms of the Mozilla Public
  License, v. 2.0. If a copy of the MPL was not distributed with this
  file, You can obtain one at http://mozilla.org/MPL/2.0/.
-->

<!doctype html>

<html lang="en" class="h-full bg-gray-100">
  <head>
    <meta charset="utf-8" />
    <title>{{'APP_NAME' | translate}}</title>
    <base href="/" />
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="mobile-web-app-capable" content="yes" />

    <link rel="icon" type="image/svg+xml" href="assets/images/cbsnexora-favicon.svg" />
    <link rel="apple-touch-icon" type="image/svg+xml" href="assets/images/cbsnexora-favicon.svg" />
    <link rel="manifest" href="manifest.json" />

    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet" />
    <link
      href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200"
      rel="stylesheet"
    />
    <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Mono:300" rel="stylesheet" />
    <link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@500&display=swap" rel="stylesheet" />
    <link
      href="https://fonts.googleapis.com/css2?family=Hanken+Grotesk:wght@400;500;600;700;800&family=Newsreader:ital,wght@0,400;0,500;1,400;1,500&display=swap"
      rel="stylesheet"
    />
    <!-- Load environment variables -->
  </head>
  <body class="h-full">
    <!--
      OAuth Redirect Interceptor (PRODUCTION)
      -------------------------------------
      OAuth providers cannot redirect to hash-based routes (#).
      This script intercepts OAuth callbacks BEFORE Angular initializes,
      stores the response parameters, and rewrites the URL to a hash route
      that Angular can handle.

      DO NOT remove unless migrating to path-based routing.
    -->
    <script>
      (function () {
        // ===== CONFIGURATION =====
        var OAUTH_CALLBACK_PATHS = ['/callback'];
        var STORAGE_KEY = 'oauth_callback_query';

        // ===== DETECTION =====
        var params = new URLSearchParams(window.location.search);
        var isOAuthResponse = params.has('code') || params.has('error');

        if (!isOAuthResponse) {
          return;
        }

        // Prevent redirect loop
        if (window.location.hash && window.location.hash.length > 1) {
          return;
        }

        var currentPath = window.location.pathname;

        // Only allow known OAuth callback paths
        if (OAUTH_CALLBACK_PATHS.indexOf(currentPath) === -1) {
          return;
        }

        // ===== PERSIST & REDIRECT =====
        try {
          sessionStorage.setItem(STORAGE_KEY, window.location.search);
        } catch (e) {
          console.warn('OAuth interceptor: sessionStorage unavailable, appending query to hash');
        }

        // Always redirect, even if storage fails
        var redirectUrl = window.location.origin + '/#' + currentPath;

        if (!sessionStorage.getItem(STORAGE_KEY)) {
          redirectUrl += window.location.search;
        }

        window.location.replace(redirectUrl);
      })();
    </script>
    <script src="assets/env.js"></script>
    <!--[if lt IE 10]>
      <p>
        You are using an <strong>outdated</strong> browser. Please
        <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.
      </p>
    <![endif]-->

    <noscript>
      <p>This page requires JavaScript to work properly. Please enable JavaScript in your browser.</p>
    </noscript>

    <script>
      // This hides the address bar on mobile browsers
      // https://developers.google.com/web/fundamentals/native-hardware/fullscreen/
      window.addEventListener('load', function () {
        window.scrollTo(0, 1);
      });
    </script>

    <mifosx-web-app>
      <div class="loader-wrapper">
        <div class="bottom triangle"></div>
        <div class="top triangle"></div>
        <div class="left triangle"></div>
        <div class="right triangle"></div>
      </div>
    </mifosx-web-app>
  </body>
</html>