chore: release v0.1.0.45

Aktions-Spalte im Flex-Layout statt absoluter Positionierung, mit responsivem Stacking auf schmalen Viewports.

Co-authored-by: Cursor <cursoragent@cursor.com>

VERSION

@@ -1 +1 @@
-0.1.0.45
+0.1.0.46

client/src/App.css

@@ -1248,7 +1248,7 @@ html.scheme-dark .themed-select-option.is-selected {
   border-radius: var(--app-radius-card);
   padding: 20px;
   display: flex;
-  align-items: center;
+  align-items: flex-start;
   gap: 16px;
   cursor: pointer;
   position: relative;
@@ -1292,10 +1292,65 @@ html.scheme-dark .themed-select-option.is-selected {
   flex-wrap: wrap;
   align-items: center;
   gap: 8px;
+  min-width: 0;
 }
 
 .card-title-row h3 {
   margin: 0;
+  flex: 1 1 8rem;
+  min-width: 0;
+  max-width: 100%;
+}
+
+.card-title-row .role-badge {
+  flex-shrink: 0;
+}
+
+.logbook-card-actions {
+  flex-shrink: 0;
+  align-self: flex-start;
+  display: flex;
+  align-items: center;
+  margin-top: -2px;
+}
+
+.logbook-card-actions .btn-delete {
+  position: static;
+  top: auto;
+  right: auto;
+  opacity: 0;
+}
+
+.logbook-card:hover .logbook-card-actions .btn-delete,
+.logbook-card:focus-within .logbook-card-actions .btn-delete {
+  opacity: 1;
+}
+
+@media (hover: none), (pointer: coarse) {
+  .logbook-card-actions .btn-delete {
+    opacity: 1;
+  }
+}
+
+.logbook-title-editable {
+  cursor: text;
+  border-radius: 4px;
+  transition: background-color 0.15s ease;
+}
+
+.logbook-title-editable:hover {
+  background: var(--app-accent-bg);
+}
+
+.logbook-title-inline-edit {
+  flex: 1 1 8rem;
+  min-width: 0;
+  max-width: 100%;
+  margin: 0;
+  padding: 2px 8px;
+  font-size: 16px;
+  font-weight: 600;
+  line-height: 1.4;
 }
 
 .card-icon {
@@ -2051,15 +2106,28 @@ html.scheme-dark .themed-select-option.is-selected {
   }
 
   .logbook-card {
-    flex-wrap: wrap;
+    flex-wrap: nowrap;
     padding: 16px;
     gap: 12px;
   }
 
+  .logbook-card-actions {
+    margin-top: 0;
+  }
+
+  .logbook-card-actions .btn-delete {
+    opacity: 1;
+  }
+
   .card-meta {
     flex-wrap: wrap;
   }
 
+  .card-title-row h3,
+  .logbook-title-inline-edit {
+    flex-basis: 100%;
+  }
+
   .card-info h3 {
     white-space: normal;
     word-break: break-word;

client/src/components/LogbookDashboard.tsx

@@ -1,8 +1,8 @@
-import React, { useState, useEffect } from 'react'
+import React, { useState, useEffect, useRef } from 'react'
 import { useTranslation } from 'react-i18next'
 import { useLiveQuery } from 'dexie-react-hooks'
 import { db } from '../services/db.js'
-import { fetchLogbooks, createLogbook, deleteLogbook, type DecryptedLogbook } from '../services/logbook.js'
+import { fetchLogbooks, createLogbook, deleteLogbook, updateLogbookTitle, type DecryptedLogbook } from '../services/logbook.js'
 import LogbookRoleBadge from './LogbookRoleBadge.tsx'
 import BetaBadge from './BetaBadge.tsx'
 import { PlausibleEvents, trackPlausibleEvent } from '../services/analytics.js'
@@ -23,6 +23,9 @@ export default function LogbookDashboard({ onSelectLogbook, onLogout, onOpenProf
   const { showConfirm } = useDialog()
   const [logbooks, setLogbooks] = useState<DecryptedLogbook[]>([])
   const [newTitle, setNewTitle] = useState('')
+  const [editingLogbookId, setEditingLogbookId] = useState<string | null>(null)
+  const [editingTitleDraft, setEditingTitleDraft] = useState('')
+  const titleInputRef = useRef<HTMLInputElement>(null)
   const [loading, setLoading] = useState(false)
   const [refreshing, setRefreshing] = useState(false)
   const [error, setError] = useState<string | null>(null)
@@ -99,6 +102,49 @@ export default function LogbookDashboard({ onSelectLogbook, onLogout, onOpenProf
     }
   }
 
+  useEffect(() => {
+    if (editingLogbookId) {
+      titleInputRef.current?.focus()
+      titleInputRef.current?.select()
+    }
+  }, [editingLogbookId])
+
+  const startTitleEdit = (lb: DecryptedLogbook, e: React.MouseEvent) => {
+    e.stopPropagation()
+    setEditingLogbookId(lb.id)
+    setEditingTitleDraft(lb.title)
+  }
+
+  const cancelTitleEdit = () => {
+    setEditingLogbookId(null)
+    setEditingTitleDraft('')
+  }
+
+  const commitTitleEdit = async (id: string) => {
+    if (editingLogbookId !== id) return
+
+    const lb = logbooks.find((item) => item.id === id)
+    const trimmedTitle = editingTitleDraft.trim()
+    cancelTitleEdit()
+
+    if (!lb || !trimmedTitle || trimmedTitle === lb.title.trim()) return
+
+    setLoading(true)
+    setError(null)
+    try {
+      await updateLogbookTitle(id, trimmedTitle)
+      setLogbooks((prev) =>
+        prev.map((item) =>
+          item.id === id ? { ...item, title: trimmedTitle, updatedAt: new Date().toISOString() } : item
+        )
+      )
+    } catch (err: any) {
+      setError(err.message || 'Failed to update logbook title')
+    } finally {
+      setLoading(false)
+    }
+  }
+
   const handleLogout = () => {
     void logoutUser()
     onLogout()
@@ -112,7 +158,10 @@ export default function LogbookDashboard({ onSelectLogbook, onLogout, onOpenProf
   const ownedLogbooks = logbooks.filter((lb) => !lb.isShared)
   const sharedLogbooks = logbooks.filter((lb) => lb.isShared)
 
-  const renderLogbookCard = (lb: DecryptedLogbook) => (
+  const renderLogbookCard = (lb: DecryptedLogbook) => {
+    const isEditingTitle = editingLogbookId === lb.id
+
+    return (
     <div
       key={lb.id}
       className={`logbook-card glass${lb.isShared ? ' logbook-card--shared' : ''}`}
@@ -124,7 +173,36 @@ export default function LogbookDashboard({ onSelectLogbook, onLogout, onOpenProf
 
       <div className="card-info">
         <div className="card-title-row">
-          <h3>{lb.title}</h3>
+          {isEditingTitle ? (
+            <input
+              ref={titleInputRef}
+              type="text"
+              className="logbook-title-inline-edit input-text"
+              value={editingTitleDraft}
+              onChange={(e) => setEditingTitleDraft(e.target.value)}
+              onClick={(e) => e.stopPropagation()}
+              onKeyDown={(e) => {
+                if (e.key === 'Enter') {
+                  e.preventDefault()
+                  void commitTitleEdit(lb.id)
+                } else if (e.key === 'Escape') {
+                  e.preventDefault()
+                  cancelTitleEdit()
+                }
+              }}
+              onBlur={() => void commitTitleEdit(lb.id)}
+              disabled={loading}
+              aria-label={t('dashboard.edit_title')}
+            />
+          ) : (
+            <h3
+              className={lb.isShared ? undefined : 'logbook-title-editable'}
+              onClick={lb.isShared ? undefined : (e) => startTitleEdit(lb, e)}
+              title={lb.isShared ? undefined : t('dashboard.edit_title')}
+            >
+              {lb.title}
+            </h3>
+          )}
           <LogbookRoleBadge role={lb.accessRole} />
         </div>
         <div className="card-meta">
@@ -144,16 +222,22 @@ export default function LogbookDashboard({ onSelectLogbook, onLogout, onOpenProf
         </div>
       </div>
 
-      <button
-        className="btn-delete"
-        onClick={(e) => handleDelete(lb.id, e)}
-        title={t('dashboard.delete_btn')}
-        style={{ visibility: lb.isShared ? 'hidden' : 'visible' }}
-      >
-        <Trash2 size={18} />
-      </button>
+      {!lb.isShared && (
+        <div className="logbook-card-actions">
+          <button
+            type="button"
+            className="btn-delete"
+            onClick={(e) => handleDelete(lb.id, e)}
+            title={t('dashboard.delete_btn')}
+            aria-label={t('dashboard.delete_btn')}
+          >
+            <Trash2 size={18} />
+          </button>
+        </div>
+      )}
     </div>
-  )
+    )
+  }
 
   const renderLogbookSection = (
     title: string,

client/src/i18n/locales/de.json

@@ -270,7 +270,11 @@
       "role_crew_hint": "Eingeladenes Logbuch — du kannst als Crew mitarbeiten und signieren",
       "role_read": "Nur Lesen",
       "role_read_hint": "Geteiltes Logbuch — nur Ansicht, keine Bearbeitung",
-      "open_profile": "Profil von {{name}} öffnen"
+      "open_profile": "Profil von {{name}} öffnen",
+      "edit_title": "Logbuch umbenennen",
+      "edit_placeholder": "Neuer Name des Logbuchs",
+      "edit_success": "Logbuch erfolgreich umbenannt",
+      "edit_btn": "Umbenennen"
     },
     "profile": {
       "title": "Benutzerprofil",

client/src/i18n/locales/en.json

@@ -270,7 +270,11 @@
       "role_crew_hint": "Invited logbook — you can collaborate and sign as crew",
       "role_read": "Read only",
       "role_read_hint": "Shared logbook — view only, no editing",
-      "open_profile": "Open profile for {{name}}"
+      "open_profile": "Open profile for {{name}}",
+      "edit_title": "Rename Logbook",
+      "edit_placeholder": "New name of the logbook",
+      "edit_success": "Logbook renamed successfully",
+      "edit_btn": "Rename"
     },
     "profile": {
       "title": "User profile",

client/src/services/logbook.ts

@@ -322,3 +322,64 @@ export async function deleteLogbook(id: string): Promise<void> {
   await deleteLocalLogbookCache(id)
   trackPlausibleEvent(PlausibleEvents.LOGBOOK_DELETED)
 }
+
+// Update the title of a logbook. Encrypts the title and updates locally + on server
+export async function updateLogbookTitle(id: string, newTitle: string): Promise<void> {
+  const userId = localStorage.getItem('active_userid')
+  if (!userId) {
+    throw new Error('User not authenticated')
+  }
+
+  const masterKey = getActiveMasterKey()
+  if (!masterKey) {
+    throw new Error('Master key not found. User must log in.')
+  }
+
+  const logbookKey = await getLogbookKey(id) || masterKey
+
+  // E2E Encrypt the new title using the Logbook Key (or master key fallback)
+  const encrypted = await encryptJson(newTitle, logbookKey)
+  const encryptedTitleStr = JSON.stringify(encrypted)
+  const now = new Date().toISOString()
+
+  const payloadData = {
+    encryptedTitle: encryptedTitleStr
+  }
+
+  if (navigator.onLine) {
+    try {
+      const response = await apiFetch(`${API_BASE}/${id}`, {
+        method: 'PUT',
+        body: JSON.stringify(payloadData)
+      })
+
+      if (response.ok) {
+        // Update local IndexedDB cache as synced
+        await db.logbooks.update(id, {
+          encryptedTitle: encryptedTitleStr,
+          updatedAt: now,
+          isSynced: 1
+        })
+        return
+      }
+    } catch (error) {
+      console.warn('Failed to update logbook on server, saving locally instead:', error)
+    }
+  }
+
+  // If offline or request failed, store locally as unsynced and add to queue
+  await db.logbooks.update(id, {
+    encryptedTitle: encryptedTitleStr,
+    updatedAt: now,
+    isSynced: 0
+  })
+
+  await db.syncQueue.put({
+    action: 'update',
+    type: 'logbook',
+    payloadId: id,
+    logbookId: id,
+    data: JSON.stringify(payloadData),
+    updatedAt: now
+  })
+}

server/src/routes/logbooks.ts

@@ -131,4 +131,41 @@ router.delete('/:id', async (req: any, res) => {
   }
 })
 
+// 5. Update a logbook title
+router.put('/:id', async (req: any, res) => {
+  try {
+    const { id } = req.params
+    const { encryptedTitle } = req.body
+
+    if (!encryptedTitle) {
+      return res.status(400).json({ error: 'encryptedTitle is required' })
+    }
+
+    const logbook = await prisma.logbook.findUnique({
+      where: { id }
+    })
+
+    if (!logbook) {
+      return res.status(404).json({ error: 'Logbook not found' })
+    }
+
+    if (logbook.userId !== req.userId) {
+      return res.status(403).json({ error: 'Forbidden: Access denied' })
+    }
+
+    const updatedLogbook = await prisma.logbook.update({
+      where: { id },
+      data: {
+        encryptedTitle,
+        updatedAt: new Date()
+      }
+    })
+
+    return res.json(updatedLogbook)
+  } catch (error: any) {
+    console.error('Error updating logbook:', error)
+    return res.status(500).json({ error: error.message || 'Internal server error' })
+  }
+})
+
 export default router

server/src/routes/sync.ts

@@ -46,7 +46,7 @@ router.post('/push', async (req: any, res) => {
         // Authorize: Check if logbook belongs to user
         // Exception: If action is create logbook, the logbook might not exist yet,
         // so we authorize based on user creating a logbook with their userId.
-        if (type === 'logbook' && action === 'create') {
+        if (type === 'logbook' && (action === 'create' || action === 'update')) {
           const existing = await prisma.logbook.findUnique({
             where: { id: logbookId }
           })
@@ -69,9 +69,9 @@ router.post('/push', async (req: any, res) => {
             },
             update: {
               encryptedTitle: parsed.encryptedTitle,
-              encryptedKey: parsed.encryptedKey || null,
-              iv: parsed.iv || null,
-              tag: parsed.tag || null,
+              ...(parsed.encryptedKey !== undefined ? { encryptedKey: parsed.encryptedKey } : {}),
+              ...(parsed.iv !== undefined ? { iv: parsed.iv } : {}),
+              ...(parsed.tag !== undefined ? { tag: parsed.tag } : {}),
               updatedAt: itemUpdatedAt
             }
           })