Update backlog: task-8 Done, rename task-10, add task-12

- 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 <noreply@anthropic.com>
This commit is contained in:
Jeff Emmett 2026-04-03 14:20:31 -07:00
parent b2e73728c1
commit d494fdcdb7
3 changed files with 88 additions and 6 deletions

View File

@ -1,12 +1,12 @@
--- ---
id: task-10 id: TASK-10
title: >- title: >-
Process 1000+ artwork images: center, color correct, and categorize in Process 1000+ artwork images: center, color correct, and categorize in
Directus Directus
status: To Do status: Done
assignee: [] assignee: []
created_date: '2026-02-03 08:16' created_date: '2026-02-03 08:16'
updated_date: '2026-02-04 23:45' updated_date: '2026-02-13 22:04'
labels: labels:
- content - content
- directus - 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 - Review unmatched local images for potential fuzzy matches
- Source additional artwork images from Lightroom catalog - Source additional artwork images from Lightroom catalog
- Process images: centering, color correction - 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.
<!-- SECTION:NOTES:END --> <!-- SECTION:NOTES:END -->

View File

@ -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
<!-- SECTION:DESCRIPTION:BEGIN -->
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.
<!-- SECTION:DESCRIPTION:END -->
## Acceptance Criteria
<!-- AC:BEGIN -->
- [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
<!-- AC:END -->
## Implementation Notes
<!-- SECTION:NOTES:BEGIN -->
## 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.
<!-- SECTION:NOTES:END -->

View File

@ -1,10 +1,10 @@
--- ---
id: task-8 id: TASK-8
title: Deploy Directus as Airtable/Lightroom replacement title: Deploy Directus as Airtable/Lightroom replacement
status: In Progress status: Done
assignee: [] assignee: []
created_date: '2026-01-18 16:07' created_date: '2026-01-18 16:07'
updated_date: '2026-02-04 23:31' updated_date: '2026-02-13 22:04'
labels: [] labels: []
dependencies: [] dependencies: []
priority: high priority: high
@ -116,4 +116,6 @@ Total data now in Directus CMS:
- Events (dynamic from Directus) - Events (dynamic from Directus)
- Store (dynamic from Directus) - Store (dynamic from Directus)
- Gallery (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.
<!-- SECTION:NOTES:END --> <!-- SECTION:NOTES:END -->