fix: Prevent incomplete submissions and defer captcha verification

[narcode]

Related Issues
Fixes #91 and adds input verification before allowing for moment submission

Proposed Changes (Optional)

• reactively disable the "Add" button if the required payload is incomplete
• defer the captcha verification until the required inputs are fulfilled and the user clicks "Add moment"

Additional context (Optional)

[netlify]

✅ Deploy Preview for qtmmirror ready!

Name	Link
🔨 Latest commit	5333c79
🔍 Latest deploy log	https://app.netlify.com/sites/qtmmirror/deploys/66ca3dba35d6ed0008850725
😎 Deploy Preview	https://deploy-preview-92--qtmmirror.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[jokroese]

These changes enable the add button only when users hover over the add button. As hovering is only possible on desktop, these changes would block mobile users from being able to submit moments.

Instead, the core functionality should be tied to clicking which is possible on all devices.

[jokroese]

I suggest:

1. Deriving the isAddButtonDisabled boolean reactively. (Currently it is tied to hovering over the add button).
2. Requesting the captcha on clicking the add button.

[narcode]

Oh yeah! I completly forgot about mobile. Great catch! Will process the changes you suggest! 👍

[narcode]

@jokroese I have updated the PR from your comments. Super nice and swifty the $: reactive statements in svelte! didn't know it and I am positively surprised :)

[Elie-Simard]

I see #76 just got resolve? Else we could also add this to src/routes/moments/+server.ts on line 12

  // Empty description check
  if (!description || description.trim() === '') {
    return json({ error: 'Description cannot be empty.' }, { status: 400 });
  } 

[narcode]

I see #76 just got resolve? Else we could also add this to src/routes/moments/+server.ts on line 12

  // Empty description check
  if (!description || description.trim() === '') {
    return json({ error: 'Description cannot be empty.' }, { status: 400 });
  } 

With the latest changes that disable/enable the AddButton reactively we can be confident that empty descriptions cannot reach the server. Only when the description is present (plus the point coordinates) can the moment be submitted.

I would assume the PR as it is now should be fine and #76 can be considered fixed but if the general consensus is to add the server guard i’m happy to add it too.

[narcode]

@jokroese @Elie-Simard I thought thoroughly about @Elie-Simard comment regarding #76 and it is not overkill to also add the check at the server level.

This however made me realize that the real solution is to improve the data model at DB level and add a migration to that makes descritpions or coordinates NOT NULL. This is definetly out of the scope of this ticket and we could make a new issue for revisiting the DB model.

[jokroese]

Simple, elegant, beautiful.