chore: release v0.1.1.25

.env.example

@@ -34,6 +34,8 @@ ORIGIN=http://localhost:5173
 # POSTGRES_USER=postgres
 # POSTGRES_PASSWORD=
 # POSTGRES_DB=daagbox
+# Optional: lock Docker Compose to a specific configuration file (e.g. staging or production) on the server:
+# COMPOSE_FILE=docker-compose.staging.yml
 # Optional: comma-separated CORS origins (defaults to ORIGIN; 127.0.0.1 may be allowed for CORS but not for login)
 # CORS_ORIGINS=http://localhost:5173
 

VERSION

@@ -1 +1 @@
-0.1.1.25
+0.1.1.26

client/src/admin/AdminDashboard.tsx

@@ -7,12 +7,22 @@ import {
   type AdminTimeSeriesResponse,
   type AdminTimeBucket
 } from '../services/adminApi.js'
-import { BarChart2, Bookmark, ChevronLeft, Image, MapPin, Mic, Users } from 'lucide-react'
+import { BarChart2, Bookmark, ChevronLeft, Database, Image, MapPin, Mic, Users } from 'lucide-react'
 
 function formatNumber(value: number): string {
   return value.toLocaleString()
 }
 
+function formatBytes(bytes: number | undefined): string {
+  if (bytes === undefined || bytes === null) return '—'
+  if (bytes === 0) return '0 B'
+  const k = 1024
+  const sizes = ['B', 'KB', 'MB', 'GB']
+  const i = Math.floor(Math.log(bytes) / Math.log(k))
+  const num = bytes / Math.pow(k, i)
+  return `${num.toFixed(1)} ${sizes[i]}`
+}
+
 function KpiCard({
   icon,
   label,
@@ -20,14 +30,14 @@ function KpiCard({
 }: {
   icon: ReactNode
   label: string
-  value: number
+  value: number | string
 }) {
   return (
     <div className="stats-kpi-card glass">
       <div className="stats-kpi-icon">{icon}</div>
       <div className="stats-kpi-body">
         <span className="stats-kpi-label">{label}</span>
-        <span className="stats-kpi-value">{formatNumber(value)}</span>
+        <span className="stats-kpi-value">{typeof value === 'number' ? formatNumber(value) : value}</span>
       </div>
     </div>
   )
@@ -194,6 +204,7 @@ export default function AdminDashboard({ onBack }: AdminDashboardProps) {
             label="Einträge mit AI-Zusammenfassung"
             value={summary.aiSummaryEntries}
           />
+          <KpiCard icon={<Database size={20} />} label="Datenbankgröße" value={formatBytes(summary.dbSize)} />
         </section>
 
         <section className="admin-controls">
@@ -233,6 +244,7 @@ export default function AdminDashboard({ onBack }: AdminDashboardProps) {
           <TimeSeriesChart title="Neue Benutzer" seriesKey="users_created" data={timeSeries} />
           <TimeSeriesChart title="Neue Logbücher" seriesKey="logbooks_created" data={timeSeries} />
           <TimeSeriesChart title="Foto-Aktivität" seriesKey="photos_updated" data={timeSeries} />
+          <TimeSeriesChart title="Datenbankgröße (MB)" seriesKey="database_size" data={timeSeries} />
         </section>
       </main>
     </div>

client/src/components/EntryCrewSection.tsx

@@ -1,6 +1,6 @@
 import { useEffect, useMemo, useState } from 'react'
 import { useTranslation } from 'react-i18next'
-import { Users } from 'lucide-react'
+import { Users, ChevronDown, ChevronUp } from 'lucide-react'
 import type { EntryCrewFields, PersonSnapshot } from '../types/person.js'
 import { loadPersonPool } from '../services/personPool.js'
 import { loadLogbookCrewSelection } from '../services/logbookCrewSelection.js'
@@ -24,6 +24,7 @@ export default function EntryCrewSection({
   preloadedPool
 }: EntryCrewSectionProps) {
   const { t } = useTranslation()
+  const [collapsed, setCollapsed] = useState(true)
   const [pool, setPool] = useState<Map<string, PersonData>>(preloadedPool ?? new Map())
 
   useEffect(() => {
@@ -90,54 +91,78 @@ export default function EntryCrewSection({
 
   return (
     <div className="form-card" data-tour="entry-crew">
-      <div className="form-header">
-        <Users size={22} className="form-icon" />
-        <h3>{t('entry_crew.title')}</h3>
-      </div>
-      <p className="help-text mb-3">{t('entry_crew.subtitle')}</p>
-
-      <div className="input-group mb-3">
-        <label>{t('entry_crew.day_skipper')}</label>
-        {skippers.length === 0 ? (
-          <p className="help-text">{t('entry_crew.no_skipper')}</p>
+      <div
+        className="form-header accordion-header"
+        onClick={() => setCollapsed(!collapsed)}
+        onKeyDown={(e) => {
+          if (e.key === 'Enter' || e.key === ' ') {
+            e.preventDefault()
+            setCollapsed(!collapsed)
+          }
+        }}
+        role="button"
+        aria-expanded={!collapsed}
+        tabIndex={0}
+      >
+        <div className="accordion-header-title">
+          <Users size={22} className="form-icon" />
+          <h3>{t('entry_crew.title')}</h3>
+        </div>
+        {collapsed ? (
+          <ChevronDown size={20} className="accordion-chevron" />
         ) : (
-          <div className="crew-selection-list">
-            {skippers.map(([id, data]) => (
-              <label key={id} className="crew-selection-item">
-                <input
-                  type="radio"
-                  name={`entry-skipper-${logbookId}`}
-                  checked={value.selectedSkipperId === id}
-                  onChange={() => !readOnly && applyChange(id, value.selectedCrewIds)}
-                  disabled={readOnly}
-                />
-                <span>{data.name || t('logbook_crew.unnamed')}</span>
-              </label>
-            ))}
-          </div>
+          <ChevronUp size={20} className="accordion-chevron" />
         )}
       </div>
 
-      <div className="input-group">
-        <label>{t('entry_crew.day_crew')}</label>
-        {crewEntries.length === 0 ? (
-          <p className="help-text">{t('entry_crew.no_crew')}</p>
-        ) : (
-          <div className="crew-selection-list">
-            {crewEntries.map(([id, data]) => (
-              <label key={id} className="crew-selection-item">
-                <input
-                  type="checkbox"
-                  checked={value.selectedCrewIds.includes(id)}
-                  onChange={() => toggleCrew(id)}
-                  disabled={readOnly}
-                />
-                <span>{data.name || t('logbook_crew.unnamed')}</span>
-              </label>
-            ))}
+      {!collapsed && (
+        <>
+          <p className="help-text mb-3" style={{ marginTop: '16px' }}>{t('entry_crew.subtitle')}</p>
+
+          <div className="input-group mb-3">
+            <label>{t('entry_crew.day_skipper')}</label>
+            {skippers.length === 0 ? (
+              <p className="help-text">{t('entry_crew.no_skipper')}</p>
+            ) : (
+              <div className="crew-selection-list">
+                {skippers.map(([id, data]) => (
+                  <label key={id} className="crew-selection-item">
+                    <input
+                      type="radio"
+                      name={`entry-skipper-${logbookId}`}
+                      checked={value.selectedSkipperId === id}
+                      onChange={() => !readOnly && applyChange(id, value.selectedCrewIds)}
+                      disabled={readOnly}
+                    />
+                    <span>{data.name || t('logbook_crew.unnamed')}</span>
+                  </label>
+                ))}
+              </div>
+            )}
           </div>
-        )}
-      </div>
+
+          <div className="input-group">
+            <label>{t('entry_crew.day_crew')}</label>
+            {crewEntries.length === 0 ? (
+              <p className="help-text">{t('entry_crew.no_crew')}</p>
+            ) : (
+              <div className="crew-selection-list">
+                {crewEntries.map(([id, data]) => (
+                  <label key={id} className="crew-selection-item">
+                    <input
+                      type="checkbox"
+                      checked={value.selectedCrewIds.includes(id)}
+                      onChange={() => toggleCrew(id)}
+                      disabled={readOnly}
+                    />
+                    <span>{data.name || t('logbook_crew.unnamed')}</span>
+                  </label>
+                ))}
+              </div>
+            )}
+          </div>
+        </>
+      )}
     </div>
   )
 }

client/src/services/adminApi.ts

@@ -16,6 +16,7 @@ export interface AdminSummary {
   totalCollaborations: number
   totalInvitations: number
   aiSummaryEntries: number
+  dbSize: number
 }
 
 export type AdminTimeBucket = 'day' | 'week' | 'month'

server/src/routes/admin.ts

@@ -23,6 +23,11 @@ router.get('/summary', requireUser, requireAdmin, async (_req, res) => {
         prisma.aiSummaryUsage.count()
       ])
 
+    const rawDbSize = await prisma.$queryRaw<[{ size: string }]>`
+      SELECT pg_database_size(current_database())::text as size
+    `
+    const dbSize = Number(rawDbSize[0]?.size || '0')
+
     res.json({
       totalUsers,
       totalLogbooks,
@@ -31,7 +36,8 @@ router.get('/summary', requireUser, requireAdmin, async (_req, res) => {
       totalGpsTracks,
       totalCollaborations,
       totalInvitations,
-      aiSummaryEntries
+      aiSummaryEntries,
+      dbSize
     })
   } catch (error: unknown) {
     console.error('admin/summary error', error)
@@ -91,7 +97,7 @@ async function buildTimeSeries(bucket: TimeBucket, windowDays: number): Promise<
   const since = new Date()
   since.setUTCDate(since.getUTCDate() - windowDays)
 
-  const [users, logbooks, photos] = await Promise.all([
+  const [users, logbooks, photos, dbSizeRaw, photosSize, voiceSize, tracksSize, entriesSize] = await Promise.all([
     prisma.user.findMany({
       where: { createdAt: { gte: since } },
       select: { createdAt: true }
@@ -103,9 +109,72 @@ async function buildTimeSeries(bucket: TimeBucket, windowDays: number): Promise<
     prisma.photoPayload.findMany({
       where: { updatedAt: { gte: since } },
       select: { updatedAt: true }
+    }),
+    prisma.$queryRaw<[{ size: string }]>`
+      SELECT pg_database_size(current_database())::text as size
+    `,
+    prisma.photoPayload.findMany({
+      select: { updatedAt: true, encryptedData: true }
+    }),
+    prisma.voiceMemoPayload.findMany({
+      select: { updatedAt: true, encryptedData: true }
+    }),
+    prisma.gpsTrackPayload.findMany({
+      select: { updatedAt: true, encryptedData: true }
+    }),
+    prisma.entryPayload.findMany({
+      select: { updatedAt: true, encryptedData: true }
     })
   ])
 
+  const dbSizeVal = Number(dbSizeRaw[0]?.size || '0')
+
+  const payloads: { date: Date; size: number }[] = []
+  for (const p of photosSize) {
+    payloads.push({ date: p.updatedAt, size: p.encryptedData.length })
+  }
+  for (const v of voiceSize) {
+    payloads.push({ date: v.updatedAt, size: v.encryptedData.length })
+  }
+  for (const g of tracksSize) {
+    payloads.push({ date: g.updatedAt, size: g.encryptedData.length })
+  }
+  for (const e of entriesSize) {
+    payloads.push({ date: e.updatedAt, size: e.encryptedData.length })
+  }
+
+  const totalPayloadsSize = payloads.reduce((acc, p) => acc + p.size, 0)
+  const baseDbSize = Math.max(0, dbSizeVal - totalPayloadsSize)
+
+  payloads.sort((a, b) => a.date.getTime() - b.date.getTime())
+
+  // Generate complete list of date keys for the window
+  const dateKeys: string[] = []
+  const current = new Date(since)
+  const todayStr = bucketDate(new Date(), bucket)
+  while (true) {
+    const key = bucketDate(current, bucket)
+    if (!dateKeys.includes(key)) {
+      dateKeys.push(key)
+    }
+    if (key >= todayStr) break
+    current.setUTCDate(current.getUTCDate() + 1)
+  }
+
+  const dbSizePoints = dateKeys.map((key) => {
+    let sizeSum = 0
+    for (const p of payloads) {
+      if (bucketDate(p.date, bucket) <= key) {
+        sizeSum += p.size
+      } else {
+        break
+      }
+    }
+    const totalBytes = baseDbSize + sizeSum
+    const sizeInMb = Math.round((totalBytes / (1024 * 1024)) * 10) / 10
+    return { date: key, count: sizeInMb }
+  })
+
   function aggregate(dates: Date[], metric: string): TimeSeries {
     const map = new Map<string, number>()
     for (const d of dates) {
@@ -130,7 +199,11 @@ async function buildTimeSeries(bucket: TimeBucket, windowDays: number): Promise<
     aggregate(
       photos.map((p) => p.updatedAt),
       'photos_updated'
-    )
+    ),
+    {
+      metric: 'database_size',
+      points: dbSizePoints
+    }
   ]
 }