@windward/integrations 0.0.12 → 0.1.1

package/components/ExternalIntegration/Driver/Lti1p3/ManageConsumers.vue

@@ -0,0 +1,229 @@
+<template>
+    <div>
+        <Dialog
+            color="primary"
+            action-save
+            action-save-new
+            @click:save="onSaved"
+        >
+            <template #title>{{
+                $t(
+                    'windward.integrations.components.external_integration.driver.lti1p1.new'
+                )
+            }}</template>
+            <template #trigger>{{
+                $t(
+                    'windward.integrations.components.external_integration.driver.lti1p1.new'
+                )
+            }}</template>
+            <template #form="{ on, attrs }"
+                ><ManageConsumer v-bind="attrs" v-on="on"></ManageConsumer
+            ></template>
+        </Dialog>
+
+        <v-data-table
+            :headers="headers"
+            :items="consumers"
+            :items-per-page="10"
+            class="elevation-1"
+        >
+            <template #[`item.description`]="{ item }">
+                {{ item.description.replace(/(<([^>]+)>)/gi, '').trim() }}
+            </template>
+
+            <template #[`item.enabled`]="{ item }">
+                <v-icon :color="item.enabled ? 'success' : 'error'"
+                    >{{ item.enabled ? 'mdi-check' : 'mdi-close' }}
+                </v-icon>
+                <span v-if="!item.enabled" class="sr-only">{{
+                    $t('shared.forms.enabled')
+                }}</span>
+            </template>
+
+            <template #[`item.created_at`]="{ item }">
+                {{ $d(new Date(item.created_at), 'long') }}
+            </template>
+            <template #[`item.actions`]="{ index, item }">
+                <Dialog color="primary">
+                    <template #title>{{
+                        $t(
+                            'windward.integrations.components.external_integration.driver.lti1p3.view'
+                        )
+                    }}</template>
+                    <template #trigger>
+                        <v-icon small>mdi-eye-outline</v-icon>
+                        <span class="sr-only">{{
+                            $t(
+                                'windward.integrations.components.external_integration.driver.lti1p3.view'
+                            )
+                        }}</span>
+                    </template>
+                    <template #form="{ on, attrs }"
+                        ><ViewConsumer
+                            v-model="consumers[index]"
+                            v-bind="attrs"
+                            v-on="on"
+                        ></ViewConsumer
+                    ></template>
+                </Dialog>
+                <Dialog color="primary" action-save @click:save="onSaved">
+                    <template #title>{{
+                        $t(
+                            'windward.integrations.components.external_integration.driver.lti1p3.edit'
+                        )
+                    }}</template>
+                    <template #trigger>
+                        <v-icon small>mdi-pencil</v-icon>
+                        <span class="sr-only">{{
+                            $t(
+                                'windward.integrations.components.external_integration.driver.lti1p3.edit'
+                            )
+                        }}</span>
+                    </template>
+                    <template #form="{ on, attrs }"
+                        ><ManageConsumer
+                            v-model="consumers[index]"
+                            v-bind="attrs"
+                            v-on="on"
+                        ></ManageConsumer
+                    ></template>
+                </Dialog>
+
+                <v-btn icon>
+                    <v-icon @click="onConfirmDelete(item)"> mdi-delete </v-icon>
+                    <span class="sr-only">{{ $t('shared.forms.delete') }}</span>
+                </v-btn>
+            </template>
+        </v-data-table>
+    </div>
+</template>
+
+<script>
+import _ from 'lodash'
+import { mapGetters } from 'vuex'
+import LtiConsumer from '../../../../models/ExternalIntegration/LtiConsumer'
+import ManageConsumer from './ManageConsumer.vue'
+import ViewConsumer from './ViewConsumer.vue'
+import Course from '~/models/Course'
+import Organization from '~/models/Organization'
+import Dialog from '~/components/Dialog.vue'
+
+export default {
+    name: 'ManageLti1p1ConsumersDriver',
+    components: { Dialog, ManageConsumer, ViewConsumer },
+    data() {
+        return {
+            consumers: [],
+            headers: [
+                {
+                    text: this.$t(
+                        'windward.integrations.components.external_integration.target_url'
+                    ),
+                    value: 'target',
+                },
+                {
+                    text: this.$t('shared.forms.name'),
+                    value: 'name',
+                },
+                {
+                    text: this.$t('shared.forms.description'),
+                    value: 'description',
+                },
+                {
+                    text: this.$t('shared.forms.enabled'),
+                    value: 'enabled',
+                },
+                { text: this.$t('shared.forms.created'), value: 'created_at' },
+                {
+                    text: this.$t('shared.forms.actions'),
+                    value: 'actions',
+                    sortable: false,
+                },
+            ],
+        }
+    },
+
+    async fetch() {
+        if (
+            !this.$PermissionService.userHasAccessTo(
+                'plugin.windward.integrations.course.externalIntegration',
+                'readable'
+            ) ||
+            _.isEmpty(this.organization.id) ||
+            _.isEmpty(this.course.id)
+        ) {
+            // Display an angry error that they can't view this driver
+            this.$dialog.error(this.$t('shared.error.description_401'), {
+                duration: null,
+                action: {
+                    text: this.$t('shared.forms.close'),
+                    onClick: (_e, toastObject) => {
+                        toastObject.goAway(0)
+                    },
+                },
+            })
+            if (_.isEmpty(this.organization.id) || _.isEmpty(this.course.id)) {
+                // eslint-disable-next-line no-console
+                console.error(
+                    'Cannot load external integrations because organization or course is not set!'
+                )
+            } else {
+                // eslint-disable-next-line no-console
+                console.error(
+                    'You do not have access to this external integration!'
+                )
+            }
+
+            // Return so we don't even attempt loading
+            return false
+        }
+
+        await this.loadConsumers()
+    },
+    computed: {
+        ...mapGetters({
+            organization: 'organization/get',
+            course: 'course/get',
+        }),
+    },
+    methods: {
+        onSaved() {
+            this.loadConsumers()
+        },
+        async loadConsumers() {
+            this.consumers = await new LtiConsumer()
+                .for(
+                    new Organization({ id: this.organization.id }),
+                    new Course({ id: this.course.id })
+                )
+                .where('version', '1.3')
+                .get()
+        },
+        onConfirmDelete(consumer) {
+            this.$dialog.show(this.$t('shared.forms.confirm_delete_text'), {
+                icon: 'mdi-help',
+                duration: null,
+                action: [
+                    {
+                        text: this.$t('shared.forms.cancel'),
+                        onClick: (_e, toastObject) => {
+                            toastObject.goAway(0)
+                        },
+                    },
+                    {
+                        text: this.$t('shared.forms.confirm'),
+                        // router navigation
+                        onClick: (_e, toastObject) => {
+                            this.deleteConsumer(consumer)
+                            toastObject.goAway(0)
+                        },
+                    },
+                ],
+            })
+        },
+        deleteConsumer(consumer) {
+            consumer.delete()
+        },
+    },
+}
+</script>

