Add scroll to shop sidebar

[BerglundDaniel]

Cleaned up the git history in PR #366

Summary by CodeRabbit

• New Features

  • Implemented dynamic scrollability for the sidebar to enhance user navigation.

• Refactor

  • Improved sidebar code structure for better maintainability and readability.

• Style

  • Updated the website's global scrolling behavior with a new style rule.

[coderabbitai[bot]]

Walkthrough

The updates involve enhancing the user interface's scrolling functionality and dynamic behavior. The style.scss file has been configured to enable automatic vertical scrolling for the body element. In the TypeScript file for the sidebar component, new hooks have been introduced to manage the scrollability state of the sidebar, adjusting its behavior based on content height. The sidebar's markup has been updated to reflect this dynamic state and improve code readability, particularly around conditional elements.

Changes

File	Summary
public/scss/style.scss	Added overflow-y: auto; to the body selector to enable vertical scrolling.
public/ts/sidebar.tsx	Imported useEffect, useRef, useState from "preact/hooks"; added state and effect hooks for sidebar scrollability; refactored return element to use sidebarRef and conditional class; improved conditional rendering readability.

Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on X ?

---

Tips

### Chat with CodeRabbit Bot (`@coderabbitai`) - You can reply to a review comment made by CodeRabbit. - You can tag CodeRabbit on specific lines of code or files in the PR by tagging `@coderabbitai` in a comment. - You can tag `@coderabbitai` in a PR comment and ask one-off questions about the PR and the codebase. Use quoted replies to pass the context for follow-up questions. ### CodeRabbit Commands (invoked as PR comments) - `@coderabbitai pause` to pause the reviews on a PR. - `@coderabbitai resume` to resume the paused reviews. - `@coderabbitai review` to trigger a review. This is useful when automatic reviews are disabled for the repository. - `@coderabbitai resolve` resolve all the CodeRabbit review comments. - `@coderabbitai help` to get help. Additionally, you can add `@coderabbitai ignore` anywhere in the PR description to prevent this PR from being reviewed. ### CodeRabbit Configration File (`.coderabbit.yaml`) - You can programmatically configure CodeRabbit by adding a `.coderabbit.yaml` file to the root of your repository. - The JSON schema for the configuration file is available [here](https://coderabbit.ai/integrations/coderabbit-overrides.v2.json). - If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: `# yaml-language-server: $schema=https://coderabbit.ai/integrations/coderabbit-overrides.v2.json`