Fix: Handle undefined designElements in design spec SVG rendering

The SVG element markers were trying to map over designElements without
checking if it was defined first. Now safely checks for array existence
before calling .map() to prevent errors when generating spec sheets.

.claude/settings.local.json

@@ -71,7 +71,8 @@
       "Bash(git commit -m 'Fix: Show personalised price on design review page *)",
       "Bash(git commit -m 'Fix: Safely parse designJson in admin order detail page *)",
       "Bash(xargs grep -l \"design-spec\")",
-      "Bash(git commit -m 'Improve: Design specification sheet now shows previews and info *)"
+      "Bash(git commit -m 'Improve: Design specification sheet now shows previews and info *)",
+      "Bash(git commit -m 'Fix: Handle undefined designElements in design spec SVG rendering *)"
     ]
   }
 }

src/app/api/orders/[id]/design-spec/route.ts

@@ -126,10 +126,10 @@ export async function GET(req: Request, { params }: { params: { id: string } })
                 <text x="${printAreaStartX - 25}" y="${printAreaStartY + 15}" font-size="12" fill="green" font-weight="bold">Y (0cm)</text>
 
                 <!-- Design elements with markers -->
-                ${designElements.map((el, idx) => `
+                ${designElements && designElements.length > 0 ? designElements.map((el, idx) => `
                   <circle cx="${el.x}" cy="${el.y}" r="5" fill="orange" opacity="0.9" stroke="white" stroke-width="1"/>
                   <text x="${el.x + 10}" y="${el.y - 10}" font-size="12" fill="orange" font-weight="bold" font-family="monospace">E${idx + 1}</text>
-                `).join('')}
+                `).join('') : ''}
               </svg>
             </div>
             <div style="margin-top: 15px; font-size: 12px; color: #666; text-align: left; max-width: 400px;">