<script lang="ts">
	import { useGeometries } from '../../../hooks/useGeometries.svelte'
	import { usePointcloudObjects } from '../../../hooks/usePointcloudObjects.svelte'
	import { usePointClouds } from '../../../hooks/usePointclouds.svelte'
	import { useRefetchPoses } from '../../../hooks/useRefetchPoses'
	import { RefreshRates } from '../../../hooks/useSettings.svelte'

	import RefreshRate from '../RefreshRate.svelte'

	const geometries = useGeometries()
	const pointclouds = usePointClouds()
	const pointcloudObjects = usePointcloudObjects()
	const { refetchPoses } = useRefetchPoses()
</script>

<div class="flex flex-col gap-2.5 text-xs">
	<h3 class="border-gray-3 border-b py-1 text-sm"><strong>Polling rates</strong></h3>

	<RefreshRate
		id={RefreshRates.poses}
		label="Poses"
		allowLive
		onManualRefetch={() => {
			refetchPoses()
			geometries.refetch()
		}}
	/>
	<RefreshRate
		id={RefreshRates.pointclouds}
		label="Pointclouds from cameras"
		onManualRefetch={() => {
			pointclouds.refetch()
		}}
	/>
	<RefreshRate
		id={RefreshRates.vision}
		label="Vision service pointcloud segments and objects"
		onManualRefetch={() => {
			pointcloudObjects.refetch()
		}}
	/>
</div>
