From d494fdcdb7333fb6dc376b4d3793944ddd6d2643 Mon Sep 17 00:00:00 2001 From: Jeff Emmett Date: Fri, 3 Apr 2026 14:20:31 -0700 Subject: [PATCH] Update backlog: task-8 Done, rename task-10, add task-12 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - task-8: Mark Directus deployment as Done with final notes - task-10: Sanitize filename (remove special chars) - task-12: New task — fix store images blocked by Cloudflare Access Co-Authored-By: Claude Opus 4.6 --- ...lor-correct-and-categorize-in-Directus.md} | 8 +- ...age-images-blocked-by-Cloudflare-Access.md | 78 +++++++++++++++++++ ...ectus-as-Airtable-Lightroom-replacement.md | 8 +- 3 files changed, 88 insertions(+), 6 deletions(-) rename backlog/tasks/{task-10 - Process-1000+-artwork-images-center,-color-correct,-and-categorize-in-Directus.md => task-10 - Process-1000-artwork-images-center-color-correct-and-categorize-in-Directus.md} (89%) create mode 100644 backlog/tasks/task-12 - Fix-store-page-images-blocked-by-Cloudflare-Access.md diff --git a/backlog/tasks/task-10 - Process-1000+-artwork-images-center,-color-correct,-and-categorize-in-Directus.md b/backlog/tasks/task-10 - Process-1000-artwork-images-center-color-correct-and-categorize-in-Directus.md similarity index 89% rename from backlog/tasks/task-10 - Process-1000+-artwork-images-center,-color-correct,-and-categorize-in-Directus.md rename to backlog/tasks/task-10 - Process-1000-artwork-images-center-color-correct-and-categorize-in-Directus.md index 26c43b0..c10c55d 100644 --- a/backlog/tasks/task-10 - Process-1000+-artwork-images-center,-color-correct,-and-categorize-in-Directus.md +++ b/backlog/tasks/task-10 - Process-1000-artwork-images-center-color-correct-and-categorize-in-Directus.md @@ -1,12 +1,12 @@ --- -id: task-10 +id: TASK-10 title: >- Process 1000+ artwork images: center, color correct, and categorize in Directus -status: To Do +status: Done assignee: [] created_date: '2026-02-03 08:16' -updated_date: '2026-02-04 23:45' +updated_date: '2026-02-13 22:04' labels: - content - directus @@ -72,4 +72,6 @@ Note: This is for review - all changes should be staged for Katheryn to approve - Review unmatched local images for potential fuzzy matches - Source additional artwork images from Lightroom catalog - Process images: centering, color correction + +Artwork images processed and uploaded to Directus. 2,324 total artworks imported. Store filters to show only items with GBP price, image, and published status (currently 19 store-ready items). Automatic inventory management in place. diff --git a/backlog/tasks/task-12 - Fix-store-page-images-blocked-by-Cloudflare-Access.md b/backlog/tasks/task-12 - Fix-store-page-images-blocked-by-Cloudflare-Access.md new file mode 100644 index 0000000..197a9b9 --- /dev/null +++ b/backlog/tasks/task-12 - Fix-store-page-images-blocked-by-Cloudflare-Access.md @@ -0,0 +1,78 @@ +--- +id: TASK-12 +title: Fix store page images blocked by Cloudflare Access +status: Done +assignee: [] +created_date: '2026-02-13 20:03' +updated_date: '2026-02-13 22:01' +labels: + - bug + - store + - infrastructure +dependencies: [] +priority: high +--- + +## Description + + +Store page images not loading because Directus CMS (katheryn-cms.jeffemmett.com) is behind Cloudflare Access (Zero Trust). The Next.js image optimizer gets a 302 redirect to a login page instead of the actual image. Also the artwork detail page was a client component making browser-side API calls to Directus, which were also blocked. + + +## Acceptance Criteria + +- [x] #1 Store listing page images load correctly +- [x] #2 Artwork detail page images load correctly +- [x] #3 Detail page data fetching happens server-side (not browser) +- [x] #4 Cart functionality still works on detail page + + +## Implementation Notes + + +## Root Cause +Directus CMS (katheryn-cms.jeffemmett.com) is behind Cloudflare Access (Zero Trust). The Next.js image optimizer gets a 302 redirect to a Cloudflare login page instead of the actual image. Additionally, Next.js has SSRF protection that blocks fetching from private IPs (Docker internal network resolves to 192.168.x.x). + +## Fix Applied (commits 41d784e → 2523a30) + +### Solution: API Route Proxy +Created `/api/assets/[id]` route that proxies Directus assets server-side: +- Browser fetches `/api/assets/[id]?width=...&format=webp` (same-origin) +- API route fetches from `DIRECTUS_INTERNAL_URL` (http://katheryn-cms:8055) on Docker internal network +- Bypasses Cloudflare Access (internal network) and SSRF protection (same-origin URL) +- Directus handles image transformations (width, quality, format) +- Response cached with `Cache-Control: public, max-age=31536000, immutable` + +### Other changes +- `getAssetUrl()` now returns `/api/assets/[id]?params` (local path, no token needed) +- Directus SDK client uses `DIRECTUS_INTERNAL_URL` for server-side API calls +- Store detail page converted from client to server component +- Added `images.localPatterns` for `/api/assets/**` in next.config.ts +- Added `/app/.next/cache` as tmpfs for read-only container + +### Files changed +- `frontend/src/app/api/assets/[id]/route.ts` - NEW: asset proxy API route +- `frontend/src/lib/directus.ts` - simplified getAssetUrl, internal SDK URL +- `frontend/next.config.ts` - localPatterns config +- `frontend/Dockerfile` - cleaned up unnecessary build args +- `frontend/docker-compose.yml` - cache tmpfs, cleaned up env vars +- `frontend/src/app/store/[slug]/page.tsx` - server component +- `frontend/src/app/store/[slug]/artwork-detail-client.tsx` - NEW: client component + +## Automatic Inventory Management (da77476) + +After fixing images, also fixed store data filtering: +- Store was showing 656 items (all artworks with any USD/GBP price) +- Investigated Directus data: 2,324 total artworks, 639 with USD price (imported catalog), only 19 with GBP price (real store items) +- USD-only items are imported historical catalog data (missing images, dimensions, creation dates, internal notes) +- Added `forSale` filter to `getArtworks()` using compound Directus `_and` filter +- Store-ready criteria: name (not empty) + image (uploaded) + price_gbp (> 0) + status published +- Artworks auto-appear when fields populated, auto-move to sold section on status change +- Related works on detail page also filtered to store-ready items only + +Commits: 9489418, 4744709, da77476 + +2026-02-13: Additional fix — removed `search: ''` from `localPatterns` in next.config.ts. This was blocking Next.js image optimizer from accepting /api/assets URLs with query params (width, quality, format), returning 400 "url parameter is not allowed". Commit 09567ce, deployed to staging. + +Session 2026-02-13: Fixed PayPal MULTI_CURRENCY_ORDER error (hardcoded GBP throughout checkout). Added PayPal client ID as Docker build arg. Added custom favicons across all deployed sites: KT monogram (katheryn-staging), no-dollar symbol (nofi.lol), retro gamepad (games.jeffemmett.com), CT monogram (cynthia-poetry). Added katheryn-website to auto-deploy webhook. All four sites rebuilt and deployed. + diff --git a/backlog/tasks/task-8 - Deploy-Directus-as-Airtable-Lightroom-replacement.md b/backlog/tasks/task-8 - Deploy-Directus-as-Airtable-Lightroom-replacement.md index 4263f1e..ca0a4fd 100644 --- a/backlog/tasks/task-8 - Deploy-Directus-as-Airtable-Lightroom-replacement.md +++ b/backlog/tasks/task-8 - Deploy-Directus-as-Airtable-Lightroom-replacement.md @@ -1,10 +1,10 @@ --- -id: task-8 +id: TASK-8 title: Deploy Directus as Airtable/Lightroom replacement -status: In Progress +status: Done assignee: [] created_date: '2026-01-18 16:07' -updated_date: '2026-02-04 23:31' +updated_date: '2026-02-13 22:04' labels: [] dependencies: [] priority: high @@ -116,4 +116,6 @@ Total data now in Directus CMS: - Events (dynamic from Directus) - Store (dynamic from Directus) - Gallery (from Directus) + +Directus CMS fully deployed and operational at katheryn-cms.jeffemmett.com. Running in Docker on Netcup with PostgreSQL + Redis. Frontend connects via internal Docker network. API proxy route handles asset delivery. Auto-deploy webhook configured.