Refactor project structure and improve performance

Changed the `ProjectRepository` class to be static for easier usage.
Changed `ProjectService` constants to public properties for accessibility.
Changed `App.xaml` to consolidate theme resources into `Override.xaml`.
Changed `App.xaml.cs` to implement an `AppStateMachine` for better state management.
Changed `ConsolePage` and `HierarchyPage` to utilize the new ViewModel structure.
Changed `ProjectPage` to use the `ExplorerItem` model for asset display.
Changed `Entity` and `EntityManager` to enhance component management with a new `IComponentData` interface.
Changed the `Logger` class to introduce structured logging functionality.
Changed the system architecture to support dependency management for better organization.
Changed the `QueryEnumerable` class to allow for more flexible entity queries.
Changed the `TypeHandle` class to improve efficiency in retrieving type handles.
Changed the `World` class to support robust world management and multiple worlds.
Updated the `Test` class to demonstrate the new entity and component management system.

Ghost.Editor/View/Pages/EngineEditor/ConsolePage.xaml

@@ -21,19 +21,19 @@
             BorderThickness="0,0,0,1">
             <CommandBar Background="{ThemeResource CardBackgroundFillColorSecondaryBrush}" DefaultLabelPosition="Collapsed">
                 <CommandBar.PrimaryCommands>
-                    <AppBarButton Content="Clear" />
+                    <AppBarButton Command="{x:Bind ViewModel.ClearLogsCommand}" Content="Clear" />
                     <AppBarSeparator />
-                    <AppBarToggleButton Width="45">
+                    <AppBarToggleButton Width="45" IsChecked="{x:Bind ViewModel.ShowInfo, Mode=TwoWay}">
                         <AppBarToggleButton.Icon>
                             <FontIcon Glyph="&#xF167;" />
                         </AppBarToggleButton.Icon>
                     </AppBarToggleButton>
-                    <AppBarToggleButton Width="45">
+                    <AppBarToggleButton Width="45" IsChecked="{x:Bind ViewModel.ShowWarning, Mode=TwoWay}">
                         <AppBarToggleButton.Icon>
                             <FontIcon Glyph="&#xE814;" />
                         </AppBarToggleButton.Icon>
                     </AppBarToggleButton>
-                    <AppBarToggleButton Width="45">
+                    <AppBarToggleButton Width="45" IsChecked="{x:Bind ViewModel.ShowError, Mode=TwoWay}">
                         <AppBarToggleButton.Icon>
                             <FontIcon Glyph="&#xEB90;" />
                         </AppBarToggleButton.Icon>
@@ -42,7 +42,10 @@
 
                 <CommandBar.SecondaryCommands>
                     <AppBarToggleButton BorderThickness="0" Label="Clear On Play" />
-                    <AppBarToggleButton BorderThickness="0" Label="Show Stack Trace" />
+                    <AppBarToggleButton
+                        BorderThickness="0"
+                        IsChecked="{x:Bind ViewModel.ShowStackTrace, Mode=TwoWay}"
+                        Label="Show Stack Trace" />
                 </CommandBar.SecondaryCommands>
             </CommandBar>
         </Grid>
@@ -54,7 +57,11 @@
                 <RowDefinition Height="100" />
             </Grid.RowDefinitions>
 
-            <ListView Grid.Row="0" />
+            <ListView
+                x:Name="LogListView"
+                Grid.Row="0"
+                ItemsSource="{x:Bind ViewModel.Logs, Mode=OneWay}"
+                SelectedItem="{x:Bind ViewModel.SelectedLog, Mode=TwoWay}" />
             <Grid
                 Grid.Row="1"
                 Padding="4"
@@ -64,7 +71,7 @@
                     <TextBlock
                         IsTextSelectionEnabled="True"
                         Style="{StaticResource CaptionTextBlockStyle}"
-                        Text="Test Log"
+                        Text="{x:Bind ViewModel.SelectedLog.ToStringWithStackTrace(), Mode=OneWay}"
                         TextWrapping="Wrap" />
                 </ScrollViewer>
             </Grid>

Ghost.Editor/View/Pages/EngineEditor/ConsolePage.xaml.cs

@@ -1,11 +1,19 @@
+using Ghost.Editor.ViewModels.Pages.EngineEditor;
 using Microsoft.UI.Xaml.Controls;
 
 namespace Ghost.Editor.View.Pages.EngineEditor;
 
