Skip to content

Update Design

Method

REST method is adopted.

HTTP Method

PUT: Update design information

Naming Convention

To unify the naming of query parameters and nodes and improve readability, snake_case is used for URIs and JSON nodes in requests.

Request and Response

Headers

Meta information is set in HTTP headers, not in the response body.

Request Headers

  • Authorization
  • Content-Type
  • Accept
  • Accept-language

Response Headers

  • Content-Type

Update Design Information

URI

PUT /v1/organizations/{organization_id}/projects/{project_id}/designs/{design_id}

Path Parameters

Name Type Required Description
organization_id number Required Backend PostgreSQL organization ID
project_id number Required Backend PostgreSQL project ID
design_id string Required Design ID (format: {project_id}_{file_id}_{node_id})

Request Body

The request body is JSON.

{
  "figma_url": "https://www.figma.com/file/hDDA9BNori9OTXSClduXqR/Design-File?node-id=40002029:37033",
  "status": 2
}

Request Parameters

Name Type Required Description
figma_url string Required New Figma URL
status number Optional Processing status (0-3)

Response

The response is JSON.

{
  "id": "42_hDDA9BNori9OTXSClduXqR_40002029:37033",
  "projectId": 42,
  "s3Key": "1/42/design/hDDA9BNori9OTXSClduXqR/40002029-37033.png",
  "frameName": "Updated Screen",
  "status": 2,
  "createdAt": 1234567890000,
  "updatedAt": 1234567899999,
  "deletedAt": null,
  "createdBy": "user-id",
  "updatedBy": "updater-id",
  "deletedBy": null
}

Response Fields

Name Type Description
id string Design ID (format: {project_id}_{file_id}_{node_id})
projectId number Backend PostgreSQL project ID
s3Key string | null S3 object key
frameName string | null Figma frame name
status number Processing status (0-3)
createdAt number Creation timestamp (epoch milliseconds)
updatedAt number Update timestamp (epoch milliseconds)

Authentication

Authentication is performed using JSON Web Tokens (JWT) issued by Amazon Cognito.

Error Handling

The status codes for error handling are as follows.

Description Status Code Status Name
Invalid Figma URL or node ID mismatch 400 Bad Request
Missing credentials 401 Unauthorized
Insufficient permissions 403 Forbidden
Design, project, or organization not found 404 Not Found
Internal server error 500 Internal Server Error

Processing Flow

  1. Parse Figma URL to extract fileId and nodeId
  2. Verify the node ID from the URL matches the Figma node ID embedded in the path design_id
  3. Fetch the latest design data from Figma API
  4. Upload image and JSON schema to S3 (parallel)
  5. Send processing message to SQS
  6. Update the design in the database
  7. Return updated design information

Detailed Flowchart

flowchart TD
    Start([PUT Request]) --> Route[Route Handler]
    Route --> Auth[Auth & Parameter Extraction]
    Auth --> Service[Service Layer]

    Service --> AccessCheck[Access Check]
    AccessCheck --> HasAccess{Write permission?}
    HasAccess -->|No| Err404[404 Not Found]
    HasAccess -->|Yes| ParseURL[Parse Figma URL]

    ParseURL --> ValidURL{Valid URL?}
    ValidURL -->|NG| Err400[400 Bad Request]
    ValidURL -->|OK| CheckNodeID{nodeID match?}
    CheckNodeID -->|NG| Err400
    CheckNodeID -->|OK| GetToken[Get Figma PAT]

    GetToken --> HasToken{Token exists?}
    HasToken -->|No| Err400
    HasToken -->|Yes| FetchFigma[Call Figma API]

    FetchFigma --> ParallelS3[Parallel S3 Uploads]
    ParallelS3 --> UploadImage[Upload Image]
    ParallelS3 --> UploadJSON[Upload JSON]

    UploadImage --> SQSSend
    UploadJSON --> SQSSend[Send SQS Message]

    SQSSend --> SQSOK{Successful?}
    SQSOK -->|NG| Err500[500 Internal Error]
    SQSOK -->|OK| UpdateDB[DB Update<br/>Transaction]

    UpdateDB --> Success[200 OK]

Notes

  • The node ID in the URL must match the Figma node ID embedded in the path parameter design ID
  • Background processing runs after the update