diff --git a/TaikoWebUI/Pages/Songs.razor b/TaikoWebUI/Pages/Songs.razor
index f406a7b..acf5a4b 100644
--- a/TaikoWebUI/Pages/Songs.razor
+++ b/TaikoWebUI/Pages/Songs.razor
@@ -13,11 +13,9 @@
 <MudGrid Class="my-8">
     @if (response is null)
     {
-        <MudItem xs="12">
-            <MudText Align="Align.Center">
-                @Localizer["No data."]
-            </MudText>
-        </MudItem>
+        <MudContainer Style="display:flex;margin:50px 0;align-items:center;justify-content:center;">
+            <MudProgressCircular Indeterminate="true" Size="Size.Large" Color="Color.Primary" />
+        </MudContainer>
     }
     else
     {
@@ -35,157 +33,19 @@
         else
         {
             <MudItem xs="12">
-                <MudTabs Elevation="0" Border="true" Rounded="true" ApplyEffectsToContainer="true" Outlined="true" Class="mb-10">
-                    @foreach (var difficulty in Enum.GetValues<Difficulty>())
-                    {
-                        @if (difficulty is not Difficulty.None)
-                        {
-                            <MudTabPanel Text="@ScoreUtils.GetDifficultyTitle(difficulty)"
-                                         Icon="@ScoreUtils.GetDifficultyIconSvg(difficulty)">
-                                @if (songBestDataMap.TryGetValue(difficulty, out var value))
-                                {
-                                    <MudDataGrid Items="@value"
-                                                 ColumnResizeMode="ResizeMode.None" RowsPerPage="25" Elevation="0">
-                                        <Columns>
-                                            <TemplateColumn T="SongBestData" Title=@Localizer["Song"] StickyLeft="true">
-                                                <CellTemplate>
-                                                    <MudStack Row="true" Justify="Justify.SpaceBetween" AlignItems="AlignItems.Center">
-                                                        <div style="width:300px">
-                                                            <a href="@($"/Users/{Baid}/Songs/{context.Item.SongId}")">
-																<MudText Typo="Typo.body2" Style="font-weight:bold">@context.Item.MusicName</MudText>
-                                                            </a>
-                                                            <MudText Typo="Typo.caption">@context.Item.MusicArtist</MudText>
-                                                        </div>
-                                                        <div>
-                                                            <MudToggleIconButton Toggled="@context.Item.IsFavorite"
-                                                                                 ToggledChanged="@(async () => await OnFavoriteToggled(context.Item))"
-                                                                                 Icon="@Icons.Material.Filled.FavoriteBorder" Color="@Color.Secondary"
-                                                                                 ToggledIcon="@Icons.Material.Filled.Favorite" ToggledColor="@Color.Secondary"
-                                                                                 Size="Size.Small"
-                                                                                 ToggledSize="Size.Small"
-                                                                                 Title="Add to favorites" ToggledTitle="Remove from favorites"/>
-                                                        </div>
-                                                    </MudStack>
-                                                </CellTemplate>
-                                            </TemplateColumn>
-                                            <TemplateColumn T="SongBestData" Title=@Localizer["Level"] Sortable="false">
-                                                <CellTemplate>
-                                                    <MudStack Row="true" Spacing="1" AlignItems="AlignItems.Center">
-                                                        <MudIcon Icon="@Icons.Material.Filled.Star" Size="Size.Small" />
-                                                        <MudText Typo="Typo.caption" Style="line-height:1;margin-top:2px;margin-right:2px;">@GameDataService.GetMusicStarLevel(@context.Item.SongId, difficulty)</MudText>
-                                                    </MudStack>
-                                                </CellTemplate>
-                                            </TemplateColumn>
-                                            <TemplateColumn T="SongBestData" Title=@Localizer["Genre"]
-                                                            Sortable="false" Filterable="true">
-                                                <CellTemplate>
-                                                        <MudChip Style="@ScoreUtils.GetGenreStyle(context.Item.Genre)"
-                                                             Size="Size.Small">
-                                                            @ScoreUtils.GetGenreTitle(context.Item.Genre)
-                                                    </MudChip>
-                                                </CellTemplate>
-                                            </TemplateColumn>
-                                            <PropertyColumn Property="data => data.BestScore" Title=@Localizer["Best Score"] />
-                                            <TemplateColumn T="SongBestData" Title=@Localizer["Best Crown"]>
-                                                <CellTemplate>
-                                                    <img src="@($"/images/crown_{context.Item.BestCrown}.png")" alt="@(ScoreUtils.GetCrownText(context.Item.BestCrown))" title="@(ScoreUtils.GetCrownText(context.Item.BestCrown))" style="@IconStyle" />
-                                                </CellTemplate>
-                                            </TemplateColumn>
-                                            <TemplateColumn T="SongBestData" Title=@Localizer["Best Rank"] Sortable="false">
-                                                <CellTemplate>
-                                                    @if (context.Item.BestScoreRank is not ScoreRank.None)
-                                                    {
-                                                        <img src="@($"/images/rank_{context.Item.BestScoreRank}.png")" alt="@(ScoreUtils.GetRankText(context.Item.BestScoreRank))" title="@(ScoreUtils.GetRankText(context.Item.BestScoreRank))" style="@IconStyle" />
-                                                    }
-                                                </CellTemplate>
-                                            </TemplateColumn>
-                                            <PropertyColumn Property="data => data.GoodCount" Title=@Localizer["Good"] Sortable="false" />
-                                            <PropertyColumn Property="data => data.OkCount" Title=@Localizer["OK"] Sortable="false" />
-                                            <PropertyColumn Property="data => data.MissCount" Title=@Localizer["Bad"] Sortable="false" />
-                                            <PropertyColumn Property="data => data.MissCount" Title=@Localizer["Bad"] Sortable="false" />
-                                            <PropertyColumn Property="data => data.DrumrollCount" Title=@Localizer["Drumroll"] Sortable="false"/>
-                                            <PropertyColumn Property="data => data.ComboCount" Title=@Localizer["MAX Combo"] Sortable="false" />
-                                            <TemplateColumn T="SongBestData" Title=@Localizer["AI Battle Data"]>
-                                                <CellTemplate>
-                                                    <MudButton Variant="Variant.Outlined" Size="Size.Small" 
-                                                               OnClick="@(() => ToggleShowAiData(context.Item))"
-                                                               Disabled="@(!ScoreUtils.IsAiDataPresent(context.Item))">
-                                                        @(context.Item.ShowAiData ? @Localizer["Hide"] : @Localizer["Show"])
-                                                    </MudButton>
-                                                </CellTemplate>
-                                            </TemplateColumn>
-                                            <PropertyColumn Property="data => data.LastPlayTime" Title=@Localizer["Last Played"] Hideable="true" />
-                                            <PropertyColumn Property="data => data.PlayCount" Title=@Localizer["Total Plays"] Hideable="true" />
-                                            <PropertyColumn Property="data => data.ClearCount" Title=@Localizer["Total Clears"] Hideable="true" />
-                                            <PropertyColumn Property="data => data.FullComboCount" Title=@Localizer["Total Full Combos"] Hideable="true" />
-                                            <PropertyColumn Property="data => data.PerfectCount" Title=@Localizer["Total Donderful Combos"] Hideable="true" />
-                                        </Columns>
-                                        <ChildRowContent>
-                                            @if (context.Item.ShowAiData)
-                                            {
-                                                <tr>
-                                                    <td colspan="1" class="pa-3 ai-battle-td">
-                                                        <MudText Typo="Typo.body2" Style="font-weight: bold">
-                                                            @Localizer["AI Battle Data"]
-                                                        </MudText>
-                                                    </td>
-                                                    <td colspan="16">
-                                                        <MudTable Elevation="0" ReadOnly="true"
-                                                                  Items="@context.Item.AiSectionBestData" Context="aiSectionContext">
-                                                            <HeaderContent>
-                                                                <MudTh>@Localizer["Section No."]</MudTh>
-                                                                <MudTh>@Localizer["Result"]</MudTh>
-                                                                <MudTh>@Localizer["Score"]</MudTh>
-                                                                <MudTh>@Localizer["Crown"]</MudTh>
-                                                                <MudTh>@Localizer["Good"]</MudTh>
-                                                                <MudTh>@Localizer["OK"]</MudTh>
-                                                                <MudTh>@Localizer["Bad"]</MudTh>
-                                                                <MudTh>@Localizer["Drumroll"]</MudTh>
-                                                            </HeaderContent>
-                                                            <RowTemplate>
-                                                                <MudTd>@(aiSectionContext.SectionIndex + 1)</MudTd>
-                                                                <MudTd>
-                                                                    @if (@aiSectionContext.IsWin) {
-                                                                        <img src="@($"/images/ai_Win.png")" alt="Win" title="Win" style="@IconStyle" />
-                                                                    }
-                                                                    else
-                                                                    {
-                                                                        <img src="@($"/images/ai_Lose.png")" alt="Lose" title="Lose" style="@IconStyle" />
-                                                                    }
-                                                                </MudTd>
-                                                                <MudTd>@aiSectionContext.Score</MudTd>
-                                                                <MudTd>
-                                                                    <img src="@($"/images/ai_crown_{aiSectionContext.Crown}.png")" alt="@(ScoreUtils.GetCrownText(aiSectionContext.Crown))" title="@(ScoreUtils.GetCrownText(aiSectionContext.Crown))" style="@IconStyle" />
-                                                                </MudTd>
-                                                                <MudTd>@aiSectionContext.GoodCount</MudTd>
-                                                                <MudTd>@aiSectionContext.OkCount</MudTd>
-                                                                <MudTd>@aiSectionContext.MissCount</MudTd>
-                                                                <MudTd>@aiSectionContext.DrumrollCount</MudTd>
-                                                            </RowTemplate>
-                                                        </MudTable>
-                                                    </td>
-                                                </tr>
-                                            }
-                                        </ChildRowContent>
-                                        <PagerContent>
-                                            <MudDataGridPager T="SongBestData"/>
-                                        </PagerContent>
-                                    </MudDataGrid>
-                                }
-                                else
-                                {
-                                    <MudGrid>
-                                        <MudItem xs="12">
-                                            <MudText Align="Align.Center" Class="my-16">
-                                                No data for selected difficulty.
-                                            </MudText>
-                                        </MudItem>
-                                    </MudGrid>
-                                }
-                            </MudTabPanel>
-                        }
-                    }
-                </MudTabs>
+                <MudTable Items="musicMap" Elevation="0" Outlined="true">
+                    <HeaderContent>
+                        <MudTh>Title</MudTh>
+                    </HeaderContent>
+                    <RowTemplate>
+                        <MudTh>
+                            <a href="@($"/Users/{Baid}/Songs/{context.SongId}")">
+                                <MudText Typo="Typo.body2" Style="font-weight:bold">@context.SongNameEN</MudText>
+                                <MudText Typo="Typo.caption">@context.ArtistNameEN</MudText>
+							</a>
+                        </MudTh>
+                    </RowTemplate>
+                </MudTable>
             </MudItem>
         }
     }
