Sample modified

Author: rajendranr-5483

WASM with Global and None/WASM with Global and None.Client/Pages/Home.razor

@@ -1,7 +1,28 @@
 @page "/"
 
+@using Syncfusion.Blazor
+@using Syncfusion.Blazor.Grids
+
 <PageTitle>Home</PageTitle>
 
-<h1>Hello, world!</h1>
+<SfGrid DataSource="@Orders" AllowPaging="true" AllowSorting="true" AllowFiltering="true" AllowGrouping="true" />
+
+@code {
+    public List<Order> Orders { get; set; }
+
+    protected override void OnInitialized()
+    {
+        Orders = Enumerable.Range(1, 50).Select(x => new Order()
+            {
+                OrderID = 0 + x,
+                CustomerID = (new string[] { "ALFKI", "ANANTR", "ANTON", "BLONP", "BOLID" })[new Random().Next(5)],
+            }).ToList();
+    }
+
+    public class Order
+    {
+        public int? OrderID { get; set; }
+        public string CustomerID { get; set; }
 
-Welcome to your new app.
+    }
+}

WASM with Global and None/WASM with Global and None/Components/App.razor

@@ -9,6 +9,8 @@
     <link rel="stylesheet" href="app.css" />
     <link rel="stylesheet" href="WASM with Global and None.styles.css" />
     <link rel="icon" type="image/png" href="favicon.png" />
+    <link rel="stylesheet" href="_content/Syncfusion.Blazor.Themes/bootstrap5.css" />
+    <script type="text/javascript" src="_content/Syncfusion.Blazor.Core/scripts/syncfusion-blazor.min.js"></script>
     <HeadOutlet @rendermode="@InteractiveWebAssembly" />
 </head>
 

WASM with Global and None/WASM with Global and None/Components/_Imports.razor

@@ -9,3 +9,5 @@
 @using WASM_with_Global_and_None
 @using WASM_with_Global_and_None.Client
 @using WASM_with_Global_and_None.Components
+@using Syncfusion.Blazor
+@using Syncfusion.Blazor.Grids

WASM with Global and None/WASM with Global and None/Program.cs

@@ -1,11 +1,13 @@
 using WASM_with_Global_and_None.Client.Pages;
 using WASM_with_Global_and_None.Components;
+using Syncfusion.Blazor;
 
 var builder = WebApplication.CreateBuilder(args);
 
 // Add services to the container.
 builder.Services.AddRazorComponents()
     .AddInteractiveWebAssemblyComponents();
+builder.Services.AddSyncfusionBlazor();
 
 var app = builder.Build();
 

WASM with Global and None/WASM with Global and None/WASM with Global and None.csproj

@@ -11,6 +11,8 @@
   <ItemGroup>
     <ProjectReference Include="..\WASM with Global and None.Client\WASM with Global and None.Client.csproj" />
     <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="8.0.0" />
+    <PackageReference Include="Syncfusion.Blazor.Grid" Version="23.1.44" />
+    <PackageReference Include="Syncfusion.Blazor.Themes" Version="23.1.44" />
   </ItemGroup>
 
 </Project>