RobotRock
Examples

Image Comparison

Complete task payload from the RobotRock dashboard Examples gallery. Open Examples in your workspace to interact with the same task in the inbox UI.

Live inbox preview is not configured. Set NEXT_PUBLIC_APP_PREVIEW_URL to your dashboard URL (e.g. the app origin that serves /preview/examples/…).

Task

{
  "type": "image-comparison",
  "name": "Image Comparison Review",
  "description": "Compare these images and select the best option"
}

Context

{
  "data": {
    "options": [
      {
        "image": "https://images.unsplash.com/photo-1506905925346-21bda4d32df4",
        "source": "Design Team A",
        "resolution": "1920x1080"
      },
      {
        "image": "https://images.unsplash.com/photo-1518837695005-2083093ee35b",
        "source": "Design Team B",
        "resolution": "1920x1080"
      }
    ]
  },
  "ui": {
    "options": {
      "ui:widget": "compare",
      "ui:title": "Image Comparison",
      "items": {
        "image": {
          "ui:widget": "image"
        }
      }
    }
  }
}

Actions

[
  {
    "title": "Select Option A",
    "description": "Choose the first image option",
    "id": "select-a",
    "schema": {
      "type": "object",
      "required": [
        "selection-reason",
        "rating"
      ],
      "properties": {
        "selection-reason": {
          "type": "string",
          "title": "Selection Reason",
          "description": "Why did you choose option A?"
        },
        "rating": {
          "type": "integer",
          "title": "Image Rating",
          "description": "Rate this image from 1-10",
          "minimum": 1,
          "maximum": 10
        }
      }
    },
    "ui": {
      "selection-reason": {
        "ui:widget": "textarea",
        "ui:placeholder": "Enter your reasoning..."
      },
      "rating": {
        "ui:widget": "RatingWidget",
        "ui:options": {}
      }
    }
  },
  {
    "title": "Select Option B",
    "description": "Choose the second image option",
    "id": "select-b",
    "schema": {
      "type": "object",
      "properties": {
        "selection-reason": {
          "type": "string",
          "title": "Selection Reason",
          "description": "Why did you choose option B?"
        },
        "rating": {
          "type": "integer",
          "title": "Image Rating",
          "description": "Rate this image from 1-10",
          "minimum": 1,
          "maximum": 10
        }
      }
    },
    "ui": {
      "selection-reason": {
        "ui:widget": "textarea",
        "ui:placeholder": "Enter your reasoning..."
      },
      "rating": {
        "ui:widget": "RatingWidget",
        "ui:options": {
          "stars": 10
        }
      }
    }
  },
  {
    "title": "Request Revisions",
    "description": "Request changes to both images",
    "id": "request-revisions",
    "schema": {
      "type": "object",
      "properties": {
        "revision-request": {
          "type": "string",
          "title": "Revision Request",
          "description": "Describe the revisions needed"
        }
      }
    },
    "ui": {
      "revision-request": {
        "ui:widget": "textarea",
        "ui:placeholder": "Enter revision details..."
      }
    }
  }
]

Widgets used

  • RatingWidget
  • compare
  • image
  • textarea

See Context for widget reference.