// Copyright Epic Games, Inc. All Rights Reserved.

"use strict";

import { ZenPage } from "./page.js"
import { Fetcher } from "../util/fetcher.js"
import { Friendly } from "../util/friendly.js"
import { Modal } from "../util/modal.js"
import { Table, PropTable, Toolbar } from "../util/widgets.js"

////////////////////////////////////////////////////////////////////////////////
export class Page extends ZenPage
{
	async main()
	{
		// info
		var section = this.add_section("info");

		const project = this.get_param("project");

		this.set_title("project - " + project);

		var info = await new Fetcher().resource("prj", project).json();
		var prop_table = section.add_widget(PropTable);
		for (const key in info)
		{
			if (key == "oplogs")
				continue;

			prop_table.add_property(key, info[key]);
		}

		// oplog
		section = this.add_section("oplogs");

		var oplog_table = section.add_widget(
			Table,
			["name", "marker", "size", "ops", "expired", "actions"],
			Table.Flag_PackRight
		)

		var count = 0;
		for (const oplog of info["oplogs"])
		{
			const name = oplog["id"];

			var info = new Fetcher().resource("prj", project, "oplog", name).json();

			var row = oplog_table.add_row(name);

			var cell = row.get_cell(0);
			this.as_link(cell, "oplog", name)

			cell = row.get_cell(-1);
			const action_tb = new Toolbar(cell, true).left();
			this.as_link(action_tb.add("list"), "oplog", name);
			this.as_link(action_tb.add("tree"), "tree", name);
			action_tb.add("drop").on_click((x) => this.drop_oplog(x), name);

			info = await info;
			row.get_cell(1).text(info["markerpath"]);
			row.get_cell(2).text(Friendly.kib(info["totalsize"]));
			row.get_cell(3).text(Friendly.sep(info["opcount"]));
			row.get_cell(4).text(info["expired"]);
		}
	}

	as_link(component, page, oplog_id)
	{
		component.link("", {
			"page" : page,
			"project" : this.get_param("project"),
			"oplog" : oplog_id,
		});
	}

	drop_oplog(oplog_id)
	{
		const drop = async () => {
			await new Fetcher()
				.resource("prj", this.get_param("project"), "oplog", oplog_id)
				.delete();
			this.reload();
		};

		new Modal()
			.title("Confirmation")
			.message(`Drop oplog '${oplog_id}'?`)
			.option("Yes", () => drop())
			.option("No");
	}
}