fix save and close buttons

This commit is contained in:
Robin Olsen
2026-03-25 20:30:04 +01:00
parent 7a08aa4bd2
commit 859db365d3
2 changed files with 31 additions and 31 deletions

View File

@@ -139,7 +139,7 @@ templ DashboardContent(props DashboardProps) {
</div> </div>
</template> </template>
<template x-for="issue in issues" :key="issue.id"> <template x-for="issue in issues" :key="issue.id">
<div x-show="issue.id === selectedId" class="issue-detail max-w-3xl mx-auto" x-data="{ editing: null, saving: false, newComment: '', async addComment() { if (!this.newComment.trim()) return; const author = issue.created_by || 'Anonymous'; const response = await fetch('/issues/' + issue.id + '/comments', { method: 'POST', body: new URLSearchParams({text: this.newComment, author: author}) }); const newComment = await response.json(); if (!issue.comments) issue.comments = []; issue.comments.push(newComment); this.newComment = ''; } }"> <div x-show="issue.id === selectedId" class="issue-detail max-w-3xl mx-auto" x-data="{ editing: null, saving: false, newComment: '', async saveField(field, value) { const formData = new URLSearchParams(); formData.append(field, value || ''); await fetch('/issues/' + issue.id, { method: 'PATCH', body: formData, headers: { 'HX-Request': 'true' } }); this.editing = null; }, async addComment() { if (!this.newComment.trim()) return; const author = issue.created_by || 'Anonymous'; const response = await fetch('/issues/' + issue.id + '/comments', { method: 'POST', body: new URLSearchParams({text: this.newComment, author: author}) }); const newComment = await response.json(); if (!issue.comments) issue.comments = []; issue.comments.push(newComment); this.newComment = ''; } }">
<div class="card bg-base-100 shadow-md"> <div class="card bg-base-100 shadow-md">
<div class="card-body p-2"> <div class="card-body p-2">
<div class="m-2"> <div class="m-2">
@@ -161,12 +161,12 @@ templ DashboardContent(props DashboardProps) {
@keydown.escape="editing = null" @keydown.escape="editing = null"
x-init="$el.focus()" x-init="$el.focus()"
/> />
<button class="btn btn-sm btn-primary" @click="fetch('/issues/' + issue.id, { method: 'PATCH', body: new URLSearchParams({title: issue.title}) }).then(() => editing = null)">Save</button> <button class="btn btn-sm btn-primary" @click="fetch('/issues/' + issue.id, { method: 'PATCH', body: new URLSearchParams({title: issue.title}) }).then(() => editing = null)">Save</button>
<button class="btn btn-sm" @click="editing = null">Cancel</button> <button class="btn btn-sm" @click.stop="editing = null">Cancel</button>
</div> </div>
</template> </template>
</div> </div>
<div class="flex gap-2 flex-wrap items-center"> <div class="flex gap-2 flex-wrap items-center">
<template x-if="editing !== 'status'"> <template x-if="editing !== 'status'">
<span <span
class="badge badge-info badge-sm cursor-pointer hover:badge-primary whitespace-nowrap shrink-0" class="badge badge-info badge-sm cursor-pointer hover:badge-primary whitespace-nowrap shrink-0"
@@ -187,11 +187,11 @@ templ DashboardContent(props DashboardProps) {
<option value="in_progress">In Progress</option> <option value="in_progress">In Progress</option>
<option value="blocked">Blocked</option> <option value="blocked">Blocked</option>
<option value="closed">Closed</option> <option value="closed">Closed</option>
</select> </select>
<button class="btn btn-xs" @click="editing = null">Cancel</button> <button class="btn btn-xs" @click.stop="editing = null">Cancel</button>
</div> </div>
</template> </template>
<template x-if="editing !== 'type'"> <template x-if="editing !== 'type'">
<span <span
class="badge badge-outline badge-sm cursor-pointer hover:badge-primary whitespace-nowrap" class="badge badge-outline badge-sm cursor-pointer hover:badge-primary whitespace-nowrap"
x-text="issue.issue_type" x-text="issue.issue_type"
@@ -235,13 +235,13 @@ templ DashboardContent(props DashboardProps) {
<option value="1">Low (P1)</option> <option value="1">Low (P1)</option>
<option value="2">Normal (P2)</option> <option value="2">Normal (P2)</option>
<option value="3">High (P3)</option> <option value="3">High (P3)</option>
<option value="4">Critical (P4)</option> <option value="4">Critical (P4)</option>
</select> </select>
<button class="btn btn-xs" @click="editing = null">Cancel</button> <button class="btn btn-xs" @click.stop="editing = null">Cancel</button>
</div> </div>
</template> </template>
</div> </div>
<div class="mt-4"> <div class="mt-4">
<h3 class="text-sm font-semibold opacity-70 mb-1">Description</h3> <h3 class="text-sm font-semibold opacity-70 mb-1">Description</h3>
<template x-if="editing !== 'description'"> <template x-if="editing !== 'description'">
<p <p
@@ -261,11 +261,11 @@ templ DashboardContent(props DashboardProps) {
x-init="$el.focus()" x-init="$el.focus()"
></textarea> ></textarea>
<div class="flex gap-2"> <div class="flex gap-2">
<button <button
class="btn btn-sm btn-primary" class="btn btn-sm btn-primary"
@click="fetch('/issues/' + issue.id, { method: 'PATCH', body: new URLSearchParams({description: issue.description || ''}) }); editing = null" @click="saveField('description', issue.description)"
>Save</button> >Save</button>
<button class="btn btn-sm" @click="editing = null">Cancel</button> <button class="btn btn-sm" @click.stop="editing = null">Cancel</button>
</div> </div>
</div> </div>
</template> </template>
@@ -300,16 +300,16 @@ templ DashboardContent(props DashboardProps) {
x-model="issue.assignee" x-model="issue.assignee"
class="input input-sm input-bordered" class="input input-sm input-bordered"
placeholder="Enter assignee name" placeholder="Enter assignee name"
@keydown.enter="fetch('/issues/' + issue.id, { method: 'PATCH', body: new URLSearchParams({assignee: issue.assignee || ''}) }); editing = null" @keydown.enter="saveField('assignee', issue.assignee)"
@keydown.escape="editing = null" @keydown.escape="editing = null"
x-init="$el.focus()" x-init="$el.focus()"
/> />
<div class="flex gap-1 mt-1"> <div class="flex gap-1 mt-1">
<button <button
class="btn btn-xs btn-primary" class="btn btn-xs btn-primary"
@click="fetch('/issues/' + issue.id, { method: 'PATCH', body: new URLSearchParams({assignee: issue.assignee || ''}) }); editing = null" @click="saveField('assignee', issue.assignee)"
>Save</button> >Save</button>
<button class="btn btn-xs" @click="editing = null">Cancel</button> <button class="btn btn-xs" @click.stop="editing = null">Cancel</button>
</div> </div>
</div> </div>
</template> </template>

File diff suppressed because one or more lines are too long