fix(catalog): hydrate CSR component pages

[aogzpa]

Description

This {% if not ssrOnly %} ... {% else %} ... {% endif %} is a conditional statement that checks if a front matter variable named ssrOnly is false.
If it is false then the JavaScript is loaded and hydrated onto the components nested inside on an idle callback via the <lit-island> utility.

Essentially, a <lit-island> tag is a wrapper or a container designed to encapsulate other Lit components and control when and how they are hydrated (become interactive) on the client side.

This PR fixes the layout structure to provide hydration or not depending on the ssrOnly attribute.

[asyncliz]

I'm not super familiar with the catalog's setup. What issue is this fixing/how can I test it?

[aogzpa]

I'm not super familiar with the catalog's setup. What issue is this fixing/how can I test it?

My apologies for the initial PR description's alarmist tone, this fix isn't addressing an obvious critical bug. Instead, it's about correcting the <is-land> tag's usage to align with its intended design and optimization patterns.

Right now, <is-land> is being used without wrapping the components it's meant to hydrate, but still components get hydrated and that's why there's no bug. While this may not cause immediate, visible errors everywhere, it negates the tag's purpose and introduces potential issues in specific scenarios, such as when fallback content is specified or when dependent components rely on the parent <is-land>'s ready state.
Refer to the official documentation for correct implementation:
https://github.com/11ty/is-land/blob/main/demo%2Fdemo-lit.html

Furthermore, analyzing the source code (https://github.com/11ty/is-land/blob/main/is-land.js) reveals a crucial hydration optimization: nested <is-land> elements wait for their parent <is-land> to complete hydration before proceeding. This sequential hydration underscores why <is-land> must always serve as a wrapper for the components it manages, ensuring efficient and dependent "island" activation.

BTW, I created a starter kit (boilerplate) using your catalog as base idea because I love how you set it up and I documented how everything works under the hood.

[asyncliz]

Thanks for the explanation! I think I understand :)