refactor: support noUncheckedIndexedAccess (#8714)

taiga-family · Aug 30, 2024 · e566fac · e566fac
1 parent 53b7d00
commit e566fac
Show file tree

Hide file tree

Showing 149 changed files with 447 additions and 396 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -130,7 +130,7 @@
         "@taiga-ui/event-plugins": "4.0.1",
         "@taiga-ui/prettier-config": "0.113.3",
         "@taiga-ui/stylelint-config": "0.147.0",
-        "@taiga-ui/tsconfig": "0.113.3",
+        "@taiga-ui/tsconfig": "0.147.10",
         "@types/glob": "8.1.0",
         "@types/loader-utils": "2.0.6",
         "@types/node": "22.5.1",

diff --git a/projects/addon-charts/components/line-chart/line-chart.component.ts b/projects/addon-charts/components/line-chart/line-chart.component.ts
@@ -48,9 +48,7 @@ export class TuiLineChart {
     private readonly hover$ = new Subject<number>();
     private readonly autoId = tuiInjectId();
 
-    protected readonly hintDirective = inject(TuiLineChartHint, {
-        optional: true,
-    });
+    protected readonly hintDirective = inject(TuiLineChartHint, {optional: true});
 
     protected readonly hintOptions = inject(TuiHintOptionsDirective, {optional: true});
 
@@ -165,8 +163,10 @@ export class TuiLineChart {
 
     protected getImplicit($implicit: TuiPoint): TuiPoint | readonly TuiPoint[] {
         return (
-            this.hintDirective?.getContext(this.value.indexOf($implicit), this) ||
-            $implicit
+            (this.hintDirective?.getContext(
+                this.value.indexOf($implicit),
+                this,
+            ) as readonly TuiPoint[]) ?? $implicit
         );
     }
 

diff --git a/projects/addon-charts/components/line-days-chart/line-days-chart.component.ts b/projects/addon-charts/components/line-days-chart/line-days-chart.component.ts
@@ -1,5 +1,5 @@
 import {NgForOf} from '@angular/common';
-import type {AfterViewInit, QueryList} from '@angular/core';
+import {type AfterViewInit, type QueryList} from '@angular/core';
 import {
     ChangeDetectionStrategy,
     Component,
@@ -113,6 +113,12 @@ export class TuiLineDaysChart implements AfterViewInit {
         });
     }
 
+    public get hint():
+        | PolymorpheusContent<TuiContext<[TuiDay, number]>>
+        | PolymorpheusContent<TuiContext<readonly TuiPoint[]>> {
+        return this.hintDirective?.hint ?? this.hintContent;
+    }
+
     public ngAfterViewInit(): void {
         combineLatest([tuiLineChartDrivers(this.charts), this.hovered$])
             .pipe(
@@ -146,6 +152,30 @@ export class TuiLineDaysChart implements AfterViewInit {
         });
     }
 
+    public raise(index: number, {value}: TuiLineChart): void {
+        const x = value[index]?.[0] || 0;
+        const month = this.getDay(x);
+
+        if (!month) {
+            return;
+        }
+
+        if (this.hintDirective) {
+            this.hintDirective.raise(month);
+        } else {
+            this.onHovered(month);
+        }
+    }
+
+    public getContext(index: number, {value}: TuiLineChart): unknown {
+        const x = value[index]?.[0] || 0;
+        const day = this.getDay(x);
+
+        return this.hintDirective && day
+            ? this.hintDirective.getContext(day)
+            : this.getHintContext(x, this.value);
+    }
+
     protected get months(): ReadonlyArray<readonly TuiPoint[]> {
         return this.value.length ? this.breakMonths(this.value) : EMPTY_ARRAY;
     }
@@ -154,18 +184,12 @@ export class TuiLineDaysChart implements AfterViewInit {
         return this.months.length * (this.value[0]?.[0].daysCount || 0);
     }
 
-    protected get hint():
-        | PolymorpheusContent<TuiContext<[TuiDay, number]>>
-        | PolymorpheusContent<TuiContext<readonly TuiPoint[]>> {
-        return this.hintDirective?.hint ?? this.hintContent;
-    }
-
     @tuiPure
     protected getHintContext(
         x: number,
         value: ReadonlyArray<[TuiDay, number]>,
-    ): [TuiDay, number] {
-        return value[x - (value[0]?.[0]?.day || 0) + 1];
+    ): [TuiDay, number] | null {
+        return value[x - (value[0]?.[0]?.day || 0) + 1] ?? null;
     }
 
     protected readonly daysStringify: TuiStringHandler<number> = (index) => {
@@ -183,34 +207,10 @@ export class TuiLineDaysChart implements AfterViewInit {
         return index - offset;
     }
 
-    protected raise(index: number, {value}: TuiLineChart): void {
-        const x = value[index]?.[0] || 0;
-        const month = this.getDay(x);
-
-        if (!month) {
-            return;
-        }
-
-        if (this.hintDirective) {
-            this.hintDirective.raise(month);
-        } else {
-            this.onHovered(month);
-        }
-    }
-
     protected getWidth(index: number): number {
         return (this.getDay(index)?.daysCount || 0) * this.months.length;
     }
 
-    protected getContext(index: number, {value}: TuiLineChart): unknown {
-        const x = value[index]?.[0] || 0;
-        const day = this.getDay(x);
-
-        return this.hintDirective && day
-            ? this.hintDirective.getContext(day)
-            : this.getHintContext(x, this.value);
-    }
-
     @tuiPure
     private breakMonths(
         value: ReadonlyArray<[TuiDay, number]>,

diff --git a/projects/addon-charts/components/line-days-chart/line-days-chart.template.html b/projects/addon-charts/components/line-days-chart/line-days-chart.template.html
@@ -7,8 +7,8 @@
     [style.zIndex]="zIndex"
     [tuiHintContent]="hintContent ? hint : ''"
     [value]="month"
-    [width]="first ? firstWidth : getWidth(month[0][0])"
-    [x]="first ? 0 : getX(month[0][0])"
+    [width]="first ? firstWidth : getWidth(month[0]?.[0] ?? 0)"
+    [x]="first ? 0 : getX(month[0]?.[0] ?? 0)"
     [xStringify]="xStringify ? daysStringify : null"
     [y]="y"
     [yStringify]="yStringify"

diff --git a/projects/addon-charts/components/pie-chart/pie-chart.template.html b/projects/addon-charts/components/pie-chart/pie-chart.template.html
@@ -40,7 +40,7 @@
             [style.color]="'var(--tui-chart-categorical-0' + index + ')'"
             [tuiHint]="hintContent"
             [tuiHintContext]="{$implicit: index}"
-            [tuiPieChart]="segments[index]"
+            [tuiPieChart]="segments[index] || [0, 0]"
             (tuiHoveredChange)="onHovered($event, index)"
         />
     </g>

diff --git a/projects/cdk/directives/repeat-times/test/repeat-times.directive.spec.ts b/projects/cdk/directives/repeat-times/test/repeat-times.directive.spec.ts
@@ -82,9 +82,9 @@ describe('TuiRepeatTimes directive', () => {
         });
 
         it('passes index as implicit context', () => {
-            expect(debugElements[0].nativeElement.title).toBe('0');
-            expect(debugElements[1].nativeElement.title).toBe('1');
-            expect(debugElements[2].nativeElement.title).toBe('2');
+            expect(debugElements[0]?.nativeElement.title).toBe('0');
+            expect(debugElements[1]?.nativeElement.title).toBe('1');
+            expect(debugElements[2]?.nativeElement.title).toBe('2');
         });
     });
 });
