/**
 * @copyright nhcarrigan
 * @license Naomi's Public License
 * @author Naomi Carrigan
 */
/* global localStorage -- this runs in the browser */
import { CommonModule } from "@angular/common";
import { Component } from "@angular/core";
import { FormControl, ReactiveFormsModule } from "@angular/forms";
import { RouterModule } from "@angular/router";
import { ApiService } from "../api.service";
import { ErrorComponent } from "../error/error.component";
import { SingleLineComponent }
  from "../inputs/single-line/single-line.component";

@Component({
  imports: [
    CommonModule,
    ReactiveFormsModule,
    RouterModule,
    SingleLineComponent,
    ErrorComponent,
  ],
  selector:    "app-review",
  styleUrl:    "./review.component.css",
  templateUrl: "./review.component.html",
})
export class ReviewComponent {
  public error = "";
  public token = new FormControl("");
  public valid = false;
  public data: Array<{
    email: string; id: string; info: Array<{ key: string; value: unknown }>;
  }> = [];

  public view:
    | ""
    | "appeals"
    | "commissions"
    | "contacts"
    | "events"
    | "meetings"
    | "mentorships"
    | "staff"
    | "testimonials" = "";

  public constructor(private readonly apiService: ApiService) {
    const storedToken = localStorage.getItem("token");
    if (storedToken === null) {
      return;
    }
    this.apiService.validateToken(storedToken).
      then((valid) => {
        if (valid) {
          this.valid = true;
          this.token.setValue(storedToken);
        } else {
          this.error = "The token found in local storage is invalid.";
          this.valid = false;
        }
      }).
      catch(() => {
        // eslint-disable-next-line stylistic/max-len -- Long string
        this.error = "An error occurred while validating the token found in local storage.";
        this.valid = false;
      });
  }

  public submit(event: MouseEvent): void {
    this.error = "";
    const { form } = event.target as HTMLButtonElement;
    const valid = form?.reportValidity();
    if (valid !== true) {
      return;
    }

    this.apiService.
      validateToken(this.token.value).
      then((tokenValid) => {
        if (tokenValid) {
          this.valid = true;
          localStorage.setItem("token", this.token.value as string);
        } else {
          this.error = "The token you entered is invalid.";
          this.valid = false;
        }
      }).
      catch(() => {
        this.error = "An error occurred while submitting the form.";
        this.valid = false;
      });
  }

  public markReviewed(id: string): void {
    const view = this.view as
    | "appeals"
    | "commissions"
    | "contacts"
    | "events"
    | "meetings"
    | "mentorships"
    | "staff"
    | "testimonials";
    void this.apiService.
      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- We know token is not null
      markReviewed(view, id, this.token.value!).then((data) => {
        if ("error" in data) {
          this.error = data.error;
        } else {
          this.data = this.data.filter((item) => {
            return item.id !== id;
          });
        }
      });
  }

  public setView(
    view:
      | "appeals"
      | "commissions"
      | "contacts"
      | "events"
      | "meetings"
      | "mentorships"
      | "staff"
      | "testimonials",
  ): void {
    this.view = view;
    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- We know token is not null
    void this.apiService.getData(view, this.token.value!).then((data) => {
      if ("error" in data) {
        this.error = data.error;
      } else {
        this.data = (data.data as Array<
          { email: string; id: string } & Record<string, unknown>
        >).map((item) => {
          const object:
          {
            email: string;
            id:    string;
            info:  Array<{ key: string; value: unknown }>;
          }
          = { email: item.email, id: item.id, info: [] };
          for (const key in item) {
            if (![ "email", "id" ].includes(key)) {
              object.info.push({ key: key, value: item[key] });
            }
          }
          return object;
        });
      }
    });
  }
}