feat(dashboard): inline Quick log form on the dashboard hero (#217)

Replaces the placeholder Quick log card (which only linked to /new-contact)
with a real inline form: callsign with debounced QRZ lookup, frequency
with auto-band derivation, mode-aware RST defaults, station picker when
multiple are configured, and a Save button that posts to /api/contacts.

Matches the new-design/dashboard.html mockup. Saving refreshes the
contacts table and stat cards on the parent page, then refocuses the
callsign input for rapid sequential logging.

Also bumps the README stack blurb to Next.js 16 / React 19 / TS 5.8 and
notes the Drizzle Kit + raw-pg runtime split.

Co-authored-by: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

Author: patrickrb

README.md

@@ -18,9 +18,9 @@ A modern, web-based amateur radio logging application built with Next.js and Pos
 
 ## Technology Stack
 
-- **Frontend**: Next.js 15 with TypeScript
+- **Frontend**: Next.js 16, React 19, TypeScript 5.8
 - **Backend**: Next.js API Routes
-- **Database**: PostgreSQL with native SQL
+- **Database**: PostgreSQL (raw `pg` at runtime); schema-as-code via Drizzle Kit (`drizzle/schema.ts`)
 - **Authentication**: JWT-based authentication
 - **Styling**: Tailwind CSS
 - **Deployment**: Vercel-ready
@@ -29,7 +29,7 @@ A modern, web-based amateur radio logging application built with Next.js and Pos
 
 ### Prerequisites
 
-- Node.js 18+ 
+- Node.js 20.9+ (required by Next.js 16)
 - PostgreSQL 13+ database
 - Docker and Docker Compose (recommended)
 - Git

src/app/dashboard/page.tsx

@@ -11,6 +11,7 @@ import EditContactDialog from '@/components/EditContactDialog';
 import DXpeditionWidget from '@/components/DXpeditionWidget';
 import QslMatrix from '@/components/QslMatrix';
 import Pagination from '@/components/Pagination';
+import QuickLogCard from '@/components/QuickLogCard';
 import { Button } from '@/components/ui/button';
 import { Card } from '@/components/ui/card';
 import { Chip } from '@/components/ui/chip';
@@ -366,50 +367,12 @@ export default function DashboardPage() {
             </div>
           </Card>
 
-          <Card className="p-4 sm:p-7 flex flex-col gap-5">
-            <div className="flex items-center justify-between">
-              <h2 className="text-[17px] font-semibold">Quick log</h2>
-              <Chip variant="accent" size="sm">
-                <Dot tone="ok" live />
-                Live
-              </Chip>
-            </div>
-            <p className="text-sm text-fg-2">
-              Need more fields? Open the full new-contact form for callsign
-              lookup, RST defaults by mode, station picker, and notes.
-            </p>
-            <Button asChild size="lg" className="w-full">
-              <Link href="/new-contact">
-                <Plus />
-                Log a QSO
-              </Link>
-            </Button>
-            <div className="flex items-center gap-2 text-xs text-fg-2">
-              Press <Kbd>L</Kbd> on any page to jump straight in.
-            </div>
-            <div className="border-t border-line pt-4">
-              <div className="text-[13px] font-medium uppercase tracking-[0.06em] text-fg-2 mb-3">
-                Recent
-              </div>
-              <div className="flex flex-col gap-2">
-                {contacts.slice(0, 4).map((contact) => (
-                  <button
-                    key={contact.id}
-                    type="button"
-                    onClick={() => handleContactClick(contact)}
-                    className="flex justify-between items-center px-3 py-2 rounded-[10px] bg-bg-1 border border-line text-left hover:border-line-hi transition-colors cursor-pointer"
-                  >
-                    <span className="font-mono font-semibold text-fg">
-                      {contact.callsign}
-                    </span>
-                    <span className="text-xs text-fg-2 font-mono">
-                      {contact.band} · {contact.mode} · {formatUtc(contact.datetime)}
-                    </span>
-                  </button>
-                ))}
-              </div>
-            </div>
-          </Card>
+          <QuickLogCard
+            onSaved={() => {
+              fetchContacts(1, pagination.limit);
+              fetchStats();
+            }}
+          />
         </div>
 
         {/* Band activity */}