Conversation
This creates a comprehensive Next.js application that demonstrates all Terminal49 TypeScript SDK capabilities while serving as a developer reference. Features: - Dashboard with shipment/container metrics and LFD alerts - Tracking request management with smart carrier inference - Shipment list and detail views with stop/resume tracking - Container management with events, route, and demurrage views - Shipping lines browser and webhook documentation - Global search functionality UI improvements: - Clean, minimal light theme as default - Dark mode toggle with localStorage persistence - Tighter spacing throughout all components - Smaller, more refined typography - Professional color palette with semantic tokens SDK methods covered: - shipments: list, get, update, stopTracking, resumeTracking - containers: list, get, events, rawEvents, route, refresh - trackingRequests: list, get, create, update, inferNumber, createFromInfer - shippingLines: list - getDemurrage, getRailMilestones, search Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Documents the architecture, SDK method coverage, visual design mockups, implementation phases, and future improvement opportunities for the SDK showcase application. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: c55d39fdb5
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
| const shippingLine = data.shipping_line || data.shippingLine; | ||
| const decision = shippingLine?.decision || data.decision; | ||
| const selected = shippingLine?.selected || data.selected; |
There was a problem hiding this comment.
Read infer fields from JSON:API attributes
handleInfer treats the infer API response as if shipping_line, decision, and selected were top-level fields, but the SDK infer endpoint returns a JSON:API document (data.attributes.*, see Terminal49Client.inferTrackingNumber and generated schema for /tracking_requests/infer_number). In this path selectedScac never gets populated for auto-selected carriers, so Create Tracking Request stays disabled and the primary tracking flow cannot proceed.
Useful? React with 👍 / 👎.
| View Shipment → | ||
| </Button> | ||
| )} | ||
| {createResult.trackingRequest?.id && ( |
There was a problem hiding this comment.
Read created tracking request id from JSON:API payload
The success view checks createResult.trackingRequest?.id, but the create route passes through the SDK create response in JSON:API shape (trackingRequest.data.id), so this condition is false even after successful creation. As a result, users do not get the "View Request" link after creating a tracking request, which breaks the post-create navigation path.
Useful? React with 👍 / 👎.
Greptile Overview
Greptile Summary
This PR adds a complete SDK showcase Next.js application that demonstrates all Terminal49 TypeScript SDK capabilities through a comprehensive web interface.
Key Changes:
inferNumber()andcreateFromInfer()SDK methodsArchitecture Highlights:
Purpose:
This showcase serves as both a developer reference for SDK integration and a demonstration of real container tracking business workflows including demurrage management, tracking lifecycle control, and global search functionality.
Confidence Score: 5/5
Important Files Changed
Sequence Diagram
sequenceDiagram participant User participant Browser participant NextJS as Next.js App participant APIRoute as API Routes participant SDK as Terminal49 SDK participant T49API as Terminal49 API Note over User,T49API: Tracking Request Creation Flow User->>Browser: Enter tracking number Browser->>NextJS: Navigate to /tracking-requests/new NextJS->>Browser: Render tracking form User->>Browser: Click "Detect & Continue" Browser->>APIRoute: POST /api/tracking-requests/infer APIRoute->>SDK: trackingRequests.inferNumber(number) SDK->>T49API: POST /tracking_requests/infer T49API-->>SDK: { number_type, decision, candidates } SDK-->>APIRoute: Inference result APIRoute-->>Browser: Inference data Browser->>User: Display auto-detected carrier or selection alt Auto-selected carrier User->>Browser: Click "Create Tracking" Browser->>APIRoute: POST /api/tracking-requests/create APIRoute->>SDK: trackingRequests.createFromInfer(number, { scac }) else Manual selection User->>Browser: Select carrier from dropdown User->>Browser: Click "Create Tracking" Browser->>APIRoute: POST /api/tracking-requests/create APIRoute->>SDK: trackingRequests.createFromInfer(number, { scac }) end SDK->>T49API: POST /tracking_requests T49API-->>SDK: { trackingRequest, shipment } SDK-->>APIRoute: Creation result APIRoute-->>Browser: Success response Browser->>User: Display success + shipment link Note over User,T49API: Container Details View User->>Browser: Navigate to /containers/[id] Browser->>NextJS: Request container page NextJS->>SDK: containers.get(id, ['shipment']) NextJS->>SDK: containers.events(id) par Parallel API Calls SDK->>T49API: GET /containers/:id T49API-->>SDK: Container data and SDK->>T49API: GET /containers/:id/transport_events T49API-->>SDK: Events timeline end SDK-->>NextJS: Container + Events NextJS->>Browser: Render container detail page Browser->>User: Display container info & events Note over User,T49API: Refresh Container Action User->>Browser: Click "Refresh" button Browser->>APIRoute: POST /api/containers/[id]/refresh APIRoute->>SDK: containers.refresh(id) SDK->>T49API: POST /containers/:id/refresh T49API-->>SDK: Refresh triggered SDK-->>APIRoute: Success APIRoute-->>Browser: Success response Browser->>NextJS: router.refresh() NextJS->>SDK: containers.get(id) SDK->>T49API: GET /containers/:id T49API-->>SDK: Updated container data SDK-->>NextJS: Fresh data NextJS->>Browser: Re-render with updates Browser->>User: Display updated container