@windward/integrations 0.20.0 → 0.23.0

package/components/Integration/TranslateCourse.vue

@@ -0,0 +1,574 @@
+<template>
+    <v-sheet>
+        <v-row>
+            <v-col cols="12" md="8">
+                <h1 class="headline">
+                    {{ $t('windward.integrations.pages.admin.translateCourse.title') }}
+                </h1>
+                <p class="subtitle-1 mb-4">
+                    {{ $t('windward.integrations.pages.admin.translateCourse.subtitle') }}
+                </p>
+
+                <!-- Step 1: Source Language Selection -->
+                <v-autocomplete
+                    v-model="sourceLocaleId"
+                    :items="availableLocales"
+                    item-text="displayName"
+                    item-value="id"
+                    :label="$t('windward.integrations.pages.admin.translateCourse.source_language')"
+                    :loading="loadingLocales"
+                    :disabled="loadingLocales"
+                    clearable
+                    @change="onSourceLocaleChange"
+                >
+                    <template #item="{ item }">
+                        <v-list-item-content>
+                            <v-list-item-title>
+                                {{ item.displayName }}
+                            </v-list-item-title>
+                        </v-list-item-content>
+                    </template>
+                </v-autocomplete>
+
+                <!-- Step 2: Course Selection -->
+                <v-autocomplete
+                    v-if="sourceLocaleId"
+                    v-model="selectedCourseId"
+                    :items="coursesInSourceLanguage"
+                    item-text="name"
+                    item-value="id"
+                    :label="$t('windward.integrations.pages.admin.translateCourse.course')"
+                    :loading="loadingCourses"
+                    :disabled="loadingCourses"
+                    clearable
+                    @change="onCourseChange"
+                >
+                    <template #item="{ item }">
+                        <v-list-item-content>
+                            <v-list-item-title>
+                                {{ item.name }}
+                            </v-list-item-title>
+                            <v-list-item-subtitle>
+                                {{ item.status }} • {{ item.ownerName || $t('windward.integrations.pages.admin.translateCourse.no_owner') }}
+                            </v-list-item-subtitle>
+                        </v-list-item-content>
+                    </template>
+                    <template #no-data>
+                        <v-list-item>
+                            <v-list-item-content>
+                                <v-list-item-title>
+                                    {{ $t('windward.integrations.pages.admin.translateCourse.no_courses_found', [sourceLocaleName]) }}
+                                </v-list-item-title>
+                            </v-list-item-content>
+                        </v-list-item>
+                    </template>
+                </v-autocomplete>
+
+                <!-- Step 3: Target Language Selection -->
+                <v-autocomplete
+                    v-if="selectedCourseId"
+                    v-model="targetLocaleId"
+                    :items="targetLocaleOptions"
+                    item-text="displayName"
+                    item-value="id"
+                    :label="$t('windward.integrations.pages.admin.translateCourse.target_language')"
+                    :loading="loadingLocales"
+                    :disabled="loadingLocales"
+                    clearable
+                    @change="onTargetLocaleChange"
+                >
+                    <template #item="{ item }">
+                        <v-list-item-content>
+                            <v-list-item-title>
+                                {{ item.displayName }}
+                            </v-list-item-title>
+                        </v-list-item-content>
+                    </template>
+                </v-autocomplete>
+
+                <v-switch
+                    v-if="selectedCourseId"
+                    v-model="sendEmail"
+                    :label="$t('windward.integrations.pages.admin.translateCourse.send_email_notification')"
+                ></v-switch>
+
+                <!-- Translation Summary -->
+                <v-card v-if="selectedCourse && targetLocaleId" outlined class="mb-4">
+                    <v-card-title class="text-subtitle-1">
+                        {{ $t('windward.integrations.pages.admin.translateCourse.summary_title') }}
+                    </v-card-title>
+                    <v-card-text>
+                        <v-simple-table>
+                            <tbody>
+                                <tr>
+                                    <td class="font-weight-bold" style="width: 150px;">{{ $t('windward.integrations.pages.admin.translateCourse.source_course') }}</td>
+                                    <td>{{ selectedCourse.name }}</td>
+                                </tr>
+                                <tr>
+                                    <td class="font-weight-bold">{{ $t('windward.integrations.pages.admin.translateCourse.source_language_label') }}</td>
+                                    <td>{{ sourceLocaleName }}</td>
+                                </tr>
+                                <tr>
+                                    <td class="font-weight-bold">{{ $t('windward.integrations.pages.admin.translateCourse.target_language_label') }}</td>
+                                    <td>{{ targetLocaleName }}</td>
+                                </tr>
+                            </tbody>
+                        </v-simple-table>
+                    </v-card-text>
+                </v-card>
+
+                <!-- Action Buttons -->
+                <v-card-actions>
+                    <v-spacer></v-spacer>
+                    <v-btn
+                        text
+                        @click="reset"
+                    >
+                        {{ $t('windward.integrations.pages.admin.translateCourse.reset_button') }}
+                    </v-btn>
+                    <v-btn
+                        color="primary"
+                        :disabled="!canTranslate"
+                        :loading="translating"
+                        @click="startTranslation"
+                    >
+                        {{ $t('windward.integrations.pages.admin.translateCourse.start_translation_button') }}
+                    </v-btn>
+                </v-card-actions>
+            </v-col>
+        </v-row>
+
+        <!-- DIALOG 1: Retranslation Mode Selection -->
+        <v-dialog v-model="showRetranslationDialog" max-width="600" persistent>
+            <v-card>
+                <v-card-title>
+                    <v-icon color="warning" class="mr-2">mdi-alert-circle</v-icon>
+                    {{ $t('windward.integrations.pages.admin.translateCourse.retranslation_dialog.title') }}
+                </v-card-title>
+                
+                <v-card-text>
+                    <v-alert type="info" text class="mb-4">
+                        <span v-html="$t('windward.integrations.pages.admin.translateCourse.retranslation_dialog.existing_translation_info', [targetLocaleName])"></span>
+                        <br><br>
+                        <strong>{{ existingTranslation ? existingTranslation.name : '' }}</strong>
+                    </v-alert>
+                    
+                    <p class="mb-4">{{ $t('windward.integrations.pages.admin.translateCourse.retranslation_dialog.choose_how_to_proceed') }}</p>
+                    
+                    <v-radio-group v-model="retranslationMode">
+                        <v-radio value="incremental" class="mb-4">
+                            <template #label>
+                                <div>
+                                    <strong class="success--text">{{ $t('windward.integrations.pages.admin.translateCourse.retranslation_dialog.incremental_title') }}</strong> {{ $t('windward.integrations.pages.admin.translateCourse.retranslation_dialog.incremental_subtitle') }}
+                                    <div class="text-caption text--secondary">
+                                        {{ $t('windward.integrations.pages.admin.translateCourse.retranslation_dialog.incremental_description') }}
+                                        <br>
+                                        <strong>{{ $t('windward.integrations.pages.admin.translateCourse.retranslation_dialog.incremental_safe_note') }}</strong>
+                                    </div>
+                                </div>
+                            </template>
+                        </v-radio>
+                        
+                        <v-radio value="full">
+                            <template #label>
+                                <div>
+                                    <strong class="error--text">{{ $t('windward.integrations.pages.admin.translateCourse.retranslation_dialog.full_title') }}</strong>
+                                    <div class="text-caption text--secondary">
+                                        <strong class="error--text">{{ $t('windward.integrations.pages.admin.translateCourse.retranslation_dialog.full_warning') }}</strong> {{ $t('windward.integrations.pages.admin.translateCourse.retranslation_dialog.full_description') }}
+                                    </div>
+                                </div>
+                            </template>
+                        </v-radio>
+                    </v-radio-group>
+                </v-card-text>
+                
+                <v-card-actions>
+                    <v-spacer></v-spacer>
+                    <v-btn text @click="cancelRetranslation">
+                        {{ $t('windward.integrations.pages.admin.translateCourse.retranslation_dialog.cancel_button') }}
+                    </v-btn>
+                    <v-btn 
+                        color="primary" 
+                        @click="proceedToConfirmation"
+                    >
+                        {{ $t('windward.integrations.pages.admin.translateCourse.retranslation_dialog.continue_button') }}
+                    </v-btn>
+                </v-card-actions>
+            </v-card>
+        </v-dialog>
+
+        <!-- DIALOG 2: Nuclear Option Confirmation (Double Check) -->
+        <v-dialog v-model="showDeleteConfirmDialog" max-width="500" persistent>
+            <v-card>
+                <v-card-title class="error--text">
+                    <v-icon color="error" class="mr-2">mdi-alert</v-icon>
+                    {{ $t('windward.integrations.pages.admin.translateCourse.delete_confirm_dialog.title') }}
+                </v-card-title>
+                
+                <v-card-text>
+                    <v-alert type="error" prominent class="mb-4">
+                        <strong>{{ $t('windward.integrations.pages.admin.translateCourse.delete_confirm_dialog.cannot_undo') }}</strong>
+                    </v-alert>
+                    
+                    <p class="mb-3">
+                        {{ $t('windward.integrations.pages.admin.translateCourse.delete_confirm_dialog.about_to_delete') }}
+                    </p>
+                    
+                    <v-card outlined class="mb-4">
+                        <v-card-text>
+                            <div class="text-subtitle-2">{{ existingTranslation ? existingTranslation.name : '' }}</div>
+                            <div class="text-caption text--secondary">
+                                {{ $t('windward.integrations.pages.admin.translateCourse.delete_confirm_dialog.course_id') }} {{ existingTranslation ? existingTranslation.id : '' }}
+                            </div>
+                        </v-card-text>
+                    </v-card>
+                    
+                    <p class="mb-3">
+                        {{ $t('windward.integrations.pages.admin.translateCourse.delete_confirm_dialog.will_delete_title') }}
+                    </p>
+                    <ul class="mb-4">
+                        <li>{{ $t('windward.integrations.pages.admin.translateCourse.delete_confirm_dialog.will_delete_content') }}</li>
+                        <li>{{ $t('windward.integrations.pages.admin.translateCourse.delete_confirm_dialog.will_delete_assessments') }}</li>
+                        <li>{{ $t('windward.integrations.pages.admin.translateCourse.delete_confirm_dialog.will_delete_files') }}</li>
+                        <li>{{ $t('windward.integrations.pages.admin.translateCourse.delete_confirm_dialog.will_delete_progress') }}</li>
+                    </ul>
+                    
+                    <p class="mb-2">
+                        <strong>{{ $t('windward.integrations.pages.admin.translateCourse.delete_confirm_dialog.are_you_sure') }}</strong>
+                    </p>
+                    
+                    <!-- Require typing confirmation -->
+                    <v-text-field
+                        v-model="deleteConfirmationText"
+                        :label="$t('windward.integrations.pages.admin.translateCourse.delete_confirm_dialog.type_delete_to_confirm')"
+                        outlined
+                        dense
+                        class="mt-4"
+                        :error="deleteConfirmationText && deleteConfirmationText !== 'DELETE'"
+                        :hint="$t('windward.integrations.pages.admin.translateCourse.delete_confirm_dialog.type_exactly_delete')"
+                        persistent-hint
+                    ></v-text-field>
+                </v-card-text>
+                
+                <v-card-actions>
+                    <v-spacer></v-spacer>
+                    <v-btn 
+                        text 
+                        @click="cancelDeleteConfirmation"
+                    >
+                        {{ $t('windward.integrations.pages.admin.translateCourse.delete_confirm_dialog.cancel_button') }}
+                    </v-btn>
+                    <v-btn 
+                        color="error" 
+                        :disabled="deleteConfirmationText !== 'DELETE'"
+                        :loading="translating"
+                        @click="confirmRetranslation"
+                    >
+                        {{ $t('windward.integrations.pages.admin.translateCourse.delete_confirm_dialog.confirm_button') }}
+                    </v-btn>
+                </v-card-actions>
+            </v-card>
+        </v-dialog>
+    </v-sheet>
+</template>
+
+<script>
+import { mapGetters } from 'vuex'
+import Locale from '~/models/Locale'
+import Course from '~/models/Course'
+import Organization from '~/models/Organization'
+
+export default {
+    name: 'TranslateCourse',
+    data() {
+        return {
+            // Locale data
+            availableLocales: [],
+            loadingLocales: false,
+            
+            // Source language selection
+            sourceLocaleId: null,
+            
+            // Course selection
+            selectedCourseId: null,
+            selectedCourse: null,
+            coursesInSourceLanguage: [],
+            loadingCourses: false,
+            
+            // Target language selection
+            targetLocaleId: null,
+            
+            // Options
+            sendEmail: true,
+            
+            // Translation state
+            translating: false,
+            
+            // Retranslation dialog states
+            showRetranslationDialog: false,
+            showDeleteConfirmDialog: false,
+            retranslationMode: 'incremental',
+            existingTranslation: null,
+            deleteConfirmationText: '',
+        }
+    },
+    computed: {
+        ...mapGetters({
+            organization: 'organization/get',
+        }),
+        organizationModel() {
+            return new Organization({ id: this.organization.id })
+        },
+        canTranslate() {
+            return this.selectedCourse && this.targetLocaleId && !this.translating
+        },
+        sourceLocaleName() {
+            if (!this.sourceLocaleId) return ''
+            const locale = this.availableLocales.find(l => l.id === this.sourceLocaleId)
+            return locale ? locale.displayName : ''
+        },
+        targetLocaleName() {
+            if (!this.targetLocaleId) return ''
+            const locale = this.availableLocales.find(l => l.id === this.targetLocaleId)
+            return locale ? locale.displayName : ''
+        },
+        // Filter out source language from target options
+        targetLocaleOptions() {
+            return this.availableLocales.filter(l => l.id !== this.sourceLocaleId)
+        },
+    },
+    async mounted() {
+        await this.loadLocales()
+    },
+    methods: {
+        async loadLocales() {
+            this.loadingLocales = true
+            try {
+                const locales = await new Locale().get()
+                this.availableLocales = locales.map(locale => {
+                    // Use i18n translation for full language name (e.g., 'en-US' → 'English US')
+                    const i18nKey = `locales.${locale.name}`
+                    const translatedName = this.$t(i18nKey)
+                    // Get the native language name, fallback to raw name if not found
+                    const nativeName = translatedName !== i18nKey ? translatedName : locale.name
+                    // Add locale code next to the language name for clarity
+                    const displayName = `${nativeName} (${locale.name})`
+                    return {
+                        id: locale.id,
+                        name: locale.name,
+                        displayName,
+                    }
+                })
+            } catch (e) {
+                // eslint-disable-next-line no-console
+                console.error('Error loading locales:', e)
+                this.$dialog.error(this.$t('windward.integrations.pages.admin.translateCourse.locale_load_failed'))
+            } finally {
+                this.loadingLocales = false
+            }
+        },
+        
+        async onSourceLocaleChange() {
+            // Clear dependent selections
+            this.selectedCourseId = null
+            this.selectedCourse = null
+            this.targetLocaleId = null
+            
+            if (this.sourceLocaleId) {
+                await this.loadCoursesForLocale()
+            } else {
+                this.coursesInSourceLanguage = []
+            }
+        },
+        
+        async loadCoursesForLocale() {
+            this.loadingCourses = true
+            this.coursesInSourceLanguage = []
+            
+            try {
+                // Fetch courses filtered by locale_id
+                const response = await new Organization({ id: this.organization.id })
+                    .courses()
+                    .include('user', 'locale')
+                    .where('locale_id', this.sourceLocaleId)
+                    .limit(100)
+                    .nowrap()
+                    .get()
+                
+                this.coursesInSourceLanguage = response.data.map(course => ({
+                    id: course.id,
+                    name: course.name,
+                    status: course.status,
+                    ownerName: course.user 
+                        ? `${course.user.first_name} ${course.user.last_name}`
+                        : null,
+                    ...course,
+                }))
+            } catch (e) {
+                // eslint-disable-next-line no-console
+                console.error('Error loading courses:', e)
+                this.$dialog.error(this.$t('windward.integrations.pages.admin.translateCourse.courses_load_failed'))
+            } finally {
+                this.loadingCourses = false
+            }
+        },
+        
+        onCourseChange() {
+            // Clear target locale when course changes
+            this.targetLocaleId = null
+            
+            // Find the selected course object
+            this.selectedCourse = this.coursesInSourceLanguage.find(
+                c => c.id === this.selectedCourseId
+            ) || null
+        },
+        
+        onTargetLocaleChange() {
+            // Validate selection if needed
+        },
+        
+        async startTranslation() {
+            this.translating = true
+            try {
+                const course = new Course({ id: this.selectedCourseId })
+                
+                await course.request({
+                    method: 'POST',
+                    url: `${course.endpoint()}/translate`,
+                    data: {
+                        target_locale_id: this.targetLocaleId,
+                        options: {
+                            send_email: this.sendEmail,
+                        },
+                    },
+                })
+
+                // Success - show message and emit event
+                this.$dialog.success(this.$t('windward.integrations.pages.admin.translateCourse.translation_queued'))
+                this.$emit('translation-started')
+                this.reset()
+
+            } catch (e) {
+                // eslint-disable-next-line no-console
+                console.error('Translation API Error:', e.response?.status, e.response?.data)
+                
+                // Check if translation exists and requires retranslation mode
+                if (e.response?.status === 422 && e.response?.data?.requires_retranslation_mode) {
+                    // Translation exists - show mode selection dialog
+                    this.existingTranslation = {
+                        id: e.response.data.existing_course_id,
+                        name: e.response.data.existing_course_name,
+                    }
+                    this.showRetranslationDialog = true
+                } else {
+                    // eslint-disable-next-line no-console
+                    console.error('Error starting translation:', e)
+                    this.$dialog.error(
+                        e.response?.data?.message || this.$t('windward.integrations.pages.admin.translateCourse.translation_failed')
+                    )
+                }
+            } finally {
+                this.translating = false
+            }
+        },
+
+        /**
+         * Proceed from mode selection to confirmation
+         */
+        proceedToConfirmation() {
+            if (this.retranslationMode === 'full') {
+                // Show second confirmation dialog for nuclear option
+                this.showRetranslationDialog = false
+                this.showDeleteConfirmDialog = true
+            } else {
+                // Incremental mode - proceed directly
+                this.showRetranslationDialog = false
+                this.confirmRetranslation()
+            }
+        },
+
+        /**
+         * Cancel retranslation dialog
+         */
+        cancelRetranslation() {
+            this.showRetranslationDialog = false
+            this.retranslationMode = 'incremental' // Reset to default
+            this.existingTranslation = null
+            this.translating = false
+        },
+
+        /**
+         * Cancel delete confirmation dialog - go back to mode selection
+         */
+        cancelDeleteConfirmation() {
+            this.showDeleteConfirmDialog = false
+            this.deleteConfirmationText = '' // Reset
+            this.showRetranslationDialog = true // Go back to mode selection
+            this.translating = false
+        },
+
+        /**
+         * Confirm and execute retranslation
+         */
+        async confirmRetranslation() {
+            this.translating = true
+            try {
+                const course = new Course({ id: this.selectedCourseId })
+                
+                await course.request({
+                    method: 'POST',
+                    url: `${course.endpoint()}/translate`,
+                    data: {
+                        target_locale_id: this.targetLocaleId,
+                        retranslation_mode: this.retranslationMode,
+                        options: {
+                            send_email: this.sendEmail,
+                        },
+                    },
+                })
+
+                // Show appropriate success message
+                if (this.retranslationMode === 'full') {
+                    this.$dialog.success(this.$t('windward.integrations.pages.admin.translateCourse.full_retranslation_queued'))
+                } else {
+                    this.$dialog.success(this.$t('windward.integrations.pages.admin.translateCourse.incremental_retranslation_queued'))
+                }
+
+                // Emit event and reset form
+                this.$emit('translation-started')
+                this.reset()
+
+            } catch (e) {
+                // eslint-disable-next-line no-console
+                console.error('Error starting retranslation:', e)
+                this.$dialog.error(
+                    e.response?.data?.message || this.$t('windward.integrations.pages.admin.translateCourse.retranslation_failed')
+                )
+            } finally {
+                this.translating = false
+            }
+        },
+
+        reset() {
+            this.sourceLocaleId = null
+            this.selectedCourseId = null
+            this.selectedCourse = null
+            this.coursesInSourceLanguage = []
+            this.targetLocaleId = null
+            this.translating = false
+            // Reset retranslation state
+            this.showRetranslationDialog = false
+            this.showDeleteConfirmDialog = false
+            this.retranslationMode = 'incremental'
+            this.existingTranslation = null
+            this.deleteConfirmationText = ''
+        },
+    },
+}
+</script>
+
+<style scoped>
+.v-card {
+    transition: all 0.3s ease;
+}
+</style>

