From fb3723f72cac712cc258d2758630ae613d26e9fb Mon Sep 17 00:00:00 2001
From: Nadezhda Tacheva <73842592+ntacheva@users.noreply.github.com>
Date: Thu, 21 Nov 2024 11:10:31 +0200
Subject: [PATCH 1/2] chore(grid): clarify the required DotNetObjectReference
 type

---
 knowledge-base/grid-autofit-columns.md | 49 ++++++++++++++------------
 1 file changed, 26 insertions(+), 23 deletions(-)

diff --git a/knowledge-base/grid-autofit-columns.md b/knowledge-base/grid-autofit-columns.md
index 607fe8ee6e..b3160ed61a 100644
--- a/knowledge-base/grid-autofit-columns.md
+++ b/knowledge-base/grid-autofit-columns.md
@@ -53,7 +53,7 @@ The **JavaScript** tab in the following example implements a JS function and set
 ````C#
 @implements IDisposable
 @inject IJSRuntime js
- 
+
 <TelerikGrid @ref="@Grid"
              Data="@GridData"
              Resizable="true"
@@ -69,53 +69,56 @@ The **JavaScript** tab in the following example implements a JS function and set
         <GridColumn Field=@nameof(SampleData.LastName) Title="Last Name" Id="NameColumn2" />
     </GridColumns>
 </TelerikGrid>
- 
+
 @code {
     [JSInvokable]
     public async Task AutoFitAllColumns()
     {
         await Grid.AutoFitAllColumnsAsync();
- 
+
         //from this point to the end of the method the logic is dedicated to
         //stretching the last grid column to the available horizontal space
         //this code also works even if there is no available horizontal space
- 
+
         bool hasWhiteSpace = await js.InvokeAsync<bool>("hasWhiteSpace");
- 
+
         if (hasWhiteSpace)
         {
             var state = Grid.GetState();
- 
+
             state.ColumnStates.LastOrDefault().Width = "";
             state.TableWidth = null;
- 
+
             await Grid.SetStateAsync(state);
         }
     }
- 
+
     protected override async Task OnAfterRenderAsync(bool firstRender)
     {
         if (firstRender)
         {
             IndexDotNetInstance = DotNetObjectReference.Create(this);
- 
+
             await js.InvokeVoidAsync("observeTarget", IndexDotNetInstance, GridClass);
         }
- 
+
         await base.OnAfterRenderAsync(firstRender);
     }
- 
+
     private const string GridClass = "autofitter-columns";
- 
-    public TelerikGrid<SampleData> Grid { get; set; }
+
+    private TelerikGrid<SampleData> Grid { get; set; }
+
+    //Replace the Index type with the type of the component that hosts this code
     public DotNetObjectReference<Index> IndexDotNetInstance { get; set; }
-    public List<SampleData> GridData { get; set; }
- 
+
+    private List<SampleData> GridData { get; set; }
+
     protected override void OnInitialized()
     {
         GridData = GetData();
     }
- 
+
     public void Dispose()
     {
         if (IndexDotNetInstance != null)
@@ -124,17 +127,17 @@ The **JavaScript** tab in the following example implements a JS function and set
             IndexDotNetInstance = null;
         }
     }
- 
+
     private List<SampleData> GetData()
     {
         return Enumerable.Range(1, 50).Select(x => new SampleData
-        {
-            Id = x,
-            Name = $"name {x}",
-            LastName = $"Surname {x}"
-        }).ToList();
+            {
+                Id = x,
+                Name = $"name {x}",
+                LastName = $"Surname {x}"
+            }).ToList();
     }
- 
+
     public class SampleData
     {
         public int Id { get; set; }

From 652c4210a7dff2ea25b15b461c4b3d50d5e0e28e Mon Sep 17 00:00:00 2001
From: Nadezhda Tacheva <Nadezhda.Tacheva@progress.com>
Date: Thu, 21 Nov 2024 14:08:51 +0200
Subject: [PATCH 2/2] chore(common): add note

---
 knowledge-base/grid-autofit-columns.md | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/knowledge-base/grid-autofit-columns.md b/knowledge-base/grid-autofit-columns.md
index b3160ed61a..dd46a1913b 100644
--- a/knowledge-base/grid-autofit-columns.md
+++ b/knowledge-base/grid-autofit-columns.md
@@ -49,6 +49,8 @@ To autofit the Grid columns on the initial load of the component:
 
 The **JavaScript** tab in the following example implements a JS function and sets up the `MutationObserver` tool to listen for DOM changes.
 
+> Replace the `Index` type of the `DotNetObjectReference` with the type of the component that hosts this code.
+
 <div class="skip-repl"></div>
 ````C#
 @implements IDisposable