From 7a8b022e14e1529100bd2c9449db57f266cc0237 Mon Sep 17 00:00:00 2001 From: Chinthoorie <73375917+frost-cy@users.noreply.github.com> Date: Wed, 17 Jul 2024 12:19:09 -0700 Subject: [PATCH 1/2] Fix initializer of instance members that reference identifiers declared in the constructor When public class fields are enabled, such cases throw a TS error similar to this. ``` third_party/javascript/angular_components/src/cdk/platform/platform.ts:37:29 - error TS2729: Property '_platformId' is used before its initialization. 37 isBrowser: boolean = this._platformId ~~~~~~~~~~~ third_party/javascript/angular_components/src/cdk/platform/platform.ts:87:15 87 constructor(@Inject(PLATFORM_ID) private _platformId: Object) {} ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ '_platformId' is declared here. ``` This error is fixed by moving the initializer of such class members into the constructor. This is a no-op change See go/lsc-fix-properties-used-before-initialization --- .../views/main_view/card_groups_container.ts | 28 ++++++++++--------- 1 file changed, 15 insertions(+), 13 deletions(-) diff --git a/tensorboard/webapp/metrics/views/main_view/card_groups_container.ts b/tensorboard/webapp/metrics/views/main_view/card_groups_container.ts index 29dc1a39e82..bcc321d53d5 100644 --- a/tensorboard/webapp/metrics/views/main_view/card_groups_container.ts +++ b/tensorboard/webapp/metrics/views/main_view/card_groups_container.ts @@ -36,18 +36,20 @@ import {getSortedRenderableCardIdsWithMetadata} from './common_selectors'; export class CardGroupsContainer { @Input() cardObserver!: CardObserver; - constructor(private readonly store: Store) {} + constructor(private readonly store: Store) { + this.cardGroups$ = this.store + .select(getSortedRenderableCardIdsWithMetadata) + .pipe( + combineLatestWith(this.store.select(getMetricsFilteredPluginTypes)), + map(([cardList, filteredPlugins]) => { + if (!filteredPlugins.size) return cardList; + return cardList.filter((card) => { + return filteredPlugins.has(card.plugin); + }); + }), + map((cardList) => groupCardIdWithMetdata(cardList)) + ); + } - readonly cardGroups$: Observable = this.store - .select(getSortedRenderableCardIdsWithMetadata) - .pipe( - combineLatestWith(this.store.select(getMetricsFilteredPluginTypes)), - map(([cardList, filteredPlugins]) => { - if (!filteredPlugins.size) return cardList; - return cardList.filter((card) => { - return filteredPlugins.has(card.plugin); - }); - }), - map((cardList) => groupCardIdWithMetdata(cardList)) - ); + readonly cardGroups$: Observable; } From 85e4716fb030432c97e077403cb8c4e3ad17a47d Mon Sep 17 00:00:00 2001 From: Chinthoorie <73375917+frost-cy@users.noreply.github.com> Date: Wed, 17 Jul 2024 19:26:39 +0000 Subject: [PATCH 2/2] Fix initializer of instance members that reference identifiers declared in the constructor. --- .../empty_tag_match_message_container.ts | 27 ++++---- .../views/main_view/main_view_component.ts | 12 ++-- .../views/main_view/main_view_container.ts | 62 +++++++++---------- 3 files changed, 52 insertions(+), 49 deletions(-) diff --git a/tensorboard/webapp/metrics/views/main_view/empty_tag_match_message_container.ts b/tensorboard/webapp/metrics/views/main_view/empty_tag_match_message_container.ts index ce43fec3254..2f651c6a8d8 100644 --- a/tensorboard/webapp/metrics/views/main_view/empty_tag_match_message_container.ts +++ b/tensorboard/webapp/metrics/views/main_view/empty_tag_match_message_container.ts @@ -36,18 +36,19 @@ import {getSortedRenderableCardIdsWithMetadata} from './common_selectors'; changeDetection: ChangeDetectionStrategy.OnPush, }) export class EmptyTagMatchMessageContainer { - constructor(private readonly store: Store) {} + constructor(private readonly store: Store) { + this.pluginTypes$ = this.store.select(getMetricsFilteredPluginTypes); + this.tagFilterRegex$ = this.store.select(getMetricsTagFilter); + this.tagCounts$ = this.store + .select(getSortedRenderableCardIdsWithMetadata) + .pipe( + map((cardList) => { + return new Set(cardList.map(({tag}) => tag)).size; + }), + ); + } - readonly pluginTypes$: Observable> = this.store.select( - getMetricsFilteredPluginTypes - ); - readonly tagFilterRegex$: Observable = - this.store.select(getMetricsTagFilter); - readonly tagCounts$: Observable = this.store - .select(getSortedRenderableCardIdsWithMetadata) - .pipe( - map((cardList) => { - return new Set(cardList.map(({tag}) => tag)).size; - }) - ); + readonly pluginTypes$: Observable>; + readonly tagFilterRegex$: Observable; + readonly tagCounts$: Observable; } diff --git a/tensorboard/webapp/metrics/views/main_view/main_view_component.ts b/tensorboard/webapp/metrics/views/main_view/main_view_component.ts index cf9941a9e42..0ce38ba82f2 100644 --- a/tensorboard/webapp/metrics/views/main_view/main_view_component.ts +++ b/tensorboard/webapp/metrics/views/main_view/main_view_component.ts @@ -62,7 +62,12 @@ export class MainViewComponent { @Optional() @Inject(SHARE_BUTTON_COMPONENT) readonly customShareButton: Type - ) {} + ) { + this.cardObserver = new CardObserver( + this.host.nativeElement, + '600px 0px 600px 0px' + ); + } readonly PluginType = PluginType; @@ -70,8 +75,5 @@ export class MainViewComponent { * Load cards that are not yet visible, if they are roughly 1 card row away in * scroll distance. */ - readonly cardObserver = new CardObserver( - this.host.nativeElement, - '600px 0px 600px 0px' - ); + readonly cardObserver; } diff --git a/tensorboard/webapp/metrics/views/main_view/main_view_container.ts b/tensorboard/webapp/metrics/views/main_view/main_view_container.ts index 9eb0e12e993..578efdb3a65 100644 --- a/tensorboard/webapp/metrics/views/main_view/main_view_container.ts +++ b/tensorboard/webapp/metrics/views/main_view/main_view_container.ts @@ -51,42 +51,42 @@ import {PluginType} from '../../types'; changeDetection: ChangeDetectionStrategy.OnPush, }) export class MainViewContainer { - constructor(private readonly store: Store) {} - - readonly isSidepaneOpen$: Observable = this.store.select( - isMetricsSettingsPaneOpen - ); - - readonly initialTagsLoading$: Observable = this.store - .select(getMetricsTagMetadataLoadState) - .pipe( - // disconnect and don't listen to store if tags are loaded at least once. - takeWhile((loadState) => { - return loadState.lastLoadedTimeInMs === null; - }, true /** inclusive */), - map((loadState) => { - return ( - loadState.state === DataLoadState.LOADING && - loadState.lastLoadedTimeInMs === null - ); - }) - ); - - readonly showFilteredView$: Observable = this.store - .select(getMetricsTagFilter) - .pipe( + constructor(private readonly store: Store) { + this.isSidepaneOpen$ = this.store.select(isMetricsSettingsPaneOpen); + this.initialTagsLoading$ = this.store + .select(getMetricsTagMetadataLoadState) + .pipe( + // disconnect and don't listen to store if tags are loaded at least once. + takeWhile((loadState) => { + return loadState.lastLoadedTimeInMs === null; + }, true /** inclusive */), + map((loadState) => { + return ( + loadState.state === DataLoadState.LOADING && + loadState.lastLoadedTimeInMs === null + ); + }), + ); + this.showFilteredView$ = this.store.select(getMetricsTagFilter).pipe( map((filter) => { return filter.length > 0; - }) + }), + ); + this.filteredPluginTypes$ = this.store.select( + getMetricsFilteredPluginTypes, ); + this.isSlideoutMenuOpen$ = this.store.select(isMetricsSlideoutMenuOpen); + } + + readonly isSidepaneOpen$: Observable; + + readonly initialTagsLoading$: Observable; + + readonly showFilteredView$: Observable; - readonly filteredPluginTypes$ = this.store.select( - getMetricsFilteredPluginTypes - ); + readonly filteredPluginTypes$; - readonly isSlideoutMenuOpen$: Observable = this.store.select( - isMetricsSlideoutMenuOpen - ); + readonly isSlideoutMenuOpen$: Observable; onSettingsButtonClicked() { this.store.dispatch(metricsSettingsPaneToggled());