package/components/Settings/ExternalIntegration/LtiConsumerSettings.vue

@@ -7,23 +7,38 @@
         <br />
         <v-divider class="primary"></v-divider>
         <br />
-        <v-select
-            v-model="block.metadata.config.launch_type"
-            :label="
-                $t(
-                    'windward.integrations.components.settings.external_integration.lti_consumer.launch_type'
-                )
-            "
-            :items="launchTypes"
-            item-text="name"
-            item-value="value"
-            :disabled="render"
-        ></v-select>
         {{
             $t(
                 'windward.integrations.components.settings.external_integration.lti_consumer.link_select'
             )
         }}
+        <v-alert v-if="!consumers.length" type="warning">
+            <p>
+                {{
+                    $t(
+                        'windward.integrations.components.settings.external_integration.lti_consumer.no_links'
+                    )
+                }}
+            </p>
+            <p
+                v-if="
+                    $PermissionService.userHasAccessTo(
+                        'plugin.windward.integrations.course.externalIntegration',
+                        'readable'
+                    )
+                "
+            >
+                <NuxtLink
+                    :to="'/course/' + course.id + '/integrations/external'"
+                >
+                    {{
+                        $t(
+                            'windward.integrations.components.settings.external_integration.lti_consumer.create_link'
+                        )
+                    }}
+                </NuxtLink>
+            </p>
+        </v-alert>
         <v-list>
             <v-list-item-group
                 v-model="block.metadata.config.tool_id"
