import bla
interface Props { ... }
export default ({ ... }: Props) => {
// computations depending on props
return (
<div>
...
</div>
);
}The structure is linear (imports, type definitions, computations, markup), and yet I always have these stupid useless indentations. In Astro it would look like this:
---
import bla
interface Props { ... }
const { ... } = Astro.props;
// computations depending on props
---
<div>
...
</div>