log101/log101-dot-dev
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

chore: add validation and debounce to forms

Browse Source
This commit is contained in:
log101 2024-06-22 16:53:51 +03:00
parent 2b9d6d8657
commit 82d2c69e11
2 changed files with 22 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/components/CommentForm.astro
View File

@ -32,7 +32,8 @@ const backendHost = import.meta.env.PUBLIC_BACKEND_HOST;
class="textarea py-2 px-3 w-full box-border" class="textarea py-2 px-3 w-full box-border"
rows="5" rows="5"
placeholder="Yazı hakkındaki düşünceleriniz nelerdir?" placeholder="Yazı hakkındaki düşünceleriniz nelerdir?"
name="commentBody"></textarea> name="commentBody"
required></textarea>
<input <input
type="text" type="text"
class="w-full py-2 px-3 box-border" class="w-full py-2 px-3 box-border"

39
src/components/EmojiReactionForm.astro
View File

@ -16,7 +16,8 @@ const backendHost = import.meta.env.PUBLIC_BACKEND_HOST;
<form <form
hx-post=`${backendHost}/api/blog/forms/emoji` hx-post=`${backendHost}/api/blog/forms/emoji`
hx-target="#reaction-buttons"> hx-target="#reaction-buttons"
hx-trigger="submit delay:0.5s">
<input type="hidden" name="postId" value=`${entryId}` /> <input type="hidden" name="postId" value=`${entryId}` />
<div <div
id="reaction-buttons" id="reaction-buttons"
@ -24,24 +25,24 @@ const backendHost = import.meta.env.PUBLIC_BACKEND_HOST;
hx-trigger="load" hx-trigger="load"
hx-swap="innerHTML"> hx-swap="innerHTML">
<div class="emoji-buttons-container"> <div class="emoji-buttons-container">
<button name="emojiInput" value="👍" type="submit" class="emoji-button" <button name="emojiInput" value="👍" type="submit" class="emoji-button">
>&nbsp;👍&nbsp;</button &nbsp;👍&nbsp;
> </button>
<button name="emojiInput" value="👎" type="submit" class="emoji-button" <button name="emojiInput" value="👎" type="submit" class="emoji-button">
>&nbsp;👎&nbsp;</button &nbsp;👎&nbsp;
> </button>
<button name="emojiInput" value="😀" type="submit" class="emoji-button" <button name="emojiInput" value="😀" type="submit" class="emoji-button">
>&nbsp;😀&nbsp;</button &nbsp;😀&nbsp;
> </button>
<button name="emojiInput" value="😑" type="submit" class="emoji-button" <button name="emojiInput" value="😑" type="submit" class="emoji-button">
>&nbsp;😑&nbsp;</button &nbsp;😑&nbsp;
> </button>
<button name="emojiInput" value="🤢" type="submit" class="emoji-button" <button name="emojiInput" value="🤢" type="submit" class="emoji-button">
>&nbsp;🤢&nbsp;</button &nbsp;🤢&nbsp;
> </button>
<button name="emojiInput" value="👀" type="submit" class="emoji-button" <button name="emojiInput" value="👀" type="submit" class="emoji-button">
>&nbsp;👀&nbsp;</button &nbsp;👀&nbsp;
> </button>
</div> </div>
</div> </div>
</form> </form>