<template>
	<DiffEntry
		:title
		:entries
	/>
</template>

<script lang="ts" setup>
const props = defineProps<{
	title: string,
	before: string,
	after: string,
	state: "deleted" | "created" | "modified",
}>();
const entries = computed((): ["added" | "removed", string][] => {
	if (props.state === "created") {
		return props.after ? [["added", props.after]] : [];
	}
	if (props.state === "deleted") {
		return props.before ? [["removed", props.before]] : [];
	}
	if (props.state === "modified") {
		if (props.after === props.before)
			return [];
		if (!props.after)
			return [["removed", props.before]];
		if (!props.before)
			return [["added", props.after]];
		return [
			["removed", props.before],
			["added", props.after],
		];
	}
	return [];
});
</script>
