Props based on route generate hydration missmatch

// /pages/tools/[tool_slug].vue
<template>
    <div>
        <tool :config="tools[tool_slug]" />
    </div>
</template>
<script setup>
import tools from '~/assets/templates/en.json'
const route = useRoute()
const { tool_slug } = route.params
if (!tools?.[tool_slug]?.title) {
    throw createError({ statusCode:404, statusMessage:"Tool not found" })
}
</script>