-public sealed partial class ConsolePage : Page
+internal sealed partial class ConsolePage : Page
 {
+    public ConsoleViewModel ViewModel
+    {
+        get;
+    }
+
     public ConsolePage()
     {
+        ViewModel = App.GetService<ConsoleViewModel>();
+
         InitializeComponent();
     }
 }

Ghost.Editor/View/Pages/EngineEditor/HierarchyPage.xaml

@@ -0,0 +1,43 @@
+<?xml version="1.0" encoding="utf-8" ?>
+<Page
+    x:Class="Ghost.Editor.View.Pages.EngineEditor.HierarchyPage"
+    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
+    xmlns:local="using:Ghost.Editor.View.Pages.EngineEditor"
+    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+    xmlns:sg="using:Ghost.Editor.Infrastructures.SceneGraph"
+    mc:Ignorable="d">
+
+    <Page.Resources>
+        <DataTemplate x:Key="SceneTemplate" x:DataType="sg:SceneGraphNode">
+            <TreeViewItem
+                AutomationProperties.Name="{x:Bind Name}"
+                Background="{ThemeResource CardBackgroundFillColorSecondaryBrush}"
+                IsExpanded="True"
+                ItemsSource="{x:Bind Children}">
+                <StackPanel Orientation="Horizontal">
+                    <FontIcon FontSize="14" Glyph="&#xF159;" />
+                    <TextBlock Margin="10,0" Text="{x:Bind Name}" />
+                </StackPanel>
+            </TreeViewItem>
+        </DataTemplate>
+
+        <DataTemplate x:Key="EntityTemplate" x:DataType="sg:SceneGraphNode">
+            <TreeViewItem AutomationProperties.Name="{x:Bind Name}" ItemsSource="{x:Bind Children}">
+                <StackPanel Orientation="Horizontal">
+                    <FontIcon FontSize="14" Glyph="&#xF158;" />
+                    <TextBlock Margin="10,0" Text="{x:Bind Name}" />
+                </StackPanel>
+            </TreeViewItem>
+        </DataTemplate>
+    </Page.Resources>
+
+    <Grid Background="{ThemeResource LayerFillColorDefaultBrush}">
+        <TreeView ItemsSource="{x:Bind ViewModel.SceneList}">
+            <TreeView.ItemTemplateSelector>
+                <local:HierarchyTemplateSector EntityTemplate="{StaticResource EntityTemplate}" SceneTemplate="{StaticResource SceneTemplate}" />
+            </TreeView.ItemTemplateSelector>
+        </TreeView>
+    </Grid>
+</Page>

Ghost.Editor/View/Pages/EngineEditor/HierarchyPage.xaml.cs

@@ -0,0 +1,57 @@
+using Ghost.Editor.Infrastructures.SceneGraph;
+using Ghost.Editor.ViewModels.Pages.EngineEditor;
+using Microsoft.UI.Xaml;
+using Microsoft.UI.Xaml.Controls;
+
+// To learn more about WinUI, the WinUI project structure,
+// and more about our project templates, see: http://aka.ms/winui-project-info.
+
+namespace Ghost.Editor.View.Pages.EngineEditor;
+/// <summary>
+/// An empty page that can be used on its own or navigated to within a Frame.
+/// </summary>
+internal sealed partial class HierarchyPage : Page
+{
+    public HierarchyViewModel ViewModel
+    {
+        get;
+    }
+
+    public HierarchyPage()
+    {
+        ViewModel = App.GetService<HierarchyViewModel>();
+
+        InitializeComponent();
+    }
+}
+
+internal partial class HierarchyTemplateSector : DataTemplateSelector
+{
+    public DataTemplate? SceneTemplate
+    {
+        get;
+        set;
+    }
+
+    public DataTemplate? EntityTemplate
+    {
+        get;
+        set;
+    }
+
+    protected override DataTemplate SelectTemplateCore(object item)
+    {
+        if (SceneTemplate == null || EntityTemplate == null)
+        {
+            return base.SelectTemplateCore(item);
+        }
+
+        var node = (SceneGraphNode)item;
+        return node.Type switch
+        {
+            SceneGraphNode.NodeType.Scene => SceneTemplate,
+            SceneGraphNode.NodeType.Entity => EntityTemplate,
+            _ => base.SelectTemplateCore(item)
+        };
+    }
+}

Ghost.Editor/View/Pages/EngineEditor/ProjectPage.xaml

