feat: image_prompt_instructions in ChannelEdit
- Добавлен state imagePromptInstructions с дефолтом из style.image_prompt_instructions - Новая карточка UI с textarea (макс 500 символов + счётчик) - Поле включено в PATCH payload - Размещено между палиткой и info-блоком «Как это работает»
This commit is contained in:
@@ -80,6 +80,7 @@ export default function ChannelEdit({ channel }) {
|
||||
const [imageStyle, setImageStyle] = useState(style.image_style || 'flat-illustration');
|
||||
const [imagePalette, setImagePalette] = useState(style.image_palette || 'auto');
|
||||
const [imageCustomColors, setImageCustomColors] = useState(style.image_custom_colors || '');
|
||||
const [imagePromptInstructions, setImagePromptInstructions] = useState(style.image_prompt_instructions || '');
|
||||
|
||||
const [saving, setSaving] = useState(false);
|
||||
const [deleting, setDeleting] = useState(false);
|
||||
@@ -103,6 +104,7 @@ export default function ChannelEdit({ channel }) {
|
||||
image_style: imageStyle,
|
||||
image_palette: imagePalette,
|
||||
image_custom_colors: imageCustomColors.trim() || null,
|
||||
image_prompt_instructions: imagePromptInstructions.trim() || null,
|
||||
},
|
||||
};
|
||||
const res = await fetch(`/api/channels/${channel.id}`, {
|
||||
@@ -329,6 +331,26 @@ export default function ChannelEdit({ channel }) {
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Инструкции для AI */}
|
||||
<div className="card p-5">
|
||||
<h3 className="font-semibold text-sm mb-1 flex items-center gap-2">
|
||||
<Sparkles className="w-4 h-4 text-accent" />
|
||||
Инструкции для AI
|
||||
</h3>
|
||||
<p className="text-xs text-gray-500 mb-3">
|
||||
Опиши, какими должны быть картинки. Например: <em>«тёмный фон, минималистичные 3D-объекты, технологичная эстетика, без людей»</em>.
|
||||
Применяется ко всем постам и обложкам статей этого канала.
|
||||
</p>
|
||||
<textarea
|
||||
className="input min-h-[90px] text-sm"
|
||||
value={imagePromptInstructions}
|
||||
onChange={e => setImagePromptInstructions(e.target.value)}
|
||||
placeholder="Примеры: — технологичный объект на тёмном градиентном фоне, как Stripe/Vercel blog — реалистичное фото молочного производства, без людей, фокус на деталях — мягкая пастельная акварель, природа и животные, тёплый тон"
|
||||
maxLength={500}
|
||||
/>
|
||||
<div className="text-xs text-gray-500 text-right mt-1">{imagePromptInstructions.length}/500</div>
|
||||
</div>
|
||||
|
||||
{/* Preview подсказка */}
|
||||
<div className="card p-4 bg-accent/5 border-accent/20 text-sm text-gray-300">
|
||||
<div className="font-medium text-accent mb-1">Как это работает</div>
|
||||
|
||||
Reference in New Issue
Block a user