<!--
	SPDX-FileCopyrightText: © 2025 Hornwitser <code@hornwitser.no>
	SPDX-License-Identifier: AGPL-3.0-or-later
-->
<template>
	<div>
		<h4>{{ state }} {{ role.name }}</h4>
		<DiffFieldString
			title="Name"
			:before="role.serverName"
			:after="role.name"
			:state
		/>
		<DiffFieldString
			title="Description"
			:before="role.serverDescription"
			:after="role.description"
			:state
		/>
	</div>
</template>

<script lang="ts" setup>
const props = defineProps<{
	role: ClientScheduleRole,
}>();
const state = computed(() => {
	if (props.role.deleted) return "deleted";
	if (props.role.isNew()) return "created";
	return "modified";
});
</script>