@@ -3,11 +3,17 @@
     x:Class="Ghost.Editor.View.Pages.EngineEditor.ProjectPage"
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:converter="using:Ghost.Editor.Helpers.Converters"
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
     xmlns:local="using:Ghost.Editor.View.Pages.EngineEditor"
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+    xmlns:model="using:Ghost.Editor.Models"
     mc:Ignorable="d">
 
+    <Page.Resources>
+        <converter:AssetPathToGlyphConverter x:Key="AssetPathToGlyphConverter" />
+    </Page.Resources>
+
     <Grid Background="{ThemeResource LayerFillColorDefaultBrush}">
         <Grid.ColumnDefinitions>
             <ColumnDefinition Width="250" />
@@ -17,55 +23,116 @@
         <!--  Folder Tree View  -->
         <Grid
             Grid.Column="0"
+            Padding="4"
+            Background="{ThemeResource CardBackgroundFillColorSecondaryBrush}"
             BorderBrush="{ThemeResource CardStrokeColorDefaultSolid}"
             BorderThickness="0,0,1,0">
             <TreeView
                 HorizontalAlignment="Stretch"
                 VerticalAlignment="Stretch"
-                Background="{ThemeResource CardBackgroundFillColorSecondaryBrush}"
-                ScrollViewer.HorizontalScrollBarVisibility="Disabled"
-                ScrollViewer.VerticalScrollBarVisibility="Auto">
-                <TreeView.ItemContainerStyle>
-                    <Style TargetType="TreeViewItem">
-                        <Setter Property="Padding" Value="4,2" />
-                        <Setter Property="Margin" Value="0,0,0,2" />
-                    </Style>
-                </TreeView.ItemContainerStyle>
+                ItemsSource="{x:Bind ViewModel.SubDirectories}"
+                ScrollViewer.HorizontalScrollBarVisibility="Hidden"
+                ScrollViewer.VerticalScrollBarVisibility="Auto"
+                SelectedItem="{x:Bind ViewModel.SelectedDirectory, Mode=TwoWay}">
+                <TreeView.ItemTemplate>
+                    <DataTemplate x:DataType="model:ExplorerItem">
+                        <TreeViewItem ItemsSource="{x:Bind Children}">
+                            <StackPanel Orientation="Horizontal">
+                                <FontIcon
+                                    VerticalAlignment="Center"
+                                    FontSize="14"
+                                    Glyph="&#xE8B7;" />
+                                <TextBlock
+                                    Margin="8,0,0,0"
+                                    VerticalAlignment="Center"
+                                    Style="{StaticResource CaptionTextBlockStyle}"
+                                    Text="{x:Bind Name}"
+                                    TextTrimming="CharacterEllipsis" />
+                            </StackPanel>
+                        </TreeViewItem>
+                    </DataTemplate>
+                </TreeView.ItemTemplate>
             </TreeView>
         </Grid>
 
         <!--  Files  -->
-        <ScrollViewer
-            Grid.Column="1"
-            HorizontalScrollBarVisibility="Auto"
-            VerticalScrollBarVisibility="Auto">
-            <GridView HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
-                <GridView.ItemContainerStyle>
-                    <Style BasedOn="{StaticResource DefaultGridViewItemStyle}" TargetType="GridViewItem">
-                        <Setter Property="Margin" Value="5,5,5,5" />
-                    </Style>
-                </GridView.ItemContainerStyle>
+        <Grid Grid.Column="1">
+            <Grid.RowDefinitions>
+                <RowDefinition Height="Auto" />
+                <RowDefinition Height="*" />
+                <RowDefinition Height="Auto" />
+            </Grid.RowDefinitions>
 