package/components/ExternalIntegration/Driver/Lti1p3/ManageProvider.vue

@@ -127,6 +127,20 @@
                                 )
                             "
                         ></v-text-field>
+                        <v-text-field
+                            id="lti-oauth2-aud"
+                            v-model="provider.metadata.platform_oauth2_audience"
+                            :label="
+                                $t(
+                                    'windward.integrations.components.external_integration.driver.lti1p3.platform_oauth2_audience'
+                                )
+                            "
+                            :hint="
+                                $t(
+                                    'windward.integrations.components.external_integration.driver.lti1p3.platform_oauth2_audience'
+                                )
+                            "
+                        ></v-text-field>
                         <v-text-field
                             id="lti-client-id"
                             v-model="provider.metadata.tool_client_id"

package/components/ExternalIntegration/Driver/Lti1p3/ViewConsumer.vue

@@ -0,0 +1,224 @@
+<template>
+    <div>
+        <div v-if="!render" class="integration-loading">
+            <v-progress-circular size="128" indeterminate />
+        </div>
+        <div v-if="render">
+            <v-form v-model="formValid" @submit.prevent>
+                <v-row justify="center" align="center" class="mt-5">
+                    <v-col cols="12">
+                        <SecretField
+                            v-model="consumer.metadata.platform_id"
+                            :hidden="false"
+                            :placeholder="
+                                $t(
+                                    'windward.integrations.components.external_integration.driver.lti1p3.platform_id'
+                                )
+                            "
+                            :label="
+                                $t(
+                                    'windward.integrations.components.external_integration.driver.lti1p3.platform_id'
+                                )
+                            "
+                        ></SecretField>
+                        <SecretField
+                            v-model="consumer.metadata.client_id"
+                            :hidden="false"
+                            :placeholder="
+                                $t(
+                                    'windward.integrations.components.external_integration.driver.lti1p3.tool_client_id'
+                                )
+                            "
+                            :label="
+                                $t(
+                                    'windward.integrations.components.external_integration.driver.lti1p3.tool_client_id'
+                                )
+                            "
+                        ></SecretField>
+                        <SecretField
+                            v-model="consumer.metadata.deployment_id"
+                            :hidden="false"
+                            :placeholder="
+                                $t(
+                                    'windward.integrations.components.external_integration.driver.lti1p3.platform_deployment_id'
+                                )
+                            "
+                            :label="
+                                $t(
+                                    'windward.integrations.components.external_integration.driver.lti1p3.platform_deployment_id'
+                                )
+                            "
+                        ></SecretField>
+                        <SecretField
+                            v-model="
+                                consumer.metadata.platform_oidc_auth_endpoint
+                            "
+                            :hidden="false"
+                            :placeholder="
+                                $t(
+                                    'windward.integrations.components.external_integration.driver.lti1p3.platform_oidc_auth_endpoint'
+                                )
+                            "
+                            :label="
+                                $t(
+                                    'windward.integrations.components.external_integration.driver.lti1p3.platform_oidc_auth_endpoint'
+                                )
+                            "
+                        ></SecretField>
+                        <SecretField
+                            v-model="
+                                consumer.metadata.platform_public_keyset_url
+                            "
+                            :hidden="false"
+                            :placeholder="
+                                $t(
+                                    'windward.integrations.components.external_integration.driver.lti1p3.platform_public_keyset_url'
+                                )
+                            "
+                            :label="
+                                $t(
+                                    'windward.integrations.components.external_integration.driver.lti1p3.platform_public_keyset_url'
+                                )
+                            "
+                        ></SecretField>
+                        <SecretField
+                            v-model="
+                                consumer.metadata
+                                    .platform_oauth2_access_token_url
+                            "
+                            :hidden="false"
+                            :placeholder="
+                                $t(
+                                    'windward.integrations.components.external_integration.driver.lti1p3.platform_oauth2_access_token_url'
+                                )
+                            "
+                            :label="
+                                $t(
+                                    'windward.integrations.components.external_integration.driver.lti1p3.platform_oauth2_access_token_url'
+                                )
+                            "
+                        ></SecretField>
+                    </v-col>
+                </v-row>
+            </v-form>
+        </div>
+    </div>
+</template>
+
+<script>
+import _ from 'lodash'
+import { mapGetters } from 'vuex'
+import LtiConsumer from '../../../../models/ExternalIntegration/LtiConsumer'
+import SecretField from '../../../SecretField.vue'
+import Organization from '~/models/Organization'
+import Course from '~/models/Course'
+import FormVue from '~/components/Form'
+export default {
+    name: 'ViewLti1p3Consumer',
+    components: { SecretField },
+    extends: FormVue,
+    props: {
+        value: {
+            type: [LtiConsumer, null],
+            required: false,
+            default: null,
+        },
+    },
+    emits: ['view:consumer'],
+    meta: {
+        privilege: {
+            '': {
+                writable: true,
+            },
+        },
+    },
+    data() {
+        return {
+            render: false,
+            consumer: {
+                version: '1.3',
+                metadata: {
+                    custom: [],
+                    security_level: '',
+                    security: [],
+                },
+            },
+        }
+    },
+    computed: {
+        ...mapGetters({
+            organization: 'organization/get',
+            course: 'course/get',
+        }),
+    },
+    created() {
+        if (_.isEmpty(this.value)) {
+            this.consumer = new LtiConsumer(this.consumer)
+        } else {
+            this.consumer = new LtiConsumer(_.cloneDeep(this.value))
+        }
+    },
+    mounted() {
+        if (
+            !this.$PermissionService.userHasAccessTo(
+                'plugin.windward.integrations.course.externalIntegration',
+                'writable'
+            )
+        ) {
+            // Display an angry error that they can't view this driver
+            this.$dialog.error(this.$t('shared.error.description_401'), {
+                duration: null,
+                action: {
+                    text: this.$t('shared.forms.close'),
+                    onClick: (_e, toastObject) => {
+                        toastObject.goAway(0)
+                    },
+                },
+            })
+
+            // eslint-disable-next-line no-console
+            console.error('You do not have access to this consumer!')
+
+            // Return so we don't even attempt loading
+            return false
+        }
+
+        this.render = true
+    },
+    methods: {
+        addCustomParameter() {
+            this.consumer.metadata.custom.push({ key: '', value: '' })
+        },
+        deleteCustomParameter(index) {
+            this.consumer.metadata.custom.splice(index, 1)
+        },
+        async save() {
+            let consumer = new LtiConsumer(this.consumer).for(
+                new Organization({ id: this.organization.id }),
+                new Course({ id: this.course.id })
+            )
+
+            try {
+                consumer = await consumer.save()
+                this.consumer = consumer
+
+                // Clone and delete the metadata since we don't need to share that around
+                // Also include the vendor going back for easier mapping
+                const consumerEvent = _.cloneDeep(consumer)
+
+                this.$dialog.success(this.$t('shared.forms.saved'))
+                this.$emit('update:consumer', consumerEvent)
+            } catch (e) {
+                this.$dialog.error(
+                    this.$t('windward.integrations.shared.error.save_failed')
+                )
+            }
+        },
+        async onSave() {
+            if (this.formValid) {
+                await this.save()
+            }
+        },
+    },
+}
+</script>

