<script lang="ts">
	import IssueList from "$lib/components/repo/issues/IssueList.svelte";
	import IssueToolbar from "$lib/components/repo/issues/IssueToolbar.svelte";
	import TabPanel from "$lib/components/ui/TabPanel.svelte";

	let { data } = $props();
</script>

<TabPanel padded={false} class="p-4">
	<IssueToolbar
		ownerHandle={data.repo.ownerHandle}
		repoName={data.repo.name}
		state={data.state}
		openCount={data.openCount}
		closedCount={data.closedCount}
	/>
</TabPanel>

<div class="mt-2">
	<IssueList ownerHandle={data.repo.ownerHandle} repoName={data.repo.name} issues={data.issues} />
</div>
