fix: submit create-project form on Enter

[HarshMN2345]

What does this PR do?

(Provide a description of what this PR does.)

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

• Refactor
  • Project creation now uses standard form submission mechanics instead of in-component click handling.
  • Improves form handling and accessibility while preserving the same user-facing project creation experience.

[appwrite]

Console

Project ID: 688b7bf400350cbd60e9

Sites (1)

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

Tip

Appwrite has a Discord community with over 16 000 members.

[coderabbitai]

Walkthrough

Replaces the in-component click-based submit flow in src/routes/(console)/onboarding/create-project/+page.svelte with a surrounding Form component that handles submission. The createProject invocation sequence is preserved; the submit button no longer has an on:click handler and is a type="submit" within the Form wrapper. An import for Form was added and the surrounding structure now uses form-based submission semantics.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~8 minutes

• Single file changed with a consistent pattern refactor
• Review points:
  • Confirm Form import is correct and the new wrapper triggers the same createProject action
  • Verify button is type="submit" and no residual on:click handlers remain
  • Check that form submission modifiers (e.g., preventDefault) or event handlers are present and appropriate
  • Validate accessibility and focus/keyboard behavior remain unchanged

Pre-merge checks and finishing touches

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	You can run @coderabbitai generate docstrings to improve docstring coverage.

✅ Passed checks (2 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title accurately describes the primary change: replacing an on:click handler with form-based submission to allow Enter key submission on the create-project form.

✨ Finishing touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch fix-SER-492-onboarding-enter-submits-create-project

---

📜 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 75b3157 and e607ea4.

📒 Files selected for processing (1)

• src/routes/(console)/onboarding/create-project/+page.svelte (2 hunks)

🧰 Additional context used

🧠 Learnings (3)

📓 Common learnings

Learnt from: ItzNotABug
Repo: appwrite/console PR: 2316
File: src/routes/(console)/project-[region]-[project]/functions/create-function/deploy/+page.svelte:29-29
Timestamp: 2025-09-08T13:20:47.308Z
Learning: The Form.svelte component in the Appwrite console creates a FormContext with isSubmitting as writable(false) and expects consumers to work with Svelte writable stores, not plain booleans.

Learnt from: ItzNotABug
Repo: appwrite/console PR: 2373
File: src/routes/(console)/project-[region]-[project]/databases/database-[database]/createTable.svelte:28-33
Timestamp: 2025-09-25T04:33:19.632Z
Learning: In the Appwrite console createTable component, manual submit state management (like setting creatingTable = true) is not needed because: 1) The Modal component handles submit state internally via submissionLoader, preventing double submissions, and 2) After successful table creation, the entire view is destroyed and replaced with the populated table view, ending the component lifecycle.

📚 Learning: 2025-09-08T13:20:47.308Z

Learnt from: ItzNotABug
Repo: appwrite/console PR: 2316
File: src/routes/(console)/project-[region]-[project]/functions/create-function/deploy/+page.svelte:29-29
Timestamp: 2025-09-08T13:20:47.308Z
Learning: The Form.svelte component in the Appwrite console creates a FormContext with isSubmitting as writable(false) and expects consumers to work with Svelte writable stores, not plain booleans.

Applied to files:

• src/routes/(console)/onboarding/create-project/+page.svelte

📚 Learning: 2025-09-25T04:33:19.632Z

Learnt from: ItzNotABug
Repo: appwrite/console PR: 2373
File: src/routes/(console)/project-[region]-[project]/databases/database-[database]/createTable.svelte:28-33
Timestamp: 2025-09-25T04:33:19.632Z
Learning: In the Appwrite console createTable component, manual submit state management (like setting creatingTable = true) is not needed because: 1) The Modal component handles submit state internally via submissionLoader, preventing double submissions, and 2) After successful table creation, the entire view is destroyed and replaced with the populated table view, ending the component lifecycle.

Applied to files:

• src/routes/(console)/onboarding/create-project/+page.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: build
• GitHub Check: e2e

🔇 Additional comments (3)

src/routes/(console)/onboarding/create-project/+page.svelte (3)

3-3: LGTM: Form import added correctly.

The Form component import is properly structured and necessary for the form-based submission approach.

---

40-73: Manual state management coexists with Form component's internal handling.

The isLoading state serves a dual purpose: controlling the loading animation display and preventing double submissions. While the Form component handles submission state internally (per learnings), the manual isLoading management is appropriate here since it drives the UI transition to the Loading component. The two mechanisms should work together without conflict.

---

101-116: No issues found. The form submission structure is correct.

The Form component properly renders as an HTML <form> element and the submit button (inside the snippet passed to CreateProject) will be rendered within the form's markup. When you trace the component hierarchy:

• Form wraps CreateProject as an actual <form> element
• CreateProject renders its content (including the submit snippet) inside its Layout.Stack
• The button with type="submit" will trigger form submission correctly
• Enter key submission will work as expected

The code is functioning as intended.

---

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.}