fix: use $t() in Vue templates instead of trans()

trans() is the laravel-vue-i18n helper that must be imported into
<script setup> for use in TS logic (like toast messages). Inside
<template>, the plugin registers a global $t() that should be used
instead — imports aren't needed and it matches Vue I18n conventions.

Converted all :placeholder / :title / :description / :action bindings
in Brand.vue and Workspace.vue to $t(). Also added explicit
:placeholder to the Brand and Workspace Selects so if the initial
v-model value hasn't resolved to a matching SelectItem yet, the user
sees the field label instead of the raw translation key.

Dropped the now-unused trans import from Workspace.vue.
This commit is contained in:
Paulo Castellano 2026-04-16 11:22:40 -03:00
parent 9c80b6cfce
commit f0b5a5ae4d
2 changed files with 17 additions and 18 deletions

View file

@ -123,7 +123,7 @@ const runAutofill = async () => {
id="brand_website"
v-model="form.brand_website"
type="url"
:placeholder="trans('onboarding.brand.website_placeholder')"
:placeholder="$t('onboarding.brand.website_placeholder')"
class="flex-1"
/>
<Button
@ -149,7 +149,7 @@ const runAutofill = async () => {
<Textarea
id="brand_description"
v-model="form.brand_description"
:placeholder="trans('onboarding.brand.brand_description_placeholder')"
:placeholder="$t('onboarding.brand.brand_description_placeholder')"
rows="3"
/>
<InputError :message="form.errors.brand_description" />
@ -160,7 +160,7 @@ const runAutofill = async () => {
<Label for="brand_tone">{{ $t('onboarding.brand.tone') }}</Label>
<Select v-model="form.brand_tone">
<SelectTrigger id="brand_tone" class="w-full">
<SelectValue />
<SelectValue :placeholder="$t('onboarding.brand.tone')" />
</SelectTrigger>
<SelectContent>
<SelectItem value="professional">{{ $t('onboarding.brand.tone_professional') }}</SelectItem>
@ -179,7 +179,7 @@ const runAutofill = async () => {
<Label for="content_language">{{ $t('onboarding.brand.content_language') }}</Label>
<Select v-model="form.content_language">
<SelectTrigger id="content_language" class="w-full">
<SelectValue />
<SelectValue :placeholder="$t('onboarding.brand.content_language')" />
</SelectTrigger>
<SelectContent>
<SelectItem value="en">English</SelectItem>
@ -200,7 +200,7 @@ const runAutofill = async () => {
<Textarea
id="brand_voice_notes"
v-model="form.brand_voice_notes"
:placeholder="trans('onboarding.brand.voice_notes_placeholder')"
:placeholder="$t('onboarding.brand.voice_notes_placeholder')"
rows="3"
/>
<InputError :message="form.errors.brand_voice_notes" />

View file

@ -1,7 +1,6 @@
<script setup lang="ts">
import { Form, Head, router } from '@inertiajs/vue3';
import { IconClock, IconDots, IconShield, IconTrash, IconUser } from '@tabler/icons-vue';
import { trans } from 'laravel-vue-i18n';
import { ref } from 'vue';
import WorkspaceController from '@/actions/App/Http/Controllers/App/WorkspaceController';
@ -130,7 +129,7 @@ const changeRole = (member: Member, role: string) => {
id="name"
name="name"
:default-value="workspace.name"
:placeholder="trans('settings.workspace.name_placeholder')"
:placeholder="$t('settings.workspace.name_placeholder')"
/>
<InputError :message="errors.name" />
</div>
@ -172,7 +171,7 @@ const changeRole = (member: Member, role: string) => {
name="brand_website"
type="url"
:default-value="workspace.brand_website ?? ''"
:placeholder="trans('settings.brand.website_placeholder')"
:placeholder="$t('settings.brand.website_placeholder')"
/>
<InputError :message="errors.brand_website" />
</div>
@ -183,7 +182,7 @@ const changeRole = (member: Member, role: string) => {
id="brand_description"
name="brand_description"
:default-value="workspace.brand_description ?? ''"
:placeholder="trans('settings.brand.brand_description_placeholder')"
:placeholder="$t('settings.brand.brand_description_placeholder')"
rows="3"
/>
<InputError :message="errors.brand_description" />
@ -194,7 +193,7 @@ const changeRole = (member: Member, role: string) => {
<Label for="brand_tone">{{ $t('settings.brand.tone') }}</Label>
<Select v-model="brandTone" name="brand_tone">
<SelectTrigger id="brand_tone" class="w-full">
<SelectValue />
<SelectValue :placeholder="$t('settings.brand.tone')" />
</SelectTrigger>
<SelectContent>
<SelectItem value="professional">{{ $t('settings.brand.tone_professional') }}</SelectItem>
@ -214,7 +213,7 @@ const changeRole = (member: Member, role: string) => {
<Label for="content_language">{{ $t('settings.brand.content_language') }}</Label>
<Select v-model="contentLanguage" name="content_language">
<SelectTrigger id="content_language" class="w-full">
<SelectValue />
<SelectValue :placeholder="$t('settings.brand.content_language')" />
</SelectTrigger>
<SelectContent>
<SelectItem value="en">English</SelectItem>
@ -237,7 +236,7 @@ const changeRole = (member: Member, role: string) => {
id="brand_voice_notes"
name="brand_voice_notes"
:default-value="workspace.brand_voice_notes ?? ''"
:placeholder="trans('settings.brand.voice_notes_placeholder')"
:placeholder="$t('settings.brand.voice_notes_placeholder')"
rows="3"
/>
<InputError :message="errors.brand_voice_notes" />
@ -356,16 +355,16 @@ const changeRole = (member: Member, role: string) => {
<ConfirmDeleteModal
ref="removeMemberModal"
:title="trans('settings.members.remove_modal.title')"
:description="trans('settings.members.remove_modal.description')"
:action="trans('settings.members.remove_modal.action')"
:title="$t('settings.members.remove_modal.title')"
:description="$t('settings.members.remove_modal.description')"
:action="$t('settings.members.remove_modal.action')"
/>
<ConfirmDeleteModal
ref="cancelInvitationModal"
:title="trans('settings.members.cancel_invite_modal.title')"
:description="trans('settings.members.cancel_invite_modal.description')"
:action="trans('settings.members.cancel_invite_modal.action')"
:title="$t('settings.members.cancel_invite_modal.title')"
:description="$t('settings.members.cancel_invite_modal.description')"
:action="$t('settings.members.cancel_invite_modal.action')"
/>
</div>
</AppLayout>