diff --git a/TaikoWebUI/Pages/Songs.razor.cs b/TaikoWebUI/Pages/Songs.razor.cs
index 0e8140d..f32a359 100644
--- a/TaikoWebUI/Pages/Songs.razor.cs
+++ b/TaikoWebUI/Pages/Songs.razor.cs
@@ -1,4 +1,5 @@
 using Microsoft.JSInterop;
+using TaikoWebUI.Shared.Models;
 
 namespace TaikoWebUI.Pages;
 
@@ -16,6 +17,8 @@ public partial class Songs
 
     private readonly List<BreadcrumbItem> breadcrumbs = new();
 
+    private List<MusicDetail> musicMap = new();
+
     protected override async Task OnInitializedAsync()
     {
         await base.OnInitializedAsync();
@@ -26,6 +29,8 @@ public partial class Songs
 
         var language = await JSRuntime.InvokeAsync<string>("blazorCulture.get");
 
+        musicMap = GameDataService.GetMusicMap();
+
         response.SongBestData.ForEach(data =>
         {
             var songId = data.SongId;
diff --git a/TaikoWebUI/Services/GameDataService.cs b/TaikoWebUI/Services/GameDataService.cs
index 751ad03..d8318dc 100644
--- a/TaikoWebUI/Services/GameDataService.cs
+++ b/TaikoWebUI/Services/GameDataService.cs
@@ -60,6 +60,11 @@ public class GameDataService : IGameDataService
         return data;
     }
 
+    public List<MusicDetail> GetMusicMap()
+    {
+        return musicMap.Values.Where(musicDetail => musicDetail.SongId != 0).ToList();
+    }
+
     public string GetMusicNameBySongId(uint songId, string? language = "ja")
     {
         return musicMap.TryGetValue(songId, out var musicDetail) ? language switch
diff --git a/TaikoWebUI/Services/IGameDataService.cs b/TaikoWebUI/Services/IGameDataService.cs
index 365afee..8d71beb 100644
--- a/TaikoWebUI/Services/IGameDataService.cs
+++ b/TaikoWebUI/Services/IGameDataService.cs
@@ -7,6 +7,8 @@ public interface IGameDataService
 {
     public Task InitializeAsync(string dataBaseUrl);
 
+    public List<MusicDetail> GetMusicMap();
+
     public string GetMusicNameBySongId(uint songId, string? language = null);
 
     public string GetMusicArtistBySongId(uint songId, string? language = null);