-                <GridView.ItemTemplate>
-                    <DataTemplate>
-                        <Grid>
-                            <Grid.RowDefinitions>
-                                <RowDefinition Height="*" />
-                                <RowDefinition Height="0.2*" />
-                            </Grid.RowDefinitions>
-                            <ImageIcon
-                                Grid.Row="0"
-                                Width="24"
-                                Height="24" />
-                            <TextBlock
-                                Grid.Row="1"
-                                Margin="8,0"
-                                VerticalAlignment="Center"
-                                TextTrimming="CharacterEllipsis" />
-                        </Grid>
-                    </DataTemplate>
-                </GridView.ItemTemplate>
-            </GridView>
-        </ScrollViewer>
+            <Grid
+                Grid.Row="0"
+                Padding="4"
+                HorizontalAlignment="Stretch"
+                VerticalAlignment="Stretch"
+                Background="{ThemeResource CardBackgroundFillColorSecondaryBrush}"
+                BorderBrush="{ThemeResource CardStrokeColorDefaultSolid}"
+                BorderThickness="0,0,0,1">
+                <BreadcrumbBar Height="15" />
+            </Grid>
+
+            <ScrollViewer
+                Grid.Row="1"
+                Padding="8"
+                VerticalAlignment="Stretch"
+                HorizontalScrollBarVisibility="Auto"
+                VerticalScrollBarVisibility="Auto">
+                <GridView
+                    HorizontalAlignment="Stretch"
+                    VerticalAlignment="Stretch"
+                    ItemsSource="{x:Bind ViewModel.DirectoryAssets, Mode=OneWay}"
+                    SelectedItem="{x:Bind ViewModel.SelectedAsset, Mode=TwoWay}">
+                    <GridView.ItemContainerStyle>
+                        <Style BasedOn="{StaticResource DefaultGridViewItemStyle}" TargetType="GridViewItem">
+                            <Setter Property="Margin" Value="2" />
+                        </Style>
+                    </GridView.ItemContainerStyle>
+
+                    <GridView.ItemTemplate>
+                        <DataTemplate x:DataType="model:ExplorerItem">
+                            <Grid
+                                Width="100"
+                                Height="100"
+                                Padding="8"
+                                DoubleTapped="GridViewItem_DoubleTapped"
+                                IsDoubleTapEnabled="True">
+                                <Grid.RowDefinitions>
+                                    <RowDefinition Height="*" />
+                                    <RowDefinition Height="0.25*" />
+                                </Grid.RowDefinitions>
+                                <FontIcon FontSize="42" Glyph="{x:Bind Path, Converter={StaticResource AssetPathToGlyphConverter}}" />
+                                <TextBlock
+                                    Grid.Row="1"
+                                    Margin="8,0"
+                                    HorizontalAlignment="Center"
+                                    VerticalAlignment="Center"
+                                    Style="{StaticResource CaptionTextBlockStyle}"
+                                    Text="{x:Bind Name}"
+                                    TextTrimming="CharacterEllipsis" />
+                            </Grid>
+                        </DataTemplate>
+                    </GridView.ItemTemplate>
+                </GridView>
+            </ScrollViewer>
+
+            <Grid
+                Grid.Row="2"
+                Padding="4"
+                HorizontalAlignment="Stretch"
+                VerticalAlignment="Stretch"
+                Background="{ThemeResource CardBackgroundFillColorSecondaryBrush}"
+                BorderBrush="{ThemeResource CardStrokeColorDefaultSolid}"
+                BorderThickness="0,1,0,0">
+                <TextBlock
+                    VerticalAlignment="Center"
+                    HorizontalTextAlignment="Left"
+                    Style="{StaticResource CaptionTextBlockStyle}"
+                    Text="{x:Bind ViewModel.SelectedAsset.Path, Mode=OneWay}"
+                    TextTrimming="CharacterEllipsis" />
+            </Grid>
+        </Grid>
     </Grid>
 </Page>

Ghost.Editor/View/Pages/EngineEditor/ProjectPage.xaml.cs

@@ -1,30 +1,25 @@
-using System;
-using System.Collections.Generic;
-using System.IO;
-using System.Linq;
-using System.Runtime.InteropServices.WindowsRuntime;
-using Windows.Foundation;
-using Windows.Foundation.Collections;
-using Microsoft.UI.Xaml;
+using Ghost.Editor.ViewModels.Pages.EngineEditor;
 using Microsoft.UI.Xaml.Controls;
-using Microsoft.UI.Xaml.Controls.Primitives;
-using Microsoft.UI.Xaml.Data;
 using Microsoft.UI.Xaml.Input;
-using Microsoft.UI.Xaml.Media;
-using Microsoft.UI.Xaml.Navigation;
-
-// To learn more about WinUI, the WinUI project structure,
-// and more about our project templates, see: http://aka.ms/winui-project-info.
 
 namespace Ghost.Editor.View.Pages.EngineEditor;
 
-/// <summary>
-/// An empty page that can be used on its own or navigated to within a Frame.
-/// </summary>
-public sealed partial class ProjectPage : Page
+internal sealed partial class ProjectPage : Page
 {
+    public ProjectViewModel ViewModel
+    {
+        get;
+    }
+
     public ProjectPage()
     {
+        ViewModel = App.GetService<ProjectViewModel>();
+
         InitializeComponent();
     }
+
+    private void GridViewItem_DoubleTapped(object sender, DoubleTappedRoutedEventArgs e)
+    {
+        ViewModel.NavigateToSelected();
+    }
 }

