@windward/core 0.26.0 → 0.28.0

package/components/Settings/BlockQuoteSettings.vue

@@ -8,6 +8,9 @@
         </v-container>
         <v-divider class="my-4 primary"></v-divider>
         <v-container class="pa-0">
+            <p class="pt-4 mb-2">
+                {{ $t('windward.core.components.settings.block_quote.body') }}
+            </p>
             <TextEditor
                 v-model="block.metadata.config.block_quote.quote"
                 :rules="$Validation.getRule('longInput')"
@@ -15,9 +18,6 @@
                 outlined
                 auto-grow
                 :height="200"
-                :label="
-                    $t('windward.core.components.settings.block_quote.body')
-                "
                 :disabled="render"
             ></TextEditor>
         </v-container>
@@ -150,7 +150,9 @@ export default {
             this.block.metadata.config = {}
         }
         if (_.isEmpty(this.block.metadata.config.title)) {
-            this.block.metadata.config.title = ''
+            this.block.metadata.config.title = this.$t(
+                'windward.core.components.content.blocks.block_quote.title'
+            )
         }
         if (!_.isBoolean(this.block.metadata.config.display_title)) {
             this.$set(this.block.metadata.config, 'display_title', true)

package/components/Settings/ClickableIconsSettings.vue

@@ -64,6 +64,13 @@
                     :disabled="render"
                 ></v-switch>
             </v-container>
+            <p>
+                {{
+                    $t(
+                        'windward.core.components.settings.clickable_icon.item_header'
+                    )
+                }}
+            </p>
             <v-col class="pa-0">
                 <SortableExpansionPanel
                     v-model="block.metadata.config.items"
@@ -217,7 +224,11 @@
                     :disabled="render"
                     @click="onAddElement"
                     ><v-icon>mdi-plus</v-icon
-                    >{{ $t('shared.forms.add') }}</v-btn
+                    >{{
+                        $t(
+                            'windward.core.components.settings.clickable_icon.add_item'
+                        )
+                    }}</v-btn
                 >
             </v-row>
         </v-container>
@@ -285,15 +296,22 @@ export default {
             this.block.metadata.config = {}
         }
         if (_.isEmpty(this.block.metadata.config.title)) {
-            this.block.metadata.config.title = ''
+            this.block.metadata.config.title = this.$t(
+                'windward.core.components.settings.clickable_icon.clickable_icon_title'
+            )
+        }
+        if (_.isEmpty(this.block.metadata.config.instructions)) {
+            this.block.metadata.config.instructions = this.$t(
+                'windward.core.components.settings.clickable_icon.instructions'
+            )
         }
         if (!_.isBoolean(this.block.metadata.config.display_title)) {
             this.$set(this.block.metadata.config, 'display_title', true)
         }
         if (_.isEmpty(this.block.metadata.config.display)) {
             this.block.metadata.config.display = {
-                show_title: false,
-                show_background: false,
+                show_title: true,
+                show_background: true,
                 round_icon: false,
                 italic_icon: false,
                 large_icon: false,
@@ -304,15 +322,11 @@ export default {
             this.block.metadata.config.items = []
         }
     },
-    mounted() {
-        if (this.block.metadata.config.items.length <= 0) {
-            this.onAddElement()
-        }
-    },
+    mounted() {},
     methods: {
         onAddElement() {
             const defaultObject = {
-                icon: '',
+                icon: 'mdi-star',
                 fileConfig: {},
                 iconImage: false,
                 title: '',

package/components/Settings/EmailSettings.vue

@@ -180,7 +180,9 @@ export default {
             this.block.metadata.config = {}
         }
         if (_.isEmpty(this.block.metadata.config.title)) {
-            this.block.metadata.config.title = ''
+            this.block.metadata.config.title = this.$t(
+                'windward.core.components.content.blocks.email.email'
+            )
         }
         if (!_.isBoolean(this.block.metadata.config.display_title)) {
             this.$set(this.block.metadata.config, 'display_title', true)
@@ -193,16 +195,6 @@ export default {
         }
         if (_.isEmpty(this.block.metadata.config.emails)) {
             this.block.metadata.config.emails = []
-            const defaultObject = {
-                from: '',
-                to: '',
-                cc: '',
-                subject: '',
-                body: '',
-                tinymce_expand: false,
-                initials: '',
-            }
-            this.block.metadata.config.emails.push(defaultObject)
         }
         this.block.body = this.$t(
             'windward.core.components.content.blocks.email.title'

package/components/Settings/FileDownloadSettings.vue

@@ -15,8 +15,14 @@
             "
             :disabled="render"
         ></v-switch>
-        <v-spacer class="my-6" />
-
+        <v-divider class="my-4 primary"></v-divider>
+        <p>
+            {{
+                $t(
+                    'windward.core.components.content.blocks.file_download.items_header'
+                )
+            }}
+        </p>
         <SortableExpansionPanel
             v-model="block.metadata.config.items"
             :disabled="render"

package/components/Settings/ImageSettings.vue

@@ -1,5 +1,10 @@
 <template>
     <v-container>
+        <BaseContentBlockSettings
+            v-model="block.metadata.config"
+            :disabled="render"
+        ></BaseContentBlockSettings>
+        <v-divider class="my-4 primary"></v-divider>
         <ImageAssetSettings
             v-model="block.metadata.config"
             :assets.sync="block.assets"
@@ -13,11 +18,14 @@
 import _ from 'lodash'
 import BaseContentSettings from '~/components/Content/Settings/BaseContentSettings.js'
 import ImageAssetSettings from '~/components/Content/Settings/ImageAssetSettings.vue'
+import BaseContentBlockSettings from '~/components/Content/Settings/BaseContentBlockSettings.vue'
+import Uuid from '~/helpers/Uuid'
 
 export default {
     name: 'ImageSettings',
     components: {
         ImageAssetSettings,
+        BaseContentBlockSettings,
     },
     extends: BaseContentSettings,
     props: {
@@ -40,6 +48,24 @@ export default {
         if (_.isEmpty(this.block.metadata.config)) {
             this.block.metadata.config = {}
         }
+        // If the block is brand new and the title is missing then pre-set the word 'Image' to it
+        if (
+            !Uuid.test(this.block.id) &&
+            _.isEmpty(this.block.metadata.config.title)
+        ) {
+            this.block.metadata.config.title = this.$t(
+                'windward.core.shared.content_blocks.title.image'
+            )
+        } else if (_.isEmpty(this.block.metadata.config.title)) {
+            // Otherwise make sure the title key at least exists
+            this.block.metadata.config.title = ''
+        }
+        if (!_.isBoolean(this.block.metadata.config.display_title)) {
+            this.$set(this.block.metadata.config, 'display_title', true)
+        }
+        if (_.isEmpty(this.block.metadata.config.instructions)) {
+            this.block.metadata.config.instructions = ''
+        }
         if (_.isEmpty(this.block.metadata.config.asset)) {
             this.block.metadata.config.asset = null
         }

package/components/Settings/OpenResponseCollateSettings.vue

@@ -151,6 +151,16 @@ export default {
         if (_.isEmpty(this.block.metadata.config)) {
             this.block.metadata.config = {}
         }
+        if (_.isEmpty(this.block.metadata.config.title)) {
+            this.block.metadata.config.title = this.$t(
+                'windward.core.components.settings.open_response_collate.title'
+            )
+        }
+        if (_.isEmpty(this.block.metadata.config.instructions)) {
+            this.block.metadata.config.instructions = this.$t(
+                'windward.core.components.settings.open_response_collate.block_instructions'
+            )
+        }
         if (_.isEmpty(this.block.metadata.config.linked)) {
             this.block.metadata.config.linked = []
         }

package/components/Settings/OpenResponseSettings.vue

@@ -7,9 +7,7 @@
             ></BaseContentBlockSettings>
         </v-row>
         <p class="pt-4 mb-2">
-            {{
-                $t('windward.core.components.settings.open_response.question')
-            }}
+            {{ $t('windward.core.components.settings.open_response.question') }}
         </p>
         <TextEditor
             id="block-settings-body"
@@ -26,10 +24,25 @@
         </p>
         <TextEditor
             id="block-settings-sample-response"
+            ref="sampleResponseEditor"
             v-model="block.metadata.config.sample_response"
             :height="200"
+            :rules="sampleResponseRules"
             :disabled="render"
         ></TextEditor>
+        <v-row class="pt-4">
+            <v-col cols="12">
+                <v-switch
+                    v-model="block.metadata.config.ai_mode_for_student"
+                    :label="
+                        $t(
+                            'windward.core.components.settings.open_response.ai_mode_for_student'
+                        )
+                    "
+                    :disabled="render"
+                ></v-switch>
+            </v-col>
+        </v-row>
         <p class="pt-4">
             {{
                 $t(
@@ -86,6 +99,34 @@ export default {
             course: 'course/get',
             currentContent: 'content/get',
         }),
+        sampleResponseRules() {
+            return [
+                (value) => {
+                    if (!this.block?.metadata?.config?.ai_mode_for_student) {
+                        return true
+                    }
+
+                    const text = this.stripHtmlTags(value)
+                    return (
+                        !_.isEmpty(text) ||
+                        this.$t(
+                            'windward.core.components.settings.open_response.validation.sample_response_required_ai_mode'
+                        )
+                    )
+                },
+            ]
+        },
+    },
+    watch: {
+        'block.metadata.config.ai_mode_for_student'(newValue, oldValue) {
+            if (newValue === oldValue) {
+                return
+            }
+
+            this.$nextTick(() => {
+                this.$refs.sampleResponseEditor?.validate?.()
+            })
+        },
     },
     beforeMount() {
         if (_.isEmpty(this.block)) {
@@ -101,13 +142,17 @@ export default {
             this.block.metadata.config = {}
         }
         if (_.isEmpty(this.block.metadata.config.title)) {
-            this.block.metadata.config.title = ''
+            this.block.metadata.config.title = this.$t(
+                'windward.core.components.settings.open_response.title'
+            )
         }
         if (!_.isBoolean(this.block.metadata.config.display_title)) {
             this.$set(this.block.metadata.config, 'display_title', true)
         }
         if (_.isEmpty(this.block.metadata.config.instructions)) {
-            this.block.metadata.config.instructions = ''
+            this.block.metadata.config.instructions = this.$t(
+                'windward.core.components.settings.open_response.instructions'
+            )
         }
         if (_.isEmpty(this.block.metadata.config.sample_response)) {
             this.block.metadata.config.sample_response = ''
@@ -115,9 +160,21 @@ export default {
         if (_.isEmpty(this.block.metadata.config.starting_text)) {
             this.block.metadata.config.starting_text = ''
         }
+        if (!_.isBoolean(this.block.metadata.config.ai_mode_for_student)) {
+            this.$set(this.block.metadata.config, 'ai_mode_for_student', false)
+        }
     },
     mounted() {},
     methods: {
+        stripHtmlTags(body) {
+            if (typeof body !== 'string') {
+                return ''
+            }
+
+            let text = body.replace(/&nbsp;/gi, ' ')
+            text = text.replace(/\u00A0/g, ' ')
+            return text.replace(/(<([^>]+)>)/gi, '').trim()
+        },
         onApplyGeneratedBlock(payload = {}) {
             if (_.isEmpty(payload)) {
                 return
@@ -127,14 +184,17 @@ export default {
             const config = _.get(generatedBlock, 'metadata.config', {})
 
             this.block.body = _.get(generatedBlock, 'body', '') ?? ''
-            this.block.metadata.config.title =
-                _.get(config, 'title', '') ?? ''
+            this.block.metadata.config.title = _.get(config, 'title', '') ?? ''
             this.block.metadata.config.instructions =
                 _.get(config, 'instructions', '') ?? ''
             this.block.metadata.config.sample_response =
                 _.get(config, 'sample_response', '') ?? ''
             this.block.metadata.config.starting_text =
                 _.get(config, 'starting_text', '') ?? ''
+            if (_.has(config, 'ai_mode_for_student')) {
+                this.block.metadata.config.ai_mode_for_student =
+                    config.ai_mode_for_student
+            }
 
             if (_.has(config, 'display_title')) {
                 this.block.metadata.config.display_title = config.display_title

package/components/Settings/ScenarioChoiceSettings.vue

@@ -8,7 +8,6 @@
                 ></BaseContentBlockSettings>
             </v-col>
             <v-col class="pa-0">
-                <v-divider class="my-4 primary"></v-divider>
                 <v-select
                     v-model="block.metadata.config.display_style"
                     :items="displayStyles"
@@ -40,7 +39,15 @@
                     :disabled="render"
                 ></v-switch>
             </v-col>
+            <v-divider class="my-4 primary"></v-divider>
             <v-col class="pa-0">
+                <p>
+                    {{
+                        $t(
+                            'windward.core.components.settings.scenario_choice.choices'
+                        )
+                    }}
+                </p>
                 <SortableExpansionPanel
                     v-model="block.metadata.config.items"
                     :disabled="render"
@@ -280,7 +287,9 @@ export default {
             this.block.metadata.config = {}
         }
         if (_.isEmpty(this.block.metadata.config.title)) {
-            this.block.metadata.config.title = ''
+            this.block.metadata.config.title = this.$t(
+                'windward.core.components.settings.scenario_choice.scenario_title'
+            )
         }
         if (!_.isBoolean(this.block.metadata.config.display_title)) {
             this.$set(this.block.metadata.config, 'display_title', true)
@@ -311,9 +320,6 @@ export default {
         }
     },
     mounted() {
-        if (this.block.metadata.config.items.length <= 0) {
-            this.onAddElement()
-        }
         this.isLinked =
             !_.isEmpty(this.block.metadata.config.link_content_id) &&
             !_.isEmpty(this.block.metadata.config.link_text)

package/components/Settings/TabSettings.vue

@@ -152,7 +152,9 @@ export default {
             this.block.metadata.config = {}
         }
         if (_.isEmpty(this.block.metadata.config.title)) {
-            this.block.metadata.config.title = ''
+            this.block.metadata.config.title = this.$t(
+                'windward.core.shared.content_blocks.title.tab'
+            )
         }
         if (!_.isBoolean(this.block.metadata.config.display_title)) {
             this.$set(this.block.metadata.config, 'display_title', true)
@@ -170,27 +172,10 @@ export default {
             this.block.metadata.config.currentTab = 0
         }
         if (_.isEmpty(this.block.metadata.config.items)) {
-            const defaultObject = {
-                tabHeader: '',
-                expand: false,
-                content: '',
-                imageAsset: {
-                    display: {
-                        width: 100,
-                        margin: '',
-                        padding: '',
-                    },
-                    hideBackground: true,
-                },
-            }
             this.block.metadata.config.items = []
-            this.block.metadata.config.items.push(defaultObject)
         }
     },
     mounted() {
-        if (this.block.metadata.config.items.length <= 0) {
-            this.onAddElement()
-        }
         this.checkForCustomSpacing()
     },
     beforeDestroy() {

package/components/Settings/UserUploadSettings.vue

@@ -5,14 +5,20 @@
                 v-model="block.metadata.config"
                 :disabled="render"
             ></BaseContentBlockSettings>
-            <p>
-                {{
-                    $t(
-                        'windward.core.components.settings.user_upload.max_file_size'
-                    )
-                }}
-            </p>
         </v-container>
+        <v-divider class="my-4 primary"></v-divider>
+        <p>
+            {{
+                $t('windward.core.components.settings.user_upload.files_header')
+            }}
+        </p>
+        <p>
+            {{
+                $t(
+                    'windward.core.components.settings.user_upload.max_file_size'
+                )
+            }}
+        </p>
         <v-switch
             v-model="block.metadata.config.uploadSettings.multiple"
             :label="
@@ -161,7 +167,9 @@ export default {
             this.block.metadata.config = {}
         }
         if (_.isEmpty(this.block.metadata.config.title)) {
-            this.block.metadata.config.title = ''
+            this.block.metadata.config.title = this.$t(
+                'windward.core.components.content.blocks.user_upload.title'
+            )
         }
         if (!_.isBoolean(this.block.metadata.config.display_title)) {
             this.$set(this.block.metadata.config, 'display_title', true)

package/components/Settings/VideoSettings/SourcePicker.vue

@@ -74,12 +74,17 @@
             }}
         </v-alert>
 
-        <ContentBlockAsset
-            v-if="sourceInherit && hasLinkedCaptions"
-            :value="linkedCaptions"
-            :assets="assets"
-            disabled
-        ></ContentBlockAsset>
+        <!-- Display ALL linked captions when inheriting -->
+        <div v-if="sourceInherit && hasLinkedCaptions">
+            <div v-for="(caption, index) in linkedCaptions" :key="caption.file_asset_id || index" class="mb-2">
+                <ContentBlockAsset
+                    :value="caption"
+                    :assets="assets"
+                    :label="getCaptionLabel(caption)"
+                    disabled
+                ></ContentBlockAsset>
+            </div>
+        </div>
 
         <ContentBlockAsset
             v-if="!sourceInherit"
@@ -169,19 +174,12 @@ export default {
     data() {
         return {
             sourceInherit: true,
-            linkedCaptions: null,
+            linkedCaptions: [],
         }
     },
     computed: {
         hasLinkedCaptions() {
-            return this.linkedCaptions !== null
-        },
-        linkedCaptionsName() {
-            return _.get(
-                this.linkedCaptions,
-                'asset.name',
-                _.get(this.linkedCaptions, 'asset.public_url', '???')
-            )
+            return this.linkedCaptions && this.linkedCaptions.length > 0
         },
         isFromUrl() {
             if (
@@ -196,7 +194,26 @@ export default {
             return false
         },
     },
-    watch: {},
+    watch: {
+        // If the underlying assets change (e.g., new transcript linked),
+        // recompute the linked captions so the UI chip reflects the latest VTT.
+        assets: {
+            deep: true,
+            handler() {
+                if (this.source) {
+                    this.linkedCaptions = this.getLinkedCaptions(this.source)
+                }
+            },
+        },
+        source: {
+            deep: true,
+            handler(newSource) {
+                if (newSource) {
+                    this.linkedCaptions = this.getLinkedCaptions(newSource)
+                }
+            },
+        },
+    },
     beforeMount() {},
     mounted() {
         this.linkedCaptions = this.getLinkedCaptions(this.source)
@@ -206,7 +223,7 @@ export default {
     methods: {
         onSourceChange(file, rawFile) {
             this.linkedCaptions = this.getLinkedCaptions(rawFile)
-            this.sourceInherit = this.linkedCaptions !== null
+            this.sourceInherit = this.hasLinkedCaptions
 
             this.$emit('change:source', file, rawFile)
         },
@@ -219,19 +236,36 @@ export default {
         onUpdateAssets(assets) {
             this.$emit('update:assets', assets)
         },
+        /**
+         * Get ALL linked captions (not just the first one)
+         * @param {Object} file - The video file object
+         * @returns {Array} Array of VTT caption files
+         */
         getLinkedCaptions(file) {
             if (!file) {
-                return null
+                return []
             }
-            // Check to see if the video source has a linked asset and it's a vtt file
-            const linkedCaption = _.find(
+            // Get ALL VTT files from linked_assets (not just the first one)
+            const linkedCaptions = _.filter(
                 _.get(file, 'asset.linked_assets', []),
                 function (f) {
                     return _.get(f, 'asset.metadata.extension', '') === 'vtt'
                 }
             )
 
-            return linkedCaption || null
+            return linkedCaptions || []
+        },
+        /**
+         * Get the label with locale in parentheses for a caption
+         * Format: "(EN-US)" - if no locale, assume English
+         * @param {Object} caption - The caption file object
+         * @returns {string} Label with locale code
+         */
+        getCaptionLabel(caption) {
+            const localeCode = _.get(caption, 'locale.code') ||
+                               _.get(caption, 'asset.metadata.locale') ||
+                               'EN-US'
+            return `(${localeCode})`
         },
     },
 }

package/components/Settings/VideoSettings.vue

@@ -14,7 +14,7 @@
                         )
                     "
                 ></BaseContentBlockSettings>
-
+                <v-divider class="my-4 primary"></v-divider>
                 <h4 class="mb-3">
                     {{ $t('windward.core.components.settings.video.sources') }}
                 </h4>
@@ -423,7 +423,18 @@ export default {
             return this.playlistPaginator - 1
         },
     },
-    watch: {},
+    watch: {
+        // When the underlying block assets change (for example, when a new
+        // transcript VTT is linked to the source video), rebuild the local
+        // media model so the settings sidebar immediately reflects the
+        // latest captions without requiring a save or reload.
+        'block.assets': {
+            deep: true,
+            handler(newAssets) {
+                this.reloadMedia()
+            },
+        },
+    },
     beforeMount() {
         // Create structure for first playlist source
         if (_.isEmpty(_.get(this.block.metadata.config, `playlist`, null))) {
@@ -433,6 +444,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.core.components.settings.video.prebuilt_title'
+            )
+        }
     },
     mounted() {
         this.reloadMedia()