fix: prevent squishing of organization header plus button

[HarshMN2345]

What does this PR do?

Before

After

Test Plan

(Write your test plan here. If you changed any code, please provide us with clear instructions on how you verified your changes work.)

Related PRs and Issues

(If this PR is related to any other PR or resolves any issue or related to any issue link all related PR and issues here.)

Have you read the Contributing Guidelines on issues?

(Write your answer here.)

Summary by CodeRabbit

• New Features
  • Added a visual icon to the organization creation button in the header for improved user interface clarity and visual feedback.

_{✏️ Tip: You can customize this high-level summary in your review settings.}

[appwrite]

Console (appwrite/console)

Project ID: 688b7bf400350cbd60e9

Sites (1)

Site	Status	Logs	Preview	QR
console-stage 688b7cf6003b1842c9dc	Ready	View Logs	Preview URL

Tip

Each function runs in its own isolated container with custom environment variables

[coderabbitai]

Walkthrough

A single UI component file was modified to enhance button functionality. The icon prop was added to a Button component in the organization header, enabling an icon to display alongside the button that controls the create-organization modal or triggers the newOrgModal action. No changes were made to exported or public entity declarations.

Estimated code review effort

🎯 1 (Trivial) | ⏱️ ~3 minutes

• Localized single-file change with minimal scope
• Simple prop addition to existing component
• No logic modifications or structural refactoring
• Straightforward verification of UI enhancement intent

Pre-merge checks and finishing touches

✅ Passed checks (3 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title directly describes the main fix: preventing the squishing of the organization header plus button, which matches the change of adding an icon prop to the Button component in the header.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

✨ Finishing touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch fix-squished-icon-for-org-shortcut

---

📜 Recent review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 6c838e3 and 978bd4d.

📒 Files selected for processing (1)

• src/routes/(console)/organization-[organization]/header.svelte (1 hunks)

🧰 Additional context used

📓 Path-based instructions (5)

**/*.{ts,tsx,js,jsx,svelte}

📄 CodeRabbit inference engine (AGENTS.md)

**/*.{ts,tsx,js,jsx,svelte}: Import reusable modules from the src/lib directory using the $lib alias
Use minimal comments in code; reserve comments for TODOs or complex logic explanations
Use $lib, $routes, and $themes aliases instead of relative paths for module imports

Files:

• src/routes/(console)/organization-[organization]/header.svelte

src/routes/**/*.svelte

📄 CodeRabbit inference engine (AGENTS.md)

Use SvelteKit file conventions: +page.svelte for components, +page.ts for data loaders, +layout.svelte for wrappers, +error.svelte for error handling, and dynamic route params in square brackets like [param]

Files:

• src/routes/(console)/organization-[organization]/header.svelte

**/*.{ts,tsx,js,jsx,svelte,json}

📄 CodeRabbit inference engine (AGENTS.md)

Use 4 spaces for indentation, single quotes, 100 character line width, and no trailing commas per Prettier configuration

Files:

• src/routes/(console)/organization-[organization]/header.svelte

**/*.svelte

📄 CodeRabbit inference engine (AGENTS.md)

Use Svelte 5 + SvelteKit 2 syntax with TypeScript for component development

Files:

• src/routes/(console)/organization-[organization]/header.svelte

src/routes/**

📄 CodeRabbit inference engine (AGENTS.md)

Configure dynamic routes using SvelteKit convention with [param] syntax in route directory names

Files:

• src/routes/(console)/organization-[organization]/header.svelte

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (2)

• GitHub Check: e2e
• GitHub Check: build

🔇 Additional comments (1)

src/routes/(console)/organization-[organization]/header.svelte (1)

123-130: LGTM! The icon prop correctly fixes the button layout.

Adding the icon prop to this icon-only button is the appropriate fix for the squishing issue. This prop signals to the pink-svelte Button component to apply icon-button styling, which properly sizes and layouts the button containing only the plus icon.

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}