Ghost.Editor/View/Pages/Landing/CreateProjectPage.xaml.cs

@@ -1,4 +1,4 @@
-using Ghost.Editor.ViewModel.Pages.Landing;
+using Ghost.Editor.ViewModels.Pages.Landing;
 using Microsoft.UI.Xaml.Controls;
 using Microsoft.UI.Xaml.Navigation;
 

Ghost.Editor/View/Pages/Landing/OpenProjectPage.xaml

@@ -6,6 +6,7 @@
     xmlns:converters="using:Ghost.Editor.Helpers.Converters"
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
     xmlns:data="using:Ghost.Data.Models"
+    xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
     xmlns:local="using:Ghost.Editor.View.Pages.Landing"
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
     NavigationCacheMode="Enabled"
@@ -73,7 +74,7 @@
                 CornerRadius="{StaticResource OverlayCornerRadius}"
                 IsItemClickEnabled="True"
                 ItemClick="ListView_ItemClick"
-                ItemsSource="{x:Bind projects}"
+                ItemsSource="{x:Bind ViewModel.projects}"
                 SelectionMode="None">
                 <ListView.ItemTemplate>
                     <DataTemplate x:DataType="data:ProjectMetadataInfo">

Ghost.Editor/View/Pages/Landing/OpenProjectPage.xaml.cs

@@ -1,68 +1,47 @@
 using Ghost.Data.Models;
-using Ghost.Data.Services;
-using Ghost.Editor.AppStates;
-using Ghost.Editor.Services;
+using Ghost.Editor.ViewModels.Pages.Landing;
 using Microsoft.UI.Xaml;
 using Microsoft.UI.Xaml.Controls;
 using Microsoft.UI.Xaml.Navigation;
-using System;
-using System.Collections.ObjectModel;
-using System.Linq;
 using Windows.ApplicationModel.DataTransfer;
-using Windows.Storage;
 
 namespace Ghost.Editor.View.Pages.Landing;
 
 internal sealed partial class OpenProjectPage : Page
 {
-    private readonly ProjectService _projectService;
-    private readonly StackedNotificationService _notificationService;
-    private readonly AppStateService _stateService;
-
-    public readonly ObservableCollection<ProjectMetadataInfo> projects = new();
+    public OpenProjectViewModel ViewModel
+    {
+        get;
+    }
 
     public OpenProjectPage()
     {
-        _notificationService = App.GetService<StackedNotificationService>();
-        _projectService = App.GetService<ProjectService>();
-        _stateService = App.GetService<AppStateService>();
+        ViewModel = App.GetService<OpenProjectViewModel>();
         InitializeComponent();
     }
 
-    private void UpdateEmptyPlaceHolderVisibility()
-    {
-        EmptyPlaceHolder.Visibility = projects.Count == 0 ? Visibility.Visible : Visibility.Collapsed;
-    }
-
-    protected override async void OnNavigatedTo(NavigationEventArgs e)
+    protected override void OnNavigatedTo(NavigationEventArgs e)
     {
         base.OnNavigatedTo(e);
+        ViewModel.OnNavigatedTo(e.Parameter);
+    }
 
-        projects.Clear();
-        await foreach (var projectInfo in _projectService.LoadAllProjectAsync())
-        {
-            var metadata = await ProjectService.LoadMetadataAsync(projectInfo.MetadataPath);
-            if (metadata == null)
-            {
-                continue;
-            }
-
-            projects.Add(new(projectInfo.MetadataPath, metadata));
-        }
-
-        UpdateEmptyPlaceHolderVisibility();
+    override protected void OnNavigatedFrom(NavigationEventArgs e)
+    {
+        base.OnNavigatedFrom(e);
+        ViewModel.OnNavigatedFrom();
     }
 
     private void ProjectContainer_DragEnter(object sender, DragEventArgs e)
     {
-        DragVisual.Visibility = Visibility.Visible;
-        EmptyPlaceHolder.Visibility = Visibility.Collapsed;
+        ViewModel.DragVisibility = Visibility.Visible;
+        ViewModel.EmptyVisibility = Visibility.Collapsed;
     }
 
     private void ProjectContainer_DragLeave(object sender, DragEventArgs e)
     {
-        DragVisual.Visibility = Visibility.Collapsed;
-        UpdateEmptyPlaceHolderVisibility();
+        ViewModel.DragVisibility = Visibility.Collapsed;
+        ViewModel.UpdateEmptyPlaceHolderVisibility();
     }
 
     private void ProjectContainer_DragOver(object sender, DragEventArgs e)
@@ -79,55 +58,14 @@ internal sealed partial class OpenProjectPage : Page
 
     private async void ProjectContainer_Drop(object sender, DragEventArgs e)
     {
-        var errorMessage = string.Empty;
-        if (e.DataView.Contains(StandardDataFormats.StorageItems))
-        {
-            var items = await e.DataView.GetStorageItemsAsync();
-            var rootFolder = items.OfType<StorageFolder>().FirstOrDefault();
-            if (rootFolder != null)
-            {
-                var result = await _projectService.AddProjectFromDirectoryAsync(rootFolder.Path);
-                if (result.success)
-                {
-                    projects.Add(result.data);
-                    DragVisual.Visibility = Visibility.Collapsed;
-                    goto CloseDropPanel;
-                }
-                else
-                {
-                    errorMessage = result.message;
-                }
-            }
-        }
-        else
-        {
-            errorMessage = "Unsupported data format. Please drop a folder containing a project.";
-        }
-
-        _notificationService.ShowNotification(errorMessage, InfoBarSeverity.Error);
-
-    CloseDropPanel:
-        DragVisual.Visibility = Visibility.Collapsed;
-        UpdateEmptyPlaceHolderVisibility();
+        await ViewModel.ContentDrop(e.DataView);
     }
 
     private async void ListView_ItemClick(object sender, ItemClickEventArgs e)
     {
-        if (e.ClickedItem is not ProjectMetadataInfo project)
+        if (e.ClickedItem is ProjectMetadataInfo project)
         {
-            return;
-        }
-
-        try
-        {
-            project.Metadata.LastOpened = DateTime.Now;
-            await ProjectService.CreateMetadataFileAsync(project.Path, project.Metadata);
-
-            await _stateService.TransitionToAsync(StateKey.EngineEditor, project.Metadata);
-        }
-        catch (Exception exp)
-        {
-            _notificationService.ShowNotification($"Failed to load project: {exp.Message}", InfoBarSeverity.Error);
+            await ViewModel.LoadProject(project);
         }
     }
 }

