vignesh/trypost
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat(automations): content-style picker in the generate node config

Browse source
This commit is contained in:
Paulo Castellano 2026-06-17 20:05:49 -03:00
parent 7fd84507b3
commit 5df03f775a
4 changed files with 39 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
lang/en/automations.php
View file

@ -285,6 +285,7 @@
'use_brand_voice_hint' => 'Apply your brand description and voice. Turn off for faithful curation of third-party sources (news, RSS).',
'use_brand_visuals' => 'Use brand visuals',
'use_brand_visuals_hint' => 'Steer AI images with your brand colors and identity. Turn off for neutral imagery driven only by the post topic.',
'style' => 'Style',
'account_summary' => ':count account · :format|:count accounts · :format',
'formats' => [
'single' => 'single',

1
lang/es/automations.php
View file

@ -285,6 +285,7 @@
'use_brand_voice_hint' => 'Aplica la descripción y la voz de tu marca. Desactiva para curaduría fiel de fuentes de terceros (noticias, RSS).',
'use_brand_visuals' => 'Usar visual de marca',
'use_brand_visuals_hint' => 'Guía las imágenes de IA con los colores e identidad de tu marca. Desactiva para imágenes neutrales, guiadas solo por el tema del post.',
'style' => 'Estilo',
'account_summary' => ':count cuenta · :format|:count cuentas · :format',
'formats' => [
'single' => 'único',

1
lang/pt-BR/automations.php
View file

@ -285,6 +285,7 @@
'use_brand_voice_hint' => 'Aplica a descrição e a voz da sua marca. Desligue para curadoria fiel de fontes de terceiros (notícias, RSS).',
'use_brand_visuals' => 'Usar visual da marca',
'use_brand_visuals_hint' => 'Guia as imagens de IA com as cores e identidade da sua marca. Desligue para imagens neutras, guiadas só pelo tema do post.',
'style' => 'Estilo',
'account_summary' => ':count conta · :format|:count contas · :format',
'formats' => [
'single' => 'único',

36
resources/js/components/automations/config/GenerateNodeConfig.vue
View file

@ -48,8 +48,15 @@ interface GenerateConfig {
prompt_template: string;
use_brand_voice: boolean;
use_brand_visuals: boolean;
style: string;
}
const contentStyles = [
{ key: 'image_card', preview: '/images/ai-templates/image-card.png' },
{ key: 'tweet_card', preview: '/images/ai-templates/tweet-card.png' },
{ key: 'tweet_card_image', preview: '/images/ai-templates/tweet-card-image.png' },
];
const props = defineProps<{
data: Record<string, unknown>;
errors?: Record<string, string>;
@ -143,6 +150,7 @@ const local = ref<GenerateConfig>({
prompt_template: (props.data.prompt_template as string) ?? '',
use_brand_voice: (props.data.use_brand_voice as boolean | undefined) ?? true,
use_brand_visuals: (props.data.use_brand_visuals as boolean | undefined) ?? true,
style: (props.data.style as string) ?? 'image_card',
});
watch(local, (val) => emit('update', val), { deep: true });
@ -282,6 +290,34 @@ const channels = computed<Channel[]>(() =>
/>
</div>
<div class="space-y-2">
<Label class="text-sm font-bold">{{ $t('automations.config.generate.style') }}</Label>
<div class="grid grid-cols-3 gap-2">
<button
v-for="s in contentStyles"
:key="s.key"
type="button"
class="flex flex-col items-center gap-1.5 rounded-lg border p-2 text-left transition-colors"
:class="local.style === s.key
? 'border-violet-500 bg-violet-50 dark:bg-violet-950/30'
: 'border-border hover:border-violet-300 hover:bg-muted/50'"
@click="local.style = s.key"
>
<img
:src="s.preview"
:alt="$t('posts.ai.templates.' + s.key + '.name')"
class="w-full rounded object-cover"
/>
<span
class="text-center text-[10px] font-medium leading-tight"
:class="local.style === s.key ? 'text-violet-700 dark:text-violet-300' : 'text-foreground/70'"
>
{{ $t('posts.ai.templates.' + s.key + '.name') }}
</span>
</button>
</div>
</div>
<div v-if="imageCountCap >= 1" class="space-y-2">
<Label class="text-sm font-bold">{{ $t('automations.config.generate.image_count') }}</Label>
<p class="text-xs text-foreground/60">{{ $t('automations.config.generate.image_count_hint') }}</p>