project-logbook 0.4.1 → 1.1.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "project-logbook",
-  "version": "0.4.1",
+  "version": "1.1.0",
   "description": "A command-line tool for project logbooks.",
   "workspaces": [
     "demo-app"
@@ -24,9 +24,10 @@
     "lint": "eslint src --ext .ts --fix",
     "format": "prettier --write --list-different .",
     "knip": "cross-env NO_CONSOLE=true knip || true",
-    "madge": "npx --yes madge --circular --extensions ts --ts-config ./tsconfig.json src/index.ts",
+    "madge": "madge --circular --extensions ts --ts-config ./tsconfig.json src/index.ts",
+    "jscpd": "jscpd src",
     "test": "vitest run",
-    "pre": "npm run format && npm run lint && npm run test && npm run build && npm run knip && npm run madge && npm run dev build && npm run dev lint",
+    "pre": "npm run format && npm run lint && npm run test && npm run build && npm run knip && npm run madge && npm run jscpd && npm run dev build && npm run dev lint && npm audit",
     "next": "node scripts/create-ticket-from-backlog.js",
     "link": "npm run build && npm link",
     "open": "npm run dev build && node scripts/open-and-view-dist.js"
@@ -36,7 +37,7 @@
     "cli",
     "project"
   ],
-  "author": "",
+  "author": "falvhb",
   "license": "MIT",
   "devDependencies": {
     "@types/fs-extra": "^11.0.4",
@@ -45,15 +46,20 @@
     "@types/rss": "^0.0.32",
     "@typescript-eslint/eslint-plugin": "^8.32.1",
     "@typescript-eslint/parser": "^8.32.1",
-    "@vitest/coverage-v8": "^3.1.4",
+    "@vitest/coverage-v8": "^4.1.8",
     "cross-env": "^7.0.3",
     "eslint": "^9.27.0",
+    "jscpd": "^4.2.4",
     "knip": "^5.55.0",
+    "madge": "^8.0.0",
     "prettier": "^3.5.3",
     "rimraf": "^6.1.3",
     "tsx": "^4.21.0",
     "typescript": "^6.0.3",
-    "vitest": "^3.1.4"
+    "vitest": "^4.1.8"
+  },
+  "overrides": {
+    "typescript": "^6.0.3"
   },
   "dependencies": {
     "chalk": "^5.6.2",

package/src/templates/CONTRIBUTING.md

@@ -84,4 +84,13 @@ If `jiraPrefix` is configured, entry folder names and ticket references must mat
 ## Tone & Style
 - **Narrative over Lists**: In `index.md`, tell a story. Why did we make this change? What were the challenges?
 - **Technical Precision**: In `log.md`, be specific. Mention file paths, error messages, and specific design patterns. Log in real time — do not reconstruct after the fact.
-- **No Boilerplate in Commits**: All template placeholders must be replaced or removed before `logbook release`.
+- **No Boilerplate in Commits**: All template placeholders must be replaced or removed before `logbook release`.
+
+## Research Logs
+For exploratory research, technical spike investigations, and architectural decision groundwork, we use **Research Logs**.
+- **Location**: Stored in `docs/research/` (configurable via `researchDir`).
+- **Scaffolding**: Run `logbook new [ID] [Slug] --research` or `logbook new -r` to scaffold. This automatically generates a numeric ID prefixed with `RES-` (e.g. `RES-1`).
+- **Commands**: Commands like `logbook start RES-1`, `logbook log`, and `logbook release` work transparently.
+- **Auto-Activity Tracking**: Writing a log message via `logbook log` automatically updates the `updated` frontmatter field inside the research log's `index.md`.
+- **Status Lifecycle**: The frontmatter `status` field tracks progress: `active`, `paused`, `postponed`, or `completed`.
+- **Visuals**: Research logs are compiled and displayed under a dedicated "Research" tab on the built logbook homepage, sorted by their latest `updated` date.

package/src/templates/index.md

@@ -31,4 +31,5 @@ TODO: Write a polished, highly readable ticket summary that reads like an engagi
 - **Use bullet points:** TODO: Whenever listing multiple items (like friction points, test scenarios, or rewritten paths), use a bulleted list instead of a dense paragraph to make it scannable.
 - **Use bold emphasis:** TODO: Bold key concepts, problems, and solutions to guide the reader's eye.
 - **Format code:** TODO: Use inline backticks for files, plugins, HTML elements, and code snippets (e.g., `src/lib/build-helpers.ts`).
-- **Keep paragraphs short:** TODO: Ensure no paragraph is longer than 3-4 sentences. Keep the pacing quick and engaging.
+- **Keep paragraphs short:** TODO: Ensure no paragraph is longer than 3-4 sentences. Keep the pacing quick and engaging.
+- **Do not state the obvious**: TODO: Passed tests, lints, pre-commit suites are mandatory and no ticket is released without this. This does not need to be mentioned

package/src/templates/log.md

@@ -1,4 +1,4 @@
-# Technical Log: {{id}}-{{slug}}
+# Technical Log: {{id}} - {{title}}
 
 > **REMINDER**: Log your work in real-time using `logbook log "<message>"`. Don't wait until the end!
 > 

package/src/templates/styles.css

@@ -19,10 +19,16 @@ body {
 header {
   background: var(--card-bg);
   border-bottom: 1px solid var(--border);
-  padding: 2rem 1rem;
+  padding: 2rem 0 0 0;
   text-align: center;
 }
 
+.header-inner {
+  max-width: var(--max-width);
+  margin: 0 auto;
+  padding: 0 1.5rem;
+}
+
 header h1 {
   margin: 0;
   font-size: 2.25rem;
@@ -163,20 +169,52 @@ main {
   transform: translateX(4px);
 }
 
+.teaser-image-right {
+  flex-shrink: 0;
+  max-width: 200px;
+  max-height: 120px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  overflow: hidden;
+  border-radius: 4px;
+}
+
+.teaser-image-right img {
+  max-width: 100%;
+  max-height: 100%;
+  object-fit: contain;
+}
+
+.teaser-image-bottom {
+  margin-top: 0.75rem;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 100%;
+}
+
+.teaser-image-bottom img {
+  max-width: 100%;
+  max-height: 200px;
+  object-fit: contain;
+  border-radius: 4px;
+}
+
 /* Post Page */
 .back-link {
   display: inline-flex;
   align-items: center;
   font-size: 0.8125rem;
-  font-weight: 500;
   color: var(--primary);
   text-decoration: none;
-  transition:
-    color 0.2s,
-    background 0.2s;
   background: var(--primary-soft);
   padding: 0.5rem 1rem;
   border-radius: 2rem;
+  font-weight: 500;
+  transition:
+    background 0.2s,
+    color 0.2s;
 }
 
 .back-link:hover {
@@ -184,23 +222,7 @@ main {
   color: white;
 }
 
-/* Action bar - Back button + tabs on same line */
-.action-bar {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: 1rem;
-  margin-bottom: 3rem;
-  flex-wrap: wrap;
-}
-
-.action-tabs-wrapper {
-  display: flex;
-  align-items: center;
-  gap: 1rem;
-  flex-wrap: wrap;
-}
-
+/* Jira Action Button */
 .jira-link-btn {
   display: inline-flex;
   align-items: center;
@@ -221,6 +243,48 @@ main {
   color: white;
 }
 
+/* Header Navigation - Back button, tabs, and Jira link */
+.header-nav {
+  display: grid;
+  grid-template-columns: 1fr auto 1fr;
+  align-items: center;
+  margin-top: 2rem;
+  gap: 1rem;
+}
+
+.header-nav-left {
+  text-align: left;
+  display: flex;
+  align-items: center;
+}
+
+.header-nav-right {
+  text-align: right;
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+}
+
+.header-nav--center {
+  display: flex;
+  justify-content: center;
+}
+
+@media (max-width: 640px) {
+  .header-nav {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 1rem;
+    padding-bottom: 1rem;
+  }
+  .header-nav-left,
+  .header-nav-right {
+    text-align: center;
+    justify-content: center;
+  }
+}
+
 /* Jira link in build-meta - inline style */
 .build-meta .jira-link-btn {
   margin-left: 0.5rem;
@@ -261,21 +325,25 @@ article h1 {
 
 .tabs {
   display: flex;
-  gap: 0.5rem;
-  background: #f4f4f4;
-  padding: 0.25rem;
-  border-radius: 0.75rem;
+  gap: 1.5rem;
+  background: none;
+  padding: 0;
+  border-radius: 0;
   width: fit-content;
+  margin-bottom: -1px;
+  position: relative;
+  z-index: 2;
 }
 
 .tab {
-  padding: 0.625rem 1.25rem;
-  font-size: 0.8125rem;
+  padding: 0.75rem 0.25rem;
+  font-size: 0.875rem;
   font-weight: 600;
   color: var(--text-muted);
   cursor: pointer;
-  border-radius: 0.5rem;
-  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
+  border-bottom: 2px solid transparent;
+  transition: all 0.2s ease;
+  border-radius: 0;
 }
 
 .tab:hover {
@@ -284,8 +352,9 @@ article h1 {
 
 .tab.active {
   color: var(--primary);
-  background: white;
-  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
+  border-bottom-color: var(--primary);
+  background: none;
+  box-shadow: none;
 }
 
 /* Pagination Links */
@@ -504,6 +573,11 @@ footer .build-time a:hover {
   color: #374151;
 }
 
+.tag-superseded {
+  background: #f3f4f6;
+  color: #4b5563;
+}
+
 /* Timeline card tag styling */
 .timeline-card .tags-wrapper {
   margin-top: 0.5rem;
@@ -878,3 +952,68 @@ article img[src$='.svg'] {
   background-color: var(--primary-soft, #f0fdf4);
   color: var(--text-main, #1e293b);
 }
+
+/* ADR Details and Cards */
+.adr-detail-card {
+  max-width: var(--max-width);
+  margin: 0 auto;
+  background: var(--card-bg);
+  padding: 2rem;
+  border-radius: 0.5rem;
+  border: 1px solid var(--border);
+}
+
+.adr-detail-meta {
+  margin-bottom: 1.5rem;
+  font-size: 0.85rem;
+  color: var(--text-muted);
+}
+
+.adr-status-badge {
+  margin-right: 0.5rem;
+  text-transform: uppercase;
+  font-size: 0.7rem;
+  padding: 0.15rem 0.4rem;
+}
+
+.adr-detail-title {
+  font-size: 2rem;
+  margin-top: 0;
+  margin-bottom: 1.5rem;
+  letter-spacing: -0.025em;
+  font-weight: 800;
+}
+
+.adr-detail-body {
+  margin-top: 2rem;
+}
+
+.adr-detail-tags {
+  margin-top: 2rem;
+  border-top: 1px solid var(--border);
+  padding-top: 1.5rem;
+}
+
+.adr-indicator-badge {
+  background: #e0f2fe !important;
+  color: #0369a1 !important;
+  font-weight: bold;
+}
+
+.timeline-card--adr {
+  background: color-mix(in srgb, var(--primary) 4%, var(--card-bg, #ffffff)) !important;
+  border: 1px solid color-mix(in srgb, var(--primary) 12%, var(--border, #e5e7eb)) !important;
+  border-radius: 0.5rem;
+}
+
+.timeline-card--adr .item-summary {
+  font-style: italic;
+  border-left: 2px solid var(--primary);
+  padding-left: 0.75rem;
+  margin-top: 0.5rem;
+  color: var(--text-muted);
+}
+
+.timeline-card--adr .tags-wrapper {
+  margin-top: 0.5rem;
+}