"use strict";

// JS & CSS

/* eslint-disable */
import "./scss/main.scss";
import UIkit from 'uikit';
// Don't Sort These!
import Icons from 'uikit/dist/js/uikit-icons';
// @ts-ignore
UIkit.use(Icons);

import Prism from "prismjs";
// Don't Sort These!
import "prismjs/components/prism-json";
import "prismjs/components/prism-hcl";

Prism.highlightAll();
/* eslint-enable */

// @ts-ignore
import translations from "./translations/index.mjs";

// Actual Imports
import { PageRouter } from "./pagerouter/PageRouter";
import { formatDistance } from "./formatDistance";
import { getSealStatus } from "./api/sys/getSealStatus";
//import { pageList } from "./allPages";
import { pageState } from "./globalPageState";
import { playground } from "./playground";
import { NavBar } from "./ui/elements/NavBar";
import { render, Component } from "preact";
import i18next from "i18next";
import Router from 'preact-router';
import { Home } from "./ui/pages/Home";
import { Me } from "./ui/pages/Me";
import { Login } from "./ui/pages/Login";
import { PasswordGenerator } from "./ui/pages/PwGen";
import { SetVaultURL } from "./ui/pages/SetVaultURL";
import { Unseal } from "./ui/pages/Unseal";
import { SetLanguage } from "./ui/pages/SetLanguage";
import { Secrets } from "./ui/pages/Secrets/SecretsHome";
import { TOTPView } from "./ui/pages/Secrets/TOTP/TOTPView";
import { TOTPNew } from "./ui/pages/Secrets/TOTP/TOTPNew";
import { TOTPDelete } from "./ui/pages/Secrets/TOTP/TOTPDelete";
import { NewSecretsEngine } from "./ui/pages/Secrets/NewSecretsEngine";
import { NewKVEngine } from "./ui/pages/Secrets/NewEngines/NewKVEngine";
import { NewTOTPEngine } from "./ui/pages/Secrets/NewEngines/NewTOTPEngine";
import { NewTransitEngine } from "./ui/pages/Secrets/NewEngines/NewTransitEngine";
import { DeleteSecretsEngine } from "./ui/pages/Secrets/DeleteSecretsEngine";
import { KeyValueView } from "./ui/pages/Secrets/KeyValue/KeyValueView";
import { KeyValueSecret } from "./ui/pages/Secrets/KeyValue/KeyValueSecret";
import { KeyValueSecretEdit } from "./ui/pages/Secrets/KeyValue/KeyValueSecretsEdit";
import { KeyValueDelete } from "./ui/pages/Secrets/KeyValue/KeyValueDelete";

async function onLoad(): Promise<void> {
  const Main = () => (
    <Router>
      <Home path="/" state={pageState} />
      <Me path="/me" state={pageState} />
      <Login path="/login" state={pageState} />
      <PasswordGenerator path="/pw_gen" />
      <SetVaultURL path="/set_vault_url" state={pageState} />
      <Unseal path="/unseal" state={pageState} />
      <SetLanguage path="/set_language" state={pageState} />

      <Secrets path="/secrets" state={pageState} />
      <DeleteSecretsEngine path="/secrets/delete_engine/:mount" state={pageState} />

      <NewSecretsEngine path="/secrets/new_secrets_engine" />
      <NewKVEngine path="/secrets/new_secrets_engine/kv" />
      <NewTOTPEngine path="/secrets/new_secrets_engine/totp" />
      <NewTransitEngine path="/secrets/new_secrets_engine/trasit" />

      <TOTPView path="/secrets/totp/list/:mount" state={pageState} />
      <TOTPNew path="/secrets/totp/new/:mount" state={pageState} />
      <TOTPDelete path="/secrets/totp/delete/:mount/:item" state={pageState} />

      <KeyValueView path="/secrets/kv/list/:mount+" state={pageState} />
      <KeyValueSecret path="/secrets/kv/view/:item/:mount+" state={pageState} />
      <KeyValueSecretEdit path="/secrets/kv/edit/:item/:mount+" state={pageState} />
      <KeyValueDelete path="/secrets/kv/delete/:item/:mount+" state={pageState} />

      <div default><p>PAGE NOT YET IMPLEMENTED</p></div>

    </Router>
  );
  render(
    <>
      <NavBar />
      <div class="uk-container uk-container-medium uk-align-center">
        <div class="uk-card uk-card-body">
          <Main />
        </div>
      </div>
    </>,
    document.body,
  );

  //const pageRouter = new PageRouter({
  //  pageList: pageList,
  //  state: pageState,
  //  pageTitleElement: document.querySelector("#pageTitle"),
  //  pageContentElement: document.querySelector("#pageContent"),
  //  resetElementContent: !true,
  //  onPageChange: async function () {
  //    pageState.currentPage = await pageRouter.getCurrentPageID();
  //    document.documentElement.dir = pageState.pageDirection;
  //  },
  //});
  //
  //reloadNavBar(pageRouter);

  if (process.env.NODE_ENV == "development") {
    // await playground(pageRouter);
  }

  //await pageRouter.changePage(pageState.currentPage);

  //setInterval(async () => {
  //  if ((await pageRouter.getCurrentPageID()) != "UNSEAL") {
  //    if (pageState.apiURL.length != 0) {
  //      return;
  //    }
  //    const sealStatus = await getSealStatus();
  //    if (sealStatus.sealed) {
  //      await pageRouter.changePage("UNSEAL");
  //      return;
  //    }
  //  }
  //}, 5000);
}

document.addEventListener(
  "DOMContentLoaded",
  async () => {
    console.log("Loading...");
    // @ts-expect-error
    console.log("Build Data:", BUILD_STRING);
    await i18next.init({
      lng: pageState.language,
      fallbackLng: "en",
      debug: true,
      // @ts-ignore
      resources: Object.fromEntries(
        Object.entries(translations).map(([k, v]) => [k, { translation: v }]),
      ),
      interpolation: {
        escape: (str) => {
          return str;
        },
        format: function (value: unknown, format, _): string {
          if (format === "until_date" && value instanceof Date)
            return formatDistance(new Date(), new Date(value), pageState.language);
          return value as string;
        },
      },
    });
    await onLoad();
  },
  false,
);
