Fix the issue with upgrading the visual version inside the report

When user replaces the visual with new version the visual didn't render because some ItemDropDown values were not set.
adiletelf · Jan 24, 2024 · 85bb758 · 85bb758
1 parent d2026ee
commit 85bb758
Show file tree

Hide file tree

Showing 4 changed files with 90 additions and 77 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -42,19 +42,19 @@
     "karma-sourcemap-loader": "^0.4.0",
     "karma-webpack": "^5.0.0",
     "less": "^4.2.0",
-    "less-loader": "^12.0.0",
-    "playwright-chromium": "^1.41.0",
+    "less-loader": "^12.1.0",
+    "playwright-chromium": "^1.41.1",
     "powerbi-visuals-api": "~5.7.0",
-    "powerbi-visuals-tools": "^5.4.0",
+    "powerbi-visuals-tools": "^5.4.1",
     "powerbi-visuals-utils-testutils": "^6.0.3",
     "style-loader": "^3.3.4",
     "ts-loader": "^9.5.1",
     "typescript": "^5.3.3",
     "webpack": "^5.89.0"
   },
   "dependencies": {
-    "@typescript-eslint/eslint-plugin": "^6.19.0",
-    "@typescript-eslint/parser": "^6.19.0",
+    "@typescript-eslint/eslint-plugin": "^6.19.1",
+    "@typescript-eslint/parser": "^6.19.1",
     "d3-array": "^3.2.4",
     "d3-drag": "^3.0.0",
     "d3-selection": "^3.0.0",

diff --git a/src/granularity/granularityBase.ts b/src/granularity/granularityBase.ts
@@ -118,11 +118,16 @@ export class GranularityBase implements IGranularity {
             .attr("y", pixelConverter.toString(0 - this.textLabelYOffset))
             .attr("dx", this.textLabelDx);
 
+        const propsGranularity: GranularityType = props.granularSettings.granularity.value
+            ? GranularityType[props.granularSettings.granularity.value.value]
+            : GranularityType.month;
+
         // render slider
-        if (GranularityType[props.granularSettings.granularity.value.value] === this.granularityProps.granularityType) {
+        if (propsGranularity === this.granularityProps.granularityType) {
             this.renderSlider(
                 granularitySelection,
-                props.granularSettings,
+                props.granularSettings.sliderColor.value.value,
+                propsGranularity
             );
         }
 
@@ -149,7 +154,9 @@ export class GranularityBase implements IGranularity {
 
                 this.renderSlider(
                     granularitySelection,
-                    props.granularSettings,
+                    // props.granularSettings,
+                    props.granularSettings.sliderColor.value.value,
+                    propsGranularity
                 );
             });
 
@@ -293,17 +300,18 @@ export class GranularityBase implements IGranularity {
 
     private renderSlider(
         selection: Selection<any, any, any, any>,
-        granularSettings: GranularitySettingsCard,
+        sliderColor: string,
+        granularity: GranularityType,
     ): void {
         selection
             .append("rect")
             .classed("periodSlicerRect", true)
-            .style("stroke", granularSettings.sliderColor.value.value)
+            .style("stroke", sliderColor)
             .attr("x", pixelConverter.toString(0 - this.sliderXOffset))
             .attr("y", pixelConverter.toString(0 - this.sliderYOffset))
             .attr("rx", pixelConverter.toString(this.sliderRx))
             .attr("width", pixelConverter.toString(this.sliderWidth))
             .attr("height", pixelConverter.toString(this.sliderHeight))
-            .data([GranularityType[granularSettings.granularity.value.value]]);
+            .data([granularity]);
     }
 }
diff --git a/src/timeLine.ts b/src/timeLine.ts
@@ -78,7 +78,6 @@ import {
 } from "./timeLineSettingsModel";
 import {Day} from "./calendars/day";
 import {Month} from "./calendars/month";
-
 import ISelectionManager = powerbiVisualsApi.extensibility.ISelectionManager;
 import extractFilterColumnTarget = interactivityFilterService.extractFilterColumnTarget;
 
@@ -161,7 +160,7 @@ export class Timeline implements powerbiVisualsApi.extensibility.visual.IVisual
 
         const weekDayFormat: WeekDayFormat = {
             daySelection: timelineSettings.weekDay.daySelection.value,
-            day: Day[timelineSettings.weekDay.day.value.value],
+            day: timelineSettings.weekDay.day.value ? Day[timelineSettings.weekDay.day.value.value] : Day.Sunday,
         }
 
         const isCalendarChanged: boolean = previousCalendar
@@ -175,7 +174,10 @@ export class Timeline implements powerbiVisualsApi.extensibility.visual.IVisual
         if (!initialized || isCalendarChanged) {
             calendar = new CalendarFactory().create(weekStandardFormat, calendarFormat, weekDayFormat);
             timelineData.currentGranularity = timelineGranularityData.getGranularity(
-                GranularityType[timelineSettings.granularity.granularity.value.value]);
+                timelineSettings.granularity.granularity.value
+                    ? GranularityType[timelineSettings.granularity.granularity.value.value]
+                    : GranularityType.month,
+            );
         } else {
             calendar = previousCalendar;
 
@@ -756,7 +758,10 @@ export class Timeline implements powerbiVisualsApi.extensibility.visual.IVisual
 
             const adjustedPeriod: IAdjustedFilterDatePeriod = this.adjustFilterDatePeriod();
             const datePeriod: ITimelineDatePeriodBase = this.datePeriod;
-            const granularity: GranularityType = GranularityType[this.formattingSettings.granularity.granularity.value.value];
+            const granularity: GranularityType = this.formattingSettings.granularity.granularity.value
+                ? GranularityType[this.formattingSettings.granularity.granularity.value.value]
+                : GranularityType.month;
+
             const isCurrentPeriodSelected: boolean = !this.isForceSelectionReset && this.formattingSettings.forceSelection.currentPeriod.value;
             const isLatestAvailableDateSelected: boolean = !this.isForceSelectionReset && this.formattingSettings.forceSelection.latestAvailableDate.value;
             const isForceSelected: boolean = !this.isForceSelectionReset && (isCurrentPeriodSelected || isLatestAvailableDateSelected);
@@ -1294,7 +1299,7 @@ export class Timeline implements powerbiVisualsApi.extensibility.visual.IVisual
 
         const weekDayFormat: WeekDayFormat = {
             daySelection: formattingSettings.weekDay.daySelection.value,
-            day: Day[formattingSettings.weekDay.day.value.value],
+            day: formattingSettings.weekDay.day.value ? Day[formattingSettings.weekDay.day.value.value] : Day.Sunday,
         }
 
         const calendar: Calendar = this.calendarFactory.create(weekStandardFormat, calendarFormat, weekDayFormat);