| 193 | } |
| 194 | |
| 195 | function formatTextVariationInput(input: any) { |
| 196 | return ( |
| 197 | <div className="space-y-2"> |
| 198 | {input?.context && ( |
| 199 | <div className="flex items-start gap-2"> |
| 200 | <span className="text-sm text-gray-400 min-w-[120px]">Context:</span> |
| 201 | <span className="text-sm text-gray-200">{input.context}</span> |
| 202 | </div> |
| 203 | )} |
| 204 | {input?.existingText && ( |
| 205 | <div className="flex items-start gap-2"> |
| 206 | <span className="text-sm text-gray-400 min-w-[120px]">Existing Text:</span> |
| 207 | <code className="text-sm text-gray-200 bg-[#1a1a1a] px-2 py-1 rounded break-words"> |
| 208 | {input.existingText} |
| 209 | </code> |
| 210 | </div> |
| 211 | )} |
| 212 | {input?.targetAudience && ( |
| 213 | <div className="flex items-start gap-2"> |
| 214 | <span className="text-sm text-gray-400 min-w-[120px]">Target Audience:</span> |
| 215 | <span className="text-sm text-gray-200">{input.targetAudience}</span> |
| 216 | </div> |
| 217 | )} |
| 218 | {input?.tone && ( |
| 219 | <div className="flex items-start gap-2"> |
| 220 | <span className="text-sm text-gray-400 min-w-[120px]">Tone:</span> |
| 221 | <span className="text-sm text-gray-200">{input.tone}</span> |
| 222 | </div> |
| 223 | )} |
| 224 | </div> |
| 225 | ); |
| 226 | } |
| 227 | |
| 228 | function formatTextVariationOutput(output: any) { |
| 229 | // Parse JSON string if needed |