/*
 This file is part of GNU Taler
 (C) 2022-2024 Taler Systems S.A.

 GNU Taler is free software; you can redistribute it and/or modify it under the
 terms of the GNU General Public License as published by the Free Software
 Foundation; either version 3, or (at your option) any later version.

 GNU Taler is distributed in the hope that it will be useful, but WITHOUT ANY
 WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR
 A PARTICULAR PURPOSE.  See the GNU General Public License for more details.

 You should have received a copy of the GNU General Public License along with
 GNU Taler; see the file COPYING.  If not, see <http://www.gnu.org/licenses/>
 */
import {
  AbsoluteTime,
  Amounts,
  HttpStatusCode,
  TalerExchangeApi,
  TalerProtocolTimestamp,
  assertUnreachable
} from "@gnu-taler/taler-util";
import {
  Button,
  LocalNotificationBanner,
  RenderAllFieldsByUiConfig,
  useExchangeApiContext,
  useLocalNotificationHandler,
  useTranslationContext
} from "@gnu-taler/web-util/browser";
import { Fragment, VNode, h } from "preact";
import { privatePages } from "../Routing.js";
import { BaseForm, uiForms } from "../forms/declaration.js";
import { useFormState } from "../hooks/form.js";
import { useOfficer } from "../hooks/officer.js";
import { HandleAccountNotReady } from "./HandleAccountNotReady.js";
import { Justification } from "./CaseDetails.js";

export function CaseUpdate({
  account,
  type: formId,
}: {
  account: string;
  type: string;
}): VNode {
  const { i18n } = useTranslationContext();
  const officer = useOfficer();
  const {
    lib: { exchange: api },
  } = useExchangeApiContext();

  // const [notification, notify, handleError] = useLocalNotification();
  const [notification, withErrorHandler] = useLocalNotificationHandler();
  const { config } = useExchangeApiContext();

  const initial = {
    when: AbsoluteTime.now(),
    state: TalerExchangeApi.AmlState.pending,
    threshold: Amounts.zeroOfCurrency(config.currency),
  };

  if (officer.state !== "ready") {
    return <HandleAccountNotReady officer={officer} />;
  }
  const theForm = uiForms.forms(i18n).find((v) => v.id === formId);
  if (!theForm) {
    return <div>form with id {formId} not found</div>;
  }

  const [form, state] = useFormState<BaseForm>(initial, (st) => {
    return {
      status: "ok",
      result: st as any,
      errors: undefined,
    };
  });

  const ff = theForm.impl(state.result as any);

  const validatedForm = state.status === "fail" ? undefined : state.result;

  const submitHandler =
    validatedForm === undefined
      ? undefined
      : withErrorHandler(
          () => {
            const justification: Justification = {
              id: theForm.id,
              label: theForm.label,
              version: theForm.version,
              value: validatedForm,
            };

            const decision: Omit<TalerExchangeApi.AmlDecision, "officer_sig"> =
              {
                justification: JSON.stringify(justification),
                decision_time: TalerProtocolTimestamp.now(),
                h_payto: account,
                new_state: justification.value.state,
                new_threshold: Amounts.stringify(justification.value.threshold),
                kyc_requirements: undefined,
              };

            return api.addDecisionDetails(officer.account, decision);
          },
          () => {
            window.location.href = privatePages.cases.url({});
          },
          (fail) => {
            switch (fail.case) {
              case HttpStatusCode.Forbidden:
              case HttpStatusCode.Unauthorized:
                return i18n.str`Wrong credentials for "${officer.account}"`;
              case HttpStatusCode.NotFound:
                return i18n.str`Officer or account not found`;
              case HttpStatusCode.Conflict:
                return i18n.str`Officer disabled or more recent decision was already submitted.`;
              default:
                assertUnreachable(fail);
            }
          },
        );

  // const asd = ff.design[0]?.fields[0]?.props
  
  return (
    <Fragment>
      <LocalNotificationBanner notification={notification} />
      <div class="space-y-10 divide-y -mt-5 divide-gray-900/10">
        {ff.design.map((section, i) => {
          if (!section) return <Fragment />;
          return (
            <div
              key={i}
              class="grid grid-cols-1 gap-x-8 gap-y-8 pt-5 md:grid-cols-3"
            >
              <div class="px-4 sm:px-0">
                <h2 class="text-base font-semibold leading-7 text-gray-900">
                  {section.title}
                </h2>
                {section.description && (
                  <p class="mt-1 text-sm leading-6 text-gray-600">
                    {section.description}
                  </p>
                )}
              </div>
              <div class="bg-white shadow-sm ring-1 ring-gray-900/5 rounded-md md:col-span-2">
                <div class="p-3">
                  <div class="grid max-w-2xl grid-cols-1 gap-x-6 gap-y-8 sm:grid-cols-6">
                    <RenderAllFieldsByUiConfig
                      key={i}
                      fields={section.fields}
                    />
                  </div>
                </div>
              </div>
            </div>
          );
        })}
      </div>

      <div class="mt-6 flex items-center justify-end gap-x-6">
        <a
          href={privatePages.caseDetails.url({ cid: account })}
          class="text-sm font-semibold leading-6 text-gray-900"
        >
          <i18n.Translate>Cancel</i18n.Translate>
        </a>
        <Button
          type="submit"
          handler={submitHandler}
          class="rounded-md bg-indigo-600 px-3 py-2 text-sm font-semibold text-white shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600"
        >
          <i18n.Translate>Confirm</i18n.Translate>
        </Button>
      </div>
    </Fragment>
  );
}

export function SelectForm({ account }: { account: string }) {
  const { i18n } = useTranslationContext();
  return (
    <div>
      <pre>New form for account: {account.substring(0, 16)}...</pre>
      {uiForms.forms(i18n).map((form) => {
        return (
          <a
            key={form.id}
            href={privatePages.caseUpdate.url({ cid: account, type: form.id })}
            class="m-4 block rounded-md w-fit border-0 p-3 py-2 text-center text-sm bg-indigo-700 text-white shadow-sm hover:bg-indigo-600"
          >
            {form.label}
          </a>
        );
      })}
    </div>
  );
}