Ghost.Editor/View/Windows/EngineEditorWindow.xaml

@@ -43,7 +43,7 @@
                 Margin="8,0,0,0"
                 VerticalAlignment="Center"
                 Style="{StaticResource CaptionTextBlockStyle}"
-                Text="{x:Bind ViewModel.CurrentProject.Name, Mode=OneWay}" />
+                Text="{x:Bind ViewModel.CurrentProject.Metadata.Name, Mode=OneWay}" />
         </StackPanel>
 
         <!--  Toolbar  -->
@@ -83,13 +83,26 @@
                     <ColumnDefinition Width="Auto" />
                 </Grid.ColumnDefinitions>
 
-                <Grid
+                <TabView
                     Grid.Column="0"
                     Width="350"
-                    Background="Aquamarine" />
+                    HorizontalAlignment="Stretch"
+                    VerticalAlignment="Stretch"
+                    TabWidthMode="Compact">
+                    <TabView.TabItems>
+                        <TabViewItem Header="Hierarchy">
+                            <TabViewItem.IconSource>
+                                <FontIconSource Glyph="&#xE8A4;" />
+                            </TabViewItem.IconSource>
+                            <ee:HierarchyPage />
+                        </TabViewItem>
+                    </TabView.TabItems>
+                </TabView>
+
                 <Grid Grid.Column="1">
                     <Image Source="C:\Users\Misaki\OneDrive\Pictures\Screenshots\Screenshot 2024-07-20 021657.png" Stretch="UniformToFill" />
                 </Grid>
+
                 <Grid
                     Grid.Column="2"
                     Width="350"
@@ -103,7 +116,7 @@
                 <TabView.TabItems>
                     <TabViewItem Header="Project">
                         <TabViewItem.IconSource>
-                            <FontIconSource Glyph="&#xE8B7;" />
+                            <FontIconSource Glyph="&#xEC50;" />
                         </TabViewItem.IconSource>
                         <ee:ProjectPage />
                     </TabViewItem>

Ghost.Editor/View/Windows/EngineEditorWindow.xaml.cs

@@ -1,5 +1,5 @@
 using Ghost.Data.Resources;
-using Ghost.Editor.ViewModel.Windows;
+using Ghost.Editor.ViewModels.Windows;
 using Ghost.Engine.Resources;
 using WinUIEx;