feat: added comments

src/routes/akti/[aktiId]/+page.svelte

@@ -4,10 +4,17 @@
 	import { EditOutline, CloseOutline } from 'flowbite-svelte-icons';
 	import AktiEditor from '$lib/components/akti/AktiEditor.svelte';
 	import UserDisplay from '$lib/components/UserDisplay.svelte';
+	import RatingCard from '$lib/components/rating/RatingCard.svelte';
+	import { resolve } from '$app/paths';
 
 	let { data }: PageProps = $props();
 
 	let edit = $state(false);
+	let canComment = $derived.by(() => {
+		if (!data.session) return false;
+		if (data.akti.author.id === data.session.user.id) return false;
+		return true;
+	});
 </script>
 
 <div class="flex justify-between">
@@ -37,4 +44,19 @@
 	</div>
 	<!-- eslint-disable-next-line svelte/no-at-html-tags -->
 	{@html data.akti.body}
+
+	<div class="mt-10 mb-5 flex justify-between items-center">
+		<h3>Kommentär</h3>
+		{#if canComment}
+			<Button href={resolve('/akti/[aktiId]/comment', { aktiId: data.akti.id })}>
+				Ä Kommentar da la
+			</Button>
+		{/if}
+	</div>
+
+	<section class="grid grid-cols-1 gap-5 2xl:grid-cols-3">
+		{#each data.ratings as rating (rating.id)}
+			<RatingCard {rating} />
+		{/each}
+	</section>
 {/if}