@@ -65,6 +80,18 @@
                 </v-list-item>
             </v-list-item-group>
         </v-list>
+        <v-select
+            v-model="block.metadata.config.launch_type"
+            :label="
+                $t(
+                    'windward.integrations.components.settings.external_integration.lti_consumer.launch_type'
+                )
+            "
+            :items="launchTypes"
+            item-text="name"
+            item-value="value"
+            :disabled="render"
+        ></v-select>
     </v-container>
 </template>
 
@@ -75,6 +102,7 @@ import Course from '~/models/Course'
 import Organization from '~/models/Organization'
 import BaseContentBlockSettings from '~/components/Content/Settings/BaseContentBlockSettings.vue'
 import Consumer from '../../../models/ExternalIntegration/Consumer'
+import _ from 'lodash'
 
 export default {
     name: 'ContentBlockExternalIntegrationLti1p1ConsumerSettings',
@@ -161,6 +189,11 @@ export default {
         if (!_.isBoolean(this.block.metadata.config.display_title)) {
             this.$set(this.block.metadata.config, 'display_title', true)
         }
+        if (_.isEmpty(this.block.metadata.config.title)) {
+            this.block.metadata.config.title = this.$t(
+                'windward.integrations.components.content.blocks.external_integration.lti_consumer.title'
+            )
+        }
     },
     mounted() {},
     methods: {},

package/helpers/ExternalIntegration/ScormHelper.ts

@@ -80,7 +80,7 @@ export default class ScormHelper {
             return
         }
 
-        const payload = {
+        const payload: any = {
             type: 'update:tracking',
             launch_config: this.getLaunchConfig(),
             url: null,