Skip to content

feat(startup): add dialog layout and content components#598

Merged
kyasbal merged 4 commits into
GoogleCloudPlatform:mainfrom
kyasbal:feat/startup-layout
Apr 16, 2026
Merged

feat(startup): add dialog layout and content components#598
kyasbal merged 4 commits into
GoogleCloudPlatform:mainfrom
kyasbal:feat/startup-layout

Conversation

@kyasbal

@kyasbal kyasbal commented Apr 7, 2026

Copy link
Copy Markdown
Member

Motivation

To assemble the UI components created in previous PRs (Side Menu #596 and Inspection List #597) into a complete dialog layout. This PR depends on the components introduced in PR #596 and PR #597.

Changes

  • Added StartupDialogLayoutComponent and StartupDialogContentComponent.
  • Combined the side menu and inspection list into the dialog content.
  • Added corresponding stories and unit tests.

動機

前のPRで作成したUIコンポーネント(サイドメニュー #596 とインスペクションリスト #597)を、完全なダイアログレイアウトに組み立てます。このPRは、PR #596 と PR #597 で導入されたコンポーネントに依存しています。

変更内容

  • StartupDialogLayoutComponentStartupDialogContentComponent を追加しました。
  • サイドメニューとインスペクションリストをダイアログのコンテンツに統合しました。
  • 対応するストーリーとユニットテストを追加しました。
image

@gemini-code-assist gemini-code-assist Bot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Code Review

This pull request replaces the angular-split layout with GoldenLayout and introduces a new startup dialog with several sub-components for managing inspection activities. Feedback includes fixing a potential memory leak in LayoutService by preventing multiple initializations, removing manual license headers to comply with the repository style guide, and using standard Material icon names. Additionally, it is recommended to use flexible grid units instead of hardcoded heights in the startup dialog styles.

I am having trouble creating individual review comments. Click here to see my feedback.

web/src/app/services/layout/layout.service.ts (78-91)

high

The init method does not check if the GoldenLayout instance or ResizeObserver have already been initialized. If init is called multiple times (e.g., during component re-initialization), it will create new instances without cleaning up the old ones, leading to memory leaks and multiple observers on the same element.

  public init(hostElement: HTMLElement, vcr: ViewContainerRef) {
    if (this.goldenLayout) {
      this.ngOnDestroy();
    }
    this.viewContainerRef = vcr;
    this.goldenLayout = new GoldenLayout(hostElement);

    this.registerComponents();

    this.resizeObserver = new ResizeObserver(() => {
      this.goldenLayout.setSize(
        hostElement.clientWidth,
        hostElement.clientHeight,
      );
    });
    this.resizeObserver.observe(hostElement);
  }

web/src/app/dialogs/startup/components/inspection-list-item.component.ts (1-15)

medium

The repository style guide explicitly states that license headers are automatically added by a commit hook and should not be added manually. Please remove the license header from this and all other new files in this pull request.

References
  1. License headers are automatically added by commit hook. Do not add license header. (link)

web/src/app/services/layout/layout.service.ts (115)

medium

The icon name cards_stack does not appear to be a standard Material Symbol. This may result in the icon not being displayed correctly. Please verify the icon name or use a standard one like layers.

        this.addIconToTab(container, 'layers');

web/src/app/services/layout/layout.service.ts (126)

medium

The icon name deployed_code_history does not appear to be a standard Material Symbol. This may result in the icon not being displayed correctly. Please verify the icon name or use a standard one like history.

        this.addIconToTab(container, 'history');

web/src/app/dialogs/startup/components/startup-dialog-layout.component.scss (24)

medium

Hardcoding the row height to 600px in the grid template makes the layout inflexible and may conflict with the height: 100% set on the container. Using 1fr would allow the content area to dynamically fill the available space within the dialog.

    "sidebar content" 1fr

@kyasbal
kyasbal force-pushed the feat/startup-layout branch 5 times, most recently from ac55ae6 to 0c788c0 Compare April 13, 2026 05:20
kyasbal added 2 commits April 16, 2026 10:20
ダイアログ全体のレイアウトとコンテンツエリアの完成形。
@kyasbal
kyasbal force-pushed the feat/startup-layout branch from 0c788c0 to 5f59bcd Compare April 16, 2026 01:21
@kyasbal
kyasbal marked this pull request as ready for review April 16, 2026 01:27
@kyasbal
kyasbal requested review from jyane and renamoo as code owners April 16, 2026 01:27
@kyasbal
kyasbal force-pushed the feat/startup-layout branch from 5f59bcd to 9c9563a Compare April 16, 2026 01:30
@kyasbal
kyasbal enabled auto-merge April 16, 2026 11:02
@kyasbal
kyasbal added this pull request to the merge queue Apr 16, 2026
Merged via the queue into GoogleCloudPlatform:main with commit 38fd886 Apr 16, 2026
9 of 10 checks passed
@kyasbal
kyasbal deleted the feat/startup-layout branch April 16, 2026 14:04
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants