PLU-708 (chore): design improvements

[kevinkim-ogp]

TL;DR

Improved the process-image action with better field name handling and enhanced UI labels.

What changed?

• Added automatic conversion of spaces to underscores in field names (e.g., "Signature present" becomes "Signature_present")
• Updated schema to allow spaces in field names during input
• Update getDataOutMetadatato convert it back to the original field name the user set
• Updated action name to "Process an image", added descriptions, and reordered form fields for better UX

How to test?

Field names

• Create a process-image action with field names containing spaces (e.g., "Document type", "Signature present")
  Verify the fields are accepted and transformed correctly (spaces become underscores internally)
• Check that duplicate field names are properly detected (case-insensitive)
• Confirm that the output metadata displays labels with spaces instead of underscores

Max files

• Verify that only 1 file can be selected

Sanity check

• Verify that action can process images dynamically based on the input

[kevinkim-ogp]

Warning

This pull request is not mergeable via GitHub because a downstack PR is open. Once all requirements are satisfied, merge this PR as a stack on Graphite.
Learn more

• refactor: create RTE with presets #1558
• chore: UI improvments for sending prompt #1556
• PLU-708 (chore): design improvements #1554 👈 (View in Graphite)
• feat: add maxFiles, multirow column labels #1553
• trunk/ai-actions

This stack of pull requests is managed by Graphite. Learn more about stacking.

[linear]

PLU-708 Process image: add examples for fields

[graphite-app]

The regex /^[a-zA-Z0-9\s]+$/ uses \s which matches ANY whitespace character (spaces, tabs, newlines, carriage returns, etc.), not just spaces. Users could potentially input tabs or newlines in field names.

This will cause inconsistent behavior when converting back via key.replace(/_/g, ' ') in get-data-out-metadata.ts because:

• Tab gets transformed to _ during schema validation
• But converts back to a space (not tab) in the metadata

Fix:

.regex(/^[a-zA-Z0-9 ]+$/, {
  message:
    'Output name can only contain letters, numbers, and spaces',
})

Use a literal space character instead of \s.

Suggested change

	.regex(/^[a-zA-Z0-9\s]+$/, {
	message:
	'Output name can only contain letters, numbers, and spaces',
	}),
	.regex(/^[a-zA-Z0-9 ]+$/, {
	message:
	'Output name can only contain letters, numbers, and spaces',
	}),

Spotted by Graphite



Is this helpful? React 👍 or 👎 to let us know.