\n {compareMode ? 'Compare Prompts' : 'Optimize Prompt'}\n

\n setCompareMode(!compareMode)}\n className=\"text-indigo-600 hover:text-indigo-800 text-sm font-medium\"\n >\n Switch to {compareMode ? 'Optimization' : 'Comparison'} Mode\n \n

\n\n {!compareMode ? (\n // Optimization Mode\n <>\n

\n \n Optimization Goal (optional)\n \n setGoal(e.target.value)}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500\"\n placeholder=\"e.g., 'Make the prompt more concise' or 'Improve clarity'\"\n />\n

\n\n

\n \n Current Prompt\n \n setCurrentContent(e.target.value)}\n className=\"w-full h-48 px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 font-mono text-sm\"\n placeholder=\"Enter your prompt here...\"\n >\n

\n\n

\n \n {isLoading ? (\n <>\n \n Generating Suggestions...\n \n ) : (\n 'Get Optimization Suggestions'\n )}\n \n

\n\n {suggestions && (\n

Suggestions

\n {suggestions}\n

\n \n

\n handleSaveVersion(currentContent)}\n className=\"bg-green-600 hover:bg-green-700 text-white px-4 py-2 rounded-md text-sm font-medium\"\n >\n Save Current Version\n \n

\n )}\n \n ) : (\n // Comparison Mode\n <>\n

\n \n Comparison Criteria (optional)\n \n setCriteria(e.target.value)}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500\"\n placeholder=\"e.g., 'Clarity, specificity, and conciseness'\"\n />\n

\n\n

\n \n Prompt A\n \n setPromptA(e.target.value)}\n className=\"w-full h-48 px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 font-mono text-sm\"\n placeholder=\"Enter first prompt here...\"\n >\n

\n \n Prompt B\n \n setPromptB(e.target.value)}\n className=\"w-full h-48 px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 font-mono text-sm\"\n placeholder=\"Enter second prompt here...\"\n >\n

\n\n

\n \n {isLoading ? (\n <>\n \n Comparing Prompts...\n \n ) : (\n 'Compare Prompts'\n )}\n \n

\n\n {comparison && (\n

Comparison Results

\n {comparison}\n

\n \n

\n handleSaveVersion(promptA)}\n className=\"bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-md text-sm font-medium\"\n >\n Save Prompt A\n \n handleSaveVersion(promptB)}\n className=\"bg-green-600 hover:bg-green-700 text-white px-4 py-2 rounded-md text-sm font-medium\"\n >\n Save Prompt B\n \n

\n )}\n \n )}\n

\n );\n};\n\nexport default OptimizationPanel;","deleted","label",[167,168,149],"frontend","components","permalink","https://www.val.town/x/heybunny/prompthero/code/frontend/components/OptimizationPanel.tsx","extension","actionData","errors"]