N21-1507 copy ctl tools

src/components/administration/ExternalToolSection.vue

@@ -41,6 +41,7 @@
 			class="mt-8 mb-4 button-save float-right"
 			color="primary"
 			depressed
+			data-testid="add-external-tool-button"
 			:to="{ name: 'administration-tool-config-overview' }"
 		>
 			{{ t("components.administration.externalToolsSection.action.add") }}

src/components/copy-result-modal/CopyResultModal.unit.ts

@@ -66,14 +66,18 @@ const getWrapper = (props?: any) => {
 };
 
 describe("@/components/copy-result-modal/CopyResultModal", () => {
-	beforeEach(() => {
+	beforeAll(() => {
 		// Avoids console warnings "[Vuetify] Unable to locate target [data-app]"
 		document.body.setAttribute("data-app", "true");
 		setupStores({
 			envConfigModule: EnvConfigModule,
 		});
 	});
 
+	afterEach(() => {
+		jest.clearAllMocks();
+	});
+
 	describe("basic functions", () => {
 		it("Should render component", () => {
 			const wrapper = getWrapper();
@@ -152,6 +156,35 @@ describe("@/components/copy-result-modal/CopyResultModal", () => {
 			);
 		});
 
+		describe("when root item is a Course, has no failed file and CTL_TOOLS_COPY feature flag is enabled", () => {
+			const setup = () => {
+				const copyResultItems = mockResultItems([]);
+				const wrapper = getWrapper({
+					isOpen: true,
+					copyResultItems,
+					copyResultRootItemType: CopyApiResponseTypeEnum.Course,
+				});
+
+				return { wrapper };
+			};
+
+			it("should render ctl tools copy info ", () => {
+				envConfigModule.setEnvs({
+					FEATURE_CTL_TOOLS_TAB_ENABLED: true,
+					FEATURE_CTL_TOOLS_COPY_ENABLED: true,
+				} as Envs);
+				const { wrapper } = setup();
+
+				expect(
+					wrapper.find('[data-testid="copy-result-notifications"]').text()
+				).toContain(
+					wrapper.vm.$i18n.t(
+						"components.molecules.copyResult.ctlTools.withFeature.info"
+					)
+				);
+			});
+		});
+
 		it("should merge file error and coursefiles info if root item is a Course and has a failed file ", () => {
 			const copyResultItems = mockResultItems([fileItem]);
 

src/components/copy-result-modal/CopyResultModal.vue

@@ -169,7 +169,9 @@ export default {
 				: this.$t("components.molecules.copyResult.nexboardCopy.infoTldraw");
 		},
 		externalToolsInfoText() {
-			return this.$t("components.molecules.copyResult.ctlTools.info");
+			return envConfigModule.getCtlToolsCopyEnabled
+				? this.$t("components.molecules.copyResult.ctlTools.withFeature.info")
+				: this.$t("components.molecules.copyResult.ctlTools.info");
 		},
 	},
 	methods: {

src/components/data-external-tool/ContextExternalToolConfigurationStatus.composable.ts

@@ -25,7 +25,18 @@ export const useContextExternalToolConfigurationStatus = () => {
 		}
 	};
 
+	const determineIncompleteTranslationKey = (): string => {
+		const userRoles = authModule.getUserRoles;
+
+		if (userRoles.includes("teacher")) {
+			return "common.tool.information.incompleteOnContext.teacher";
+		} else {
+			return "common.tool.information.incomplete.student";
+		}
+	};
+
 	return {
 		determineOutdatedTranslationKey,
+		determineIncompleteTranslationKey,
 	};
 };

src/components/data-external-tool/ContextExternalToolConfigurationStatus.composable.unit.ts

@@ -152,7 +152,7 @@ describe("ToolConfigurationStatus.composable", () => {
 				};
 			};
 
-			it("should return translationkey for outdated on scope school and context", () => {
+			it("should return translationkey for outdated", () => {
 				const { determineOutdatedTranslationKey, toolConfigurationStatus } =
 					setup();
 
@@ -187,7 +187,7 @@ describe("ToolConfigurationStatus.composable", () => {
 				};
 			};
 
-			it("should return translationkey for outdated on scope school ", () => {
+			it("should return translationkey for outdated ", () => {
 				const { determineOutdatedTranslationKey, toolConfigurationStatus } =
 					setup();
 
@@ -222,7 +222,7 @@ describe("ToolConfigurationStatus.composable", () => {
 				};
 			};
 
-			it("should return translationkey for outdated on scope context ", () => {
+			it("should return translationkey for outdated", () => {
 				const { determineOutdatedTranslationKey, toolConfigurationStatus } =
 					setup();
 
@@ -232,4 +232,63 @@ describe("ToolConfigurationStatus.composable", () => {
 			});
 		});
 	});
+
+	describe("determineIncompleteTranslationKey", () => {
+		describe("when user is teacher and tool is incomplete on scope context", () => {
+			const setup = () => {
+				const authModule = createModuleMocks(AuthModule, {
+					getUserRoles: ["teacher"],
+				});
+
+				const composable = mountComposable(
+					() => useContextExternalToolConfigurationStatus(),
+					{
+						[AUTH_MODULE_KEY.valueOf()]: authModule,
+					}
+				);
+
+				return {
+					...composable,
+					authModule,
+				};
+			};
+
+			it("should return translationkey for incomplete tool on scope context ", () => {
+				const { determineIncompleteTranslationKey } = setup();
+
+				const result = determineIncompleteTranslationKey();
+
+				expect(result).toEqual(
+					"common.tool.information.incompleteOnContext.teacher"
+				);
+			});
+		});
+
+		describe("when user is student and tool is incomplete on scope context", () => {
+			const setup = () => {
+				const authModule = createModuleMocks(AuthModule, {
+					getUserRoles: ["student"],
+				});
+
+				const composable = mountComposable(
+					() => useContextExternalToolConfigurationStatus(),
+					{
+						[AUTH_MODULE_KEY.valueOf()]: authModule,
+					}
+				);
+
+				return {
+					...composable,
+				};
+			};
+
+			it("should return translationkey for incomplete on scope context ", () => {
+				const { determineIncompleteTranslationKey } = setup();
+
+				const result = determineIncompleteTranslationKey();
+
+				expect(result).toEqual("common.tool.information.incomplete.student");
+			});
+		});
+	});
 });

src/components/external-tools/configuration/ExternalToolConfigSettings.vue

@@ -10,7 +10,7 @@
 </template>
 
 <script lang="ts">
-import { SchoolExternalToolConfigurationTemplate } from "@/store/external-tool";
+import { ExternalToolConfigurationTemplate } from "@/store/external-tool";
 import { computed, defineComponent, PropType, WritableComputedRef } from "vue";
 import ExternalToolConfigParameter from "./ExternalToolConfigParameter.vue";
 
@@ -19,7 +19,7 @@ export default defineComponent({
 	components: { ExternalToolConfigParameter },
 	props: {
 		template: {
-			type: Object as PropType<SchoolExternalToolConfigurationTemplate>,
+			type: Object as PropType<ExternalToolConfigurationTemplate>,
 			required: true,
 		},
 		value: {

src/components/external-tools/configuration/ExternalToolConfigurator.unit.ts

@@ -1,3 +1,4 @@
+import * as useExternalToolUtilsComposable from "@/composables/external-tool-mappings.composable";
 import { mount, MountOptions, Wrapper } from "@vue/test-utils";
 import createComponentMocks from "@@/tests/test-utils/componentMocks";
 import Vue from "vue";
@@ -9,12 +10,11 @@ import {
 	ExternalToolConfigurationTemplate,
 	SchoolExternalTool,
 } from "@/store/external-tool";
-import { i18nMock } from "@@/tests/test-utils";
 import { ContextExternalTool } from "@/store/external-tool/context-external-tool";
 import { BusinessError } from "@/store/types/commons";
-import ExternalToolConfigurator from "./ExternalToolConfigurator.vue";
-import * as useExternalToolUtilsComposable from "@/composables/external-tool-mappings.composable";
 import { I18N_KEY } from "@/utils/inject";
+import { i18nMock } from "@@/tests/test-utils";
+import ExternalToolConfigurator from "./ExternalToolConfigurator.vue";
 
 describe("ExternalToolConfigurator", () => {
 	jest
@@ -168,9 +168,11 @@ describe("ExternalToolConfigurator", () => {
 				const { wrapper } = getWrapper({
 					templates:
 						schoolExternalToolConfigurationTemplateFactory.buildList(1),
+					configuration: schoolExternalToolFactory.build(),
 				});
 
-				await wrapper.find('[data-testId="save-button"]').vm.$emit("click");
+				wrapper.find('[data-testId="save-button"]').vm.$emit("click");
+				await Vue.nextTick();
 
 				expect(wrapper.emitted("save")).toBeDefined();
 			});

src/components/external-tools/configuration/ExternalToolConfigurator.vue

@@ -83,6 +83,8 @@ import { useI18n } from "@/composables/i18n.composable";
 import {
 	ExternalToolConfigurationTemplate,
 	SchoolExternalTool,
+	ToolParameter,
+	ToolParameterEntry,
 } from "@/store/external-tool";
 import { ContextExternalTool } from "@/store/external-tool/context-external-tool";
 import { BusinessError } from "@/store/types/commons";
@@ -162,7 +164,31 @@ export default defineComponent({
 		};
 
 		const onSave = async () => {
-			emit("save", selectedTemplate.value, parameterConfiguration.value);
+			if (selectedTemplate.value) {
+				const parameterEntries: ToolParameterEntry[] = mapValidParameterEntries(
+					selectedTemplate.value
+				);
+
+				emit("save", selectedTemplate.value, parameterEntries);
+			}
+		};
+
+		const mapValidParameterEntries = (
+			template: ExternalToolConfigurationTemplate
+		) => {
+			const parameterEntries: ToolParameterEntry[] = template.parameters
+				.map(
+					(parameter: ToolParameter, index: number): ToolParameterEntry => ({
+						name: parameter.name,
+						value: parameterConfiguration.value[index],
+					})
+				)
+				.filter(
+					(parameterEntry: ToolParameterEntry) =>
+						parameterEntry.value !== undefined && parameterEntry.value !== ""
+				);
+
+			return parameterEntries;
 		};
 
 		const onChangeSelection = async () => {

src/components/feature-board-external-tool-element/ExternalToolElement.unit.ts

@@ -213,6 +213,31 @@ describe("ExternalToolElement", () => {
 			});
 		});
 
+		describe("when the element has a tool attached, but it is incomplete", () => {
+			it("should not load the launch request", async () => {
+				getWrapper(
+					{
+						element: {
+							...EMPTY_TEST_ELEMENT,
+							content: { contextExternalToolId: "contextExternalToolId" },
+						},
+						isEditMode: false,
+					},
+					externalToolDisplayDataFactory.build({
+						status: ContextExternalToolConfigurationStatusFactory.build({
+							isIncompleteOnScopeContext: true,
+						}),
+					})
+				);
+
+				await Vue.nextTick();
+
+				expect(
+					useExternalToolLaunchStateMock.fetchLaunchRequest
+				).not.toHaveBeenCalled();
+			});
+		});
+
 		describe("when the element does not have a tool attached", () => {
 			it("should open the configuration dialog immediately", async () => {
 				const { wrapper } = getWrapper({
@@ -736,5 +761,39 @@ describe("ExternalToolElement", () => {
 				expect(alert.props("error")).toEqual(error);
 			});
 		});
+
+		describe("when the tool is incomplete", () => {
+			const setup = () => {
+				const toolIncompleteStatus =
+					ContextExternalToolConfigurationStatusFactory.build({
+						isIncompleteOnScopeContext: true,
+					});
+
+				const { wrapper } = getWrapper(
+					{
+						element: EMPTY_TEST_ELEMENT,
+						isEditMode: true,
+					},
+					externalToolDisplayDataFactory.build({
+						status: toolIncompleteStatus,
+					})
+				);
+
+				return {
+					wrapper,
+					toolIncompleteStatus,
+				};
+			};
+
+			it("should display an incomplete alert", async () => {
+				const { wrapper, toolIncompleteStatus } = setup();
+
+				const alert = wrapper.find(
+					'[data-testid="board-external-tool-element-alert"]'
+				);
+
+				expect(alert.props("toolStatus")).toEqual(toolIncompleteStatus);
+			});
+		});
 	});
 });

src/components/feature-board-external-tool-element/ExternalToolElement.vue

@@ -149,12 +149,17 @@ export default defineComponent({
 				!!displayData.value?.status.isOutdatedOnScopeContext
 		);
 
+		const isToolIncomplete: ComputedRef<boolean> = computed(
+			() => !!displayData.value?.status.isIncompleteOnScopeContext
+		);
+
 		const toolConfigurationStatus: ComputedRef<ContextExternalToolConfigurationStatus> =
 			computed(() => {
 				return (
 					displayData.value?.status ?? {
 						isOutdatedOnScopeSchool: false,
 						isOutdatedOnScopeContext: false,
+						isIncompleteOnScopeContext: false,
 						isDeactivated: false,
 					}
 				);
@@ -212,7 +217,7 @@ export default defineComponent({
 			if (modelValue.value.contextExternalToolId) {
 				await fetchDisplayData(modelValue.value.contextExternalToolId);
 
-				if (!isToolOutdated.value) {
+				if (!isToolOutdated.value && !isToolIncomplete.value) {
 					await fetchLaunchRequest(modelValue.value.contextExternalToolId);
 				}
 			}
@@ -228,6 +233,7 @@ export default defineComponent({
 			error,
 			isLoading,
 			isToolOutdated,
+			isToolIncomplete,
 			isConfigurationDialogOpen,
 			toolConfigurationStatus,
 			mdiPuzzleOutline,