diff --git a/client/src/components/ActivityBar/ActivityBar.vue b/client/src/components/ActivityBar/ActivityBar.vue index 4d858be613de..485b11fc4f5b 100644 --- a/client/src/components/ActivityBar/ActivityBar.vue +++ b/client/src/components/ActivityBar/ActivityBar.vue @@ -14,6 +14,7 @@ import ToolBox from "@/components/Panels/ProviderAwareToolBox.vue"; import WorkflowBox from "@/components/Panels/WorkflowBox.vue"; import ActivityItem from "./ActivityItem.vue"; import ActivitySettings from "./ActivitySettings.vue"; +import InteractiveItem from "./Items/InteractiveItem.vue"; import UploadItem from "./Items/UploadItem.vue"; import NotificationItem from "./Items/NotificationItem.vue"; @@ -146,7 +147,7 @@ function toggleContextMenu(evt: MouseEvent) { @end="isDragging = false">
- + { propsData: { id: "activity-test-id", icon: "activity-test-icon", + indicator: 0, progressPercentage: 0, progressStatus: null, title: "activity-test-title", @@ -41,4 +42,18 @@ describe("ActivityItem", () => { expect(reference.find(".bg-success").exists()).toBeFalsy(); expect(reference.find(".bg-danger").exists()).toBeTruthy(); }); + + it("rendering indicator", async () => { + const reference = wrapper.find("[id='activity-test-id']"); + const indicatorSelector = "[data-description='activity indicator']"; + const noindicator = reference.find(indicatorSelector); + expect(noindicator.exists()).toBeFalsy(); + await wrapper.setProps({ indicator: 1 }); + const indicator = reference.find(indicatorSelector); + expect(indicator.exists()).toBeTruthy(); + expect(indicator.text()).toBe("1"); + await wrapper.setProps({ indicator: 1000 }); + const maxindicator = reference.find(indicatorSelector); + expect(maxindicator.text()).toBe("99"); + }); }); diff --git a/client/src/components/ActivityBar/ActivityItem.vue b/client/src/components/ActivityBar/ActivityItem.vue index c7c11951943b..6b7443fd88b0 100644 --- a/client/src/components/ActivityBar/ActivityItem.vue +++ b/client/src/components/ActivityBar/ActivityItem.vue @@ -15,7 +15,7 @@ export interface Props { id: string; title?: string; icon?: string | object; - indicator?: boolean; + indicator?: number; isActive?: boolean; tooltip?: string; tooltipPlacement?: string; @@ -28,7 +28,7 @@ export interface Props { const props = withDefaults(defineProps(), { title: undefined, icon: "question", - indicator: false, + indicator: 0, isActive: false, options: undefined, progressPercentage: 0, @@ -71,7 +71,9 @@ function onClick(evt: MouseEvent): void { @@ -79,7 +81,7 @@ function onClick(evt: MouseEvent): void {
-
+
{{ tooltip | l }} No tooltip available for this item