package/components/ExternalIntegration/Driver/ManageLti1p3.vue

@@ -22,7 +22,7 @@
                     }}
                 </v-expansion-panel-header>
                 <v-expansion-panel-content>
-                    <!--                    <ManageConsumers></ManageConsumers>-->
+                    <ManageConsumers></ManageConsumers>
                 </v-expansion-panel-content>
             </v-expansion-panel>
         </v-expansion-panels>
@@ -31,11 +31,11 @@
 
 <script>
 import ManageProviders from './Lti1p3/ManageProviders.vue'
-/* import ManageConsumers from './Lti1p3/ManageConsumers.vue' */
+import ManageConsumers from './Lti1p3/ManageConsumers.vue'
 
 export default {
     name: 'ManageLti1p3Driver',
-    components: { ManageProviders },
+    components: { ManageProviders, ManageConsumers },
     data() {
         return {
             panel: 0,

package/components/Integration/Driver/ManageAtutor.vue

@@ -16,6 +16,7 @@
                     />
 
                     <v-text-field
+                        id="atutor-url"
                         ref="atutor_url"
                         v-model="integration.metadata.config.url"
                         :label="
@@ -28,17 +29,20 @@
                                 'windward.integrations.components.integration.driver.atutor.url_hint'
                             )
                         "
-                        :rules="urlValidation"
+                        :rules="validation.urlRules"
                     ></v-text-field>
                     <v-text-field
+                        id="atutor-username"
                         v-model="integration.metadata.config.username"
                         :label="
                             $t(
                                 'windward.integrations.components.integration.driver.atutor.username'
                             )
                         "
+                        :rules="validation.existsRules"
                     ></v-text-field>
                     <v-text-field
+                        id="atutor-password"
                         v-model="integration.metadata.config.password"
                         :label="
                             $t(
@@ -46,6 +50,7 @@
                             )
                         "
                         type="password"
+                        :rules="validation.existsRules"
                     ></v-text-field>
 
                     <v-text-field
@@ -61,7 +66,7 @@
                                 'windward.integrations.components.integration.driver.atutor.aws_secure_url_hint'
                             )
                         "
-                        :rules="urlValidation"
+                        :rules="validation.urlRules"
                     ></v-text-field>
 
                     <v-switch
@@ -104,17 +109,6 @@ export default {
             // integration: { metadata: {...} } The integration object to write to. Defined and loaded in ManageBase.vue
             errorMessage: '',
             testConnectionLoading: false,
-            urlValidation: [
-                (value) => {
-                    if (value && value.slice(-1) === '/') {
-                        return this.$t(
-                            'windward.integrations.components.integration.driver.remove_slash'
-                        )
-                    } else {
-                        return true
-                    }
-                },
-            ],
         }
     },
     methods: {

package/components/Integration/Driver/ManageBase.vue

@@ -13,13 +13,6 @@ export default {
         vendor: { type: Object, required: true, default: null },
     },
     emits: ['update:integration'],
-    meta: {
-        privilege: {
-            '': {
-                writable: true,
-            },
-        },
-    },
     data() {
         return {
             render: false,

package/components/Integration/Driver/ManageResourcespace.vue

@@ -16,6 +16,7 @@
                     />
 
                     <v-text-field
+                        id="resourcespace-url"
                         v-model="integration.metadata.config.url"
                         :label="
                             $t(
@@ -27,16 +28,20 @@
                                 'windward.integrations.components.integration.driver.resourcespace.url_hint'
                             )
                         "
+                        :rules="validation.urlRules"
                     ></v-text-field>
                     <v-text-field
+                        id="resourcespace-username"
                         v-model="integration.metadata.config.username"
                         :label="
                             $t(
                                 'windward.integrations.components.integration.driver.resourcespace.username'
                             )
                         "
+                        :rules="validation.existsRules"
                     ></v-text-field>
                     <v-text-field
+                        id="resourcespace-key"
                         v-model="integration.metadata.config.key"
                         :label="
                             $t(
@@ -44,6 +49,7 @@
                             )
                         "
                         type="password"
+                        :rules="validation.existsRules"
                     ></v-text-field>
 
                     <v-switch

package/components/Integration/JobLog.vue

@@ -268,6 +268,9 @@ export default {
             ],
         }
     },
+    async fetch() {
+        await this.loadLog()
+    },
     computed: {
         ...mapGetters({
             organization: 'organization/get',
@@ -376,9 +379,7 @@ export default {
             }
         },
     },
-    mounted() {
-        this.loadLog()
-    },
+    mounted() {},
     methods: {
         async loadLog() {
             this.job = {}

package/components/SecretField.vue

@@ -1,5 +1,12 @@
 <template>
-    <v-text-field id="secret-field" :value="value" readonly :type="fieldType">
+    <v-text-field
+        id="secret-field"
+        :value="value"
+        readonly
+        :type="fieldType"
+        :placeholder="placeholder"
+        :label="label"
+    >
         <template #append>
             <v-btn icon @click="toggleClear">
                 <v-icon>{{ showClear ? 'mdi-eye-off' : 'mdi-eye' }}</v-icon>
@@ -19,6 +26,14 @@ export default {
         value: { type: String, required: false, default: '' },
         hidden: { type: Boolean, required: false, default: true },
         copy: { type: Boolean, required: false, default: true },
+        placeholder: {
+            type: String,
+            required: false,
+        },
+        label: {
+            type: String,
+            required: false,
+        },
     },
     data() {
         return {