feat(startup): add dialog layout and content components

[kyasbal]

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 で導入されたコンポーネントに依存しています。

変更内容

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

[gemini-code-assist]

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)

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)

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)

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)

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)

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