import { ConfigService } from "../../configService/index.mjs";
import { useUser } from "../../utilities/auth/useUser.mjs";
import { useAxiosGet } from "../../utilities/useAxiosGet.mjs";
import { amcharts_exports } from "./amcharts/index.mjs";
import React, { useMemo } from "react";
//#region src/UI/charts/InsightRenderer.tsx
const capitilizeFirstLetter = (s) => s?.charAt?.(0)?.toUpperCase?.() + s?.slice?.(1);
const decapitilizeFirstLetter = (s) => s?.charAt?.(0)?.toLowerCase?.() + s?.slice?.(1);
function getAggregateValue(data, key) {
	return data?.aggregateResults?.[0]?.[key];
}
/**
* InsightRenderer component
*
* This component is responsible for rendering insights based on the provided props.
*
* @prop {Insight} `insight` - The insight metadata
* @prop {any} `data` - Search results associated with the insight
* @prop {string} `insightId` - InsightId, if included the component will get the data from server
* @returns {JSX.Element} - The rendered insight component.
*/
const InsightRenderer = (props) => {
	const { insight: insightProp, data, insightId } = props;
	const user = useUser();
	const [{ data: loadedInsight }] = useAxiosGet(ConfigService.integrationV2ApiUrl, `Insight/${insightId}/Full`, {}, !insightId || !user);
	const insight = useMemo(() => {
		if (!!insightId) return loadedInsight;
		else return insightProp;
	}, [
		loadedInsight,
		insightId,
		insightProp
	]);
	const Chart = useMemo(() => {
		if (!insight?.insightInsightType?.properties) return null;
		let properties;
		if (typeof insight?.insightInsightType?.properties === "string") properties = JSON.parse(insight?.insightInsightType?.properties);
		else properties = insight?.insightInsightType?.properties;
		return amcharts_exports?.[properties?.component];
	}, [insight?.insightInsightType]);
	const kpis = useMemo(() => {
		if (insight == null) return void 0;
		return insight?.insightInsightKpi?.map?.((kpi) => {
			const kpiField = typeof kpi.field === "object" ? kpi.field : JSON.parse(kpi.field);
			console.log(kpiField);
			return {
				label: kpi.label,
				active: kpi.active,
				value: getAggregateValue(data, `${decapitilizeFirstLetter(kpiField.property ?? "") ?? ""}${capitilizeFirstLetter(kpiField.operation?.toLowerCase() ?? "")}`)
			};
		});
	}, [data, insight?.insightInsightKpi]);
	const dataConfig = useMemo(() => {
		if (insight == null) return null;
		const dataMapping = typeof insight.dataMapping === "object" ? insight.dataMapping : JSON.parse(insight.dataMapping ?? "{}");
		return (typeof insight.insightInsightType?.dataFields === "object" ? insight.insightInsightType?.dataFields : JSON.parse(insight.insightInsightType?.dataFields ?? "{}"))?.reduce?.((value, field) => {
			const fieldValue = dataMapping?.find?.((dm) => dm.name === field.name)?.value;
			if (fieldValue?.operation != void 0) value[field.name] = decapitilizeFirstLetter(fieldValue?.name) + fieldValue.operation;
			else value[field.name] = fieldValue?.alias ?? fieldValue?.name ?? fieldValue;
			return value;
		}, {});
	}, [insight?.dataMapping, insight?.insightInsightType]);
	const combinedData = useMemo(() => {
		if (data?.aggregateResults == null || data?.aggregateResults?.length === 0) return data?.pageList;
		return data?.pageList.map((page, i) => ({
			...page,
			...data?.aggregateResults?.[i]
		}));
	}, [data]);
	if (Chart == null) return null;
	return /* @__PURE__ */ React.createElement(Chart, {
		data: combinedData,
		title: insight?.title,
		subheader: insight?.subheader,
		...dataConfig,
		kpis: kpis?.filter((kpi_0) => kpi_0.active)
	});
};
//#endregion
export { InsightRenderer };

//# sourceMappingURL=InsightRenderer.mjs.map