diff --git a/frontend/src/features/admin/oidc/OIDCForm.vue b/frontend/src/features/admin/oidc/OIDCForm.vue index 1e67ca5..f400321 100644 --- a/frontend/src/features/admin/oidc/OIDCForm.vue +++ b/frontend/src/features/admin/oidc/OIDCForm.vue @@ -2,11 +2,11 @@
- Provider + {{ $t('form.field.provider') }} @@ -32,9 +32,9 @@ - Provider URL + {{ $t('form.field.providerURL') }} - + @@ -42,9 +42,9 @@ - Client ID + {{ $t('form.field.clientID') }} - + @@ -52,9 +52,9 @@ - Client Secret + {{ $t('form.field.clientSecret') }} - + @@ -62,11 +62,11 @@ - Callback URL + {{ $t('form.field.callbackURL') }} - + - Set this URI for callback. + {{ $t('admin.sso.setThisUrlForCallback') }} @@ -76,10 +76,9 @@
- +
-
@@ -93,10 +92,11 @@ import { watch } from 'vue' import { Button } from '@/components/ui/button' import { useForm } from 'vee-validate' import { toTypedSchema } from '@vee-validate/zod' -import { oidcLoginFormSchema } from './formSchema.js' +import { createFormSchema } from './formSchema.js' import { Checkbox } from '@/components/ui/checkbox' import { Label } from '@/components/ui/label' import { vAutoAnimate } from '@formkit/auto-animate/vue' +import { useI18n } from 'vue-i18n' import { FormControl, FormField, @@ -127,7 +127,7 @@ const props = defineProps({ submitLabel: { type: String, required: false, - default: () => 'Save' + default: () => '' }, isNewForm: { type: Boolean @@ -137,9 +137,12 @@ const props = defineProps({ required: false } }) +const { t } = useI18n() + +const submitLabel = props.submitLabel || t('globals.buttons.save') const form = useForm({ - validationSchema: toTypedSchema(oidcLoginFormSchema) + validationSchema: toTypedSchema(createFormSchema(t)), }) const onSubmit = form.handleSubmit((values) => { diff --git a/frontend/src/features/admin/oidc/dataTableColumns.js b/frontend/src/features/admin/oidc/dataTableColumns.js index f328944..4aaa059 100644 --- a/frontend/src/features/admin/oidc/dataTableColumns.js +++ b/frontend/src/features/admin/oidc/dataTableColumns.js @@ -2,11 +2,11 @@ import { h } from 'vue' import dropdown from './dataTableDropdown.vue' import { format } from 'date-fns' -export const columns = [ +export const createColumns = (t) => [ { accessorKey: 'name', header: function () { - return h('div', { class: 'text-center' }, 'Name') + return h('div', { class: 'text-center' }, t('form.field.name')) }, cell: function ({ row }) { return h('div', { class: 'text-center font-medium' }, row.getValue('name')) @@ -15,7 +15,7 @@ export const columns = [ { accessorKey: 'provider', header: function () { - return h('div', { class: 'text-center' }, 'Provider') + return h('div', { class: 'text-center' }, t('form.field.provider')) }, cell: function ({ row }) { return h('div', { class: 'text-center font-medium' }, row.getValue('provider')) @@ -23,16 +23,16 @@ export const columns = [ }, { accessorKey: 'enabled', - header: () => h('div', { class: 'text-center' }, 'Enabled'), + header: () => h('div', { class: 'text-center' }, t('form.field.enabled')), cell: ({ row }) => { const enabled = row.getValue('enabled') - return h('div', { class: 'text-center' }, enabled ? 'Yes' : 'No') + return h('div', { class: 'text-center' }, enabled ? t('globals.messages.yes') : t('globals.messages.no')) } }, { accessorKey: 'updated_at', header: function () { - return h('div', { class: 'text-center' }, 'Updated at') + return h('div', { class: 'text-center' }, t('form.field.updatedAt')) }, cell: function ({ row }) { return h('div', { class: 'text-center' }, format(row.getValue('updated_at'), 'PPpp')) diff --git a/frontend/src/features/admin/oidc/dataTableDropdown.vue b/frontend/src/features/admin/oidc/dataTableDropdown.vue index 7c5a3fe..2cbc7c9 100644 --- a/frontend/src/features/admin/oidc/dataTableDropdown.vue +++ b/frontend/src/features/admin/oidc/dataTableDropdown.vue @@ -2,30 +2,35 @@ - Edit + + {{ $t('globals.buttons.edit') }} + - Delete + {{ + $t('globals.buttons.delete') + }} - Delete OIDC Provider + {{ $t('globals.messages.areYouAbsolutelySure') }} - This action cannot be undone. This will permanently delete the OIDC provider - configuration. + {{ $t('admin.sso.deleteConfirmation') }} - Cancel - Delete + {{ $t('globals.buttons.cancel') }} + + {{ $t('globals.buttons.delete') }} + diff --git a/frontend/src/features/admin/oidc/formSchema.js b/frontend/src/features/admin/oidc/formSchema.js index 6f85561..15ddcb5 100644 --- a/frontend/src/features/admin/oidc/formSchema.js +++ b/frontend/src/features/admin/oidc/formSchema.js @@ -1,20 +1,24 @@ import * as z from 'zod' -export const oidcLoginFormSchema = z.object({ +export const createFormSchema = (t) => z.object({ disabled: z.boolean().optional(), name: z.string({ - required_error: 'Name is required.' + required_error: t('globals.messages.required'), }), provider: z.string().optional(), provider_url: z .string({ - required_error: 'Provider URL is required.' + required_error: t('globals.messages.required'), }) .url({ - message: 'Provider URL must be a valid URL.' + message: t('form.error.validUrl'), }), - client_id: z.string(), - client_secret: z.string(), + client_id: z.string({ + required_error: t('globals.messages.required'), + }), + client_secret: z.string({ + required_error: t('globals.messages.required'), + }), redirect_uri: z.string().readonly().optional(), enabled: z.boolean().default(true).optional(), }) diff --git a/frontend/src/views/admin/oidc/CreateEditOIDC.vue b/frontend/src/views/admin/oidc/CreateEditOIDC.vue index 4ea47ce..338e56b 100644 --- a/frontend/src/views/admin/oidc/CreateEditOIDC.vue +++ b/frontend/src/views/admin/oidc/CreateEditOIDC.vue @@ -2,7 +2,7 @@
- + { } catch (error) { formLoading.value = false emitter.emit(EMITTER_EVENTS.SHOW_TOAST, { - title: 'Error', variant: 'destructive', description: handleHTTPError(error).message }) @@ -61,37 +62,32 @@ const submitForm = async (values) => { values.client_secret = '' } await api.updateOIDC(props.id, values) - toastDescription = 'Provider updated successfully' + toastDescription = t('globals.messages.updatedSuccessfully', { + name: t('globals.entities.provider') + }) } else { await api.createOIDC(values) router.push({ name: 'sso-list' }) - toastDescription = 'Provider created successfully' + toastDescription = t('globals.messages.createdSuccessfully', { + name: t('globals.entities.provider') + }) } emitter.emit(EMITTER_EVENTS.SHOW_TOAST, { title: 'Success', description: toastDescription }) } catch (error) { - if (props.id) { - emitter.emit(EMITTER_EVENTS.SHOW_TOAST, { - title: 'Error reloading OIDC providers', - variant: 'destructive', - description: handleHTTPError(error).message - }) - } else { - emitter.emit(EMITTER_EVENTS.SHOW_TOAST, { - title: 'Error', - variant: 'destructive', - description: handleHTTPError(error).message - }) - } + emitter.emit(EMITTER_EVENTS.SHOW_TOAST, { + variant: 'destructive', + description: handleHTTPError(error).message + }) } finally { formLoading.value = false } } const breadCrumLabel = () => { - return props.id ? 'Edit' : 'New' + return props.id ? t('globals.buttons.edit') : t('globals.buttons.new') } const isNewForm = computed(() => { @@ -99,7 +95,7 @@ const isNewForm = computed(() => { }) const breadcrumbLinks = [ - { path: 'sso-list', label: 'SSO' }, + { path: 'sso-list', label: t('globals.entities.sso') }, { path: '', label: breadCrumLabel() } ] @@ -111,7 +107,6 @@ onMounted(async () => { oidc.value = resp.data.data } catch (error) { emitter.emit(EMITTER_EVENTS.SHOW_TOAST, { - title: 'Error', variant: 'destructive', description: handleHTTPError(error).message }) diff --git a/frontend/src/views/admin/oidc/OIDCList.vue b/frontend/src/views/admin/oidc/OIDCList.vue index 5d20543..15a58ad 100644 --- a/frontend/src/views/admin/oidc/OIDCList.vue +++ b/frontend/src/views/admin/oidc/OIDCList.vue @@ -5,12 +5,16 @@
- +
- +
@@ -18,15 +22,16 @@