diff --git a/projects/cdk/utils/dom/test/get-element-obscurers.spec.ts b/projects/cdk/utils/dom/test/get-element-obscurers.spec.ts
@@ -105,9 +105,9 @@ describe('tuiGetElementObscures', () => {
             const mockElementFromPoint = jest.mocked(ownerDocument.elementFromPoint);
 
             mockElementFromPoint
-                .mockReturnValueOnce(others[0])
-                .mockReturnValueOnce(others[1])
-                .mockReturnValueOnce(others[2])
+                .mockReturnValueOnce(others[0]!)
+                .mockReturnValueOnce(others[1]!)
+                .mockReturnValueOnce(others[2]!)
                 .mockReturnValueOnce(element);
 
             expect(tuiGetElementObscures(element)).toBeNull();

diff --git a/projects/core/components/calendar/test/calendar-sheet.component.spec.ts b/projects/core/components/calendar/test/calendar-sheet.component.spec.ts
@@ -103,12 +103,12 @@ describe('CalendarSheet', () => {
                 it('blocked date under condition', () => {
                     expect(getDisabledCalendarItems().length).toBe(1);
                     expect(
-                        getDisabledCalendarItems()[0].nativeElement.textContent.trim(),
+                        getDisabledCalendarItems()[0]?.nativeElement.textContent.trim(),
                     ).toBe('20');
                 });
 
                 it('click on blocked date does not change value', () => {
-                    getDisabledCalendarItems()[0].nativeElement.click();
+                    getDisabledCalendarItems()[0]?.nativeElement.click();
                     fixture.detectChanges();
 
                     expect(testComponent.value).toBeNull();

diff --git a/projects/demo-playwright/tests/deep/deep-select.spec.ts b/projects/demo-playwright/tests/deep/deep-select.spec.ts
@@ -57,7 +57,7 @@ test.describe('Deep / Select', () => {
                 if (cleaner) {
                     await cleaner.click();
                 } else {
-                    await options[0].focus();
+                    await options[0]?.focus();
                     await page.keyboard.down('Enter');
                 }
 

diff --git a/projects/demo-playwright/tests/kit/slider/slider.spec.ts b/projects/demo-playwright/tests/kit/slider/slider.spec.ts
@@ -162,7 +162,7 @@ test.describe('Slider', () => {
             });
 
             test('=> 0', async () => {
-                await tickLabels[0].click();
+                await tickLabels[0]?.click();
 
                 await expect(async () => {
                     expect(await slider.value).toBe(0);
@@ -173,7 +173,7 @@ test.describe('Slider', () => {
             });
 
             test('=> 500', async () => {
-                await tickLabels[2].click();
+                await tickLabels[2]?.click();
 
                 await expect(async () => {
                     expect(await slider.value).toBe(500);
@@ -184,7 +184,7 @@ test.describe('Slider', () => {
             });
 
             test('=> 750', async () => {
-                await tickLabels[3].click();
+                await tickLabels[3]?.click();
 
                 await expect(async () => {
                     expect(await slider.value).toBe(750);
@@ -195,7 +195,7 @@ test.describe('Slider', () => {
             });
 
             test('=> 1000', async () => {
-                await tickLabels.at(-1)!.click();
+                await tickLabels.at(-1)?.click();
 
                 await expect(async () => {
                     expect(await slider.value).toBe(1000);

diff --git a/projects/demo-playwright/utils/page-objects/calendar-range.po.ts b/projects/demo-playwright/utils/page-objects/calendar-range.po.ts
@@ -14,14 +14,14 @@ export class TuiCalendarRangePO {
     public async selectItem(index: number): Promise<void> {
         const items = await this.getItems();
 
-        await items[index].click();
+        await items[index]?.click();
     }
 
     public async itemHasCheckmark(index: number): Promise<boolean> {
         const items = await this.getItems();
 
         const itemCheckmark = await items[index]
-            .locator('[automation-id="tui-calendar-range__checkmark"]')
+            ?.locator('[automation-id="tui-calendar-range__checkmark"]')
             .count();
 
         return !!itemCheckmark;

diff --git a/projects/demo-playwright/utils/page-objects/input-date-range.po.ts b/projects/demo-playwright/utils/page-objects/input-date-range.po.ts
@@ -26,14 +26,14 @@ export class TuiInputDateRangePO {
     public async selectItem(index: number): Promise<void> {
         const items = await this.getItems();
 
-        await items[index].click();
+        await items[index]?.click();
     }
 
     public async itemHasCheckmark(index: number): Promise<boolean> {
         const items = await this.getItems();
 
         const itemCheckmark = await items[index]
-            .locator('[automation-id="tui-calendar-range__checkmark"]')
+            ?.locator('[automation-id="tui-calendar-range__checkmark"]')
             .count();
 
         return !!itemCheckmark;

diff --git a/projects/demo-playwright/utils/page-objects/textfield-with-data-list.po.ts b/projects/demo-playwright/utils/page-objects/textfield-with-data-list.po.ts
@@ -17,7 +17,7 @@ export class TuiTextfieldWithDataListPO {
         const options = await this.getOptions();
 
         for (const optionIndex of indexes) {
-            await options[optionIndex].click();
+            await options[optionIndex]?.click();
         }
     }
 

diff --git a/projects/demo/src/modules/app/app.config.ts b/projects/demo/src/modules/app/app.config.ts
@@ -104,7 +104,7 @@ export const config: ApplicationConfig = {
                 }
 
                 return `${link}/${pkg.toLowerCase()}/${type.toLowerCase()}/${(
-                    header[0].toLowerCase() + header.slice(1)
+                    (header[0]?.toLowerCase() ?? '') + header.slice(1)
                 ).replaceAll(/[A-Z]/g, (m) => `-${m.toLowerCase()}`)}`;
             },
         },

diff --git a/projects/demo/src/modules/app/landing/index.html b/projects/demo/src/modules/app/landing/index.html
@@ -21,7 +21,7 @@
     </div>
     <div
         class="container"
-        (waIntersectionObservee)="intersected = $event[0].isIntersecting || intersected"
+        (waIntersectionObservee)="intersected = $event[0]?.isIntersecting || intersected"
     >
         <iframe
             *ngIf="intersected || current === 1"
@@ -160,7 +160,7 @@ <h2 class="opensource">It’s open source</h2>
     waIntersectionObserver
     waIntersectionThreshold="0.5"
     class="screen"
-    (waIntersectionObservee)="onIntersection($event, index)"
+    (waIntersectionObservee)="$event[0] && onIntersection($event[0], index)"
 ></div>
 
 <footer class="footer">

diff --git a/projects/demo/src/modules/app/landing/index.ts b/projects/demo/src/modules/app/landing/index.ts
@@ -64,7 +64,7 @@ export default class Page implements OnInit {
     }
 
     protected onIntersection(
-        [{isIntersecting, target}]: IntersectionObserverEntry[],
+        {isIntersecting, target}: IntersectionObserverEntry,
         index: number,
     ): void {
         if (isIntersecting) {

diff --git a/projects/demo/src/modules/app/stackblitz/stackblitz-resources-loader.ts b/projects/demo/src/modules/app/stackblitz/stackblitz-resources-loader.ts
@@ -20,10 +20,11 @@ export abstract class AbstractTuiStackblitzResourcesLoader {
                 ].map(tuiRawLoad),
             );
 
-        const [angularJson, tsconfig] = tuiTryParseMarkdownCodeBlock(configsContent);
-        const [mainTs] = tuiTryParseMarkdownCodeBlock(mainTsContent);
-        const [indexHtml] = tuiTryParseMarkdownCodeBlock(indexHtmlContent);
-        const [globalStyles] = tuiTryParseMarkdownCodeBlock(stylesContent);
+        const [angularJson = '', tsconfig = ''] =
+            tuiTryParseMarkdownCodeBlock(configsContent);
+        const [mainTs = ''] = tuiTryParseMarkdownCodeBlock(mainTsContent);
+        const [indexHtml = ''] = tuiTryParseMarkdownCodeBlock(indexHtmlContent);
+        const [globalStyles = ''] = tuiTryParseMarkdownCodeBlock(stylesContent);
 
         return {angularJson, tsconfig, mainTs, indexHtml, globalStyles};
     }

diff --git a/projects/demo/src/modules/app/stackblitz/starter/index.ts b/projects/demo/src/modules/app/stackblitz/starter/index.ts
@@ -40,8 +40,8 @@ export default class Page implements OnInit {
                 description:
                     'A starter with Taiga UI library\nDocumentation: https://taiga-ui.dev',
                 files: {
-                    [appPrefix`app.template.html`]: appTemplate,
-                    [appPrefix`app.component.ts`]: appComponent,
+                    [appPrefix`app.template.html`]: appTemplate ?? '',
+                    [appPrefix`app.component.ts`]: appComponent ?? '',
                     [appPrefix`app.style.less`]:
                         "@import '@taiga-ui/core/styles/taiga-ui-local.less';",
                 },