From 93d132fa229f0dba963cd5f21b89d5274e346910 Mon Sep 17 00:00:00 2001
From: lipata <nikolay.alipiev@gmail.com>
Date: Wed, 10 Sep 2025 10:41:52 +0300
Subject: [PATCH 1/3] fix: update react templates

---
 .../basic/files/src/views/__path__/index.js   | 16 ++--------
 .../cli/templates/react/igr-es6/grid/index.ts |  2 +-
 .../cli/templates/react/igr-es6/groups.json   |  4 +--
 .../default/files/src/views/__path__/index.js |  2 +-
 .../files/src/app/__path__/__filePrefix__.tsx | 31 +------------------
 .../cli/templates/react/igr-ts/grid/index.ts  |  2 +-
 .../cli/templates/react/igr-ts/groups.json    |  2 +-
 .../files/src/app/__path__/__filePrefix__.tsx |  2 +-
 8 files changed, 10 insertions(+), 51 deletions(-)

diff --git a/packages/cli/templates/react/igr-es6/grid/basic/files/src/views/__path__/index.js b/packages/cli/templates/react/igr-es6/grid/basic/files/src/views/__path__/index.js
index 0d9b7559f..965428cad 100644
--- a/packages/cli/templates/react/igr-es6/grid/basic/files/src/views/__path__/index.js
+++ b/packages/cli/templates/react/igr-es6/grid/basic/files/src/views/__path__/index.js
@@ -22,23 +22,11 @@ export default class $(ClassName) extends Component {
 				<h1 className={style.title}>{this.title}</h1>
 				<div>
 					Read more on the&nbsp;
-                    <a href="https://www.infragistics.com/products/ignite-ui-react/react/components/grid.html">
+                    <a href="https://www.infragistics.com/products/ignite-ui-react/react/components/grids/data-grid.html">
 						official documentation page
                     </a>
 				</div>
 				<div className={style.container}>
-				<div className={style.grid}>
-					<IgrDataGrid
-						height="100%"
-						autoGenerateColumns="false"
-						dataSource={this.data}>
-						<IgrNumericColumn field="ProductID" headerText="Product ID" />
-						<IgrTextColumn field="ProductName" headerText="Product Name" />
-						<IgrTextColumn field="QuantityPerUnit" headerText="Quantity Per Unit" />
-						<IgrNumericColumn field="UnitsInStock" headerText="Units In Stock" />
-						<IgrDateTimeColumn field="OrderDate" headerText="Order Date" />
-					</IgrDataGrid>
-				</div>
 				<div className={style.grid}>
 					<IgrDataGrid
 						height="100%"
@@ -50,4 +38,4 @@ export default class $(ClassName) extends Component {
 			</div>
 		)
 	}
-}
\ No newline at end of file
+}
diff --git a/packages/cli/templates/react/igr-es6/grid/index.ts b/packages/cli/templates/react/igr-es6/grid/index.ts
index 0b0f0cb6f..c0005ef4a 100644
--- a/packages/cli/templates/react/igr-es6/grid/index.ts
+++ b/packages/cli/templates/react/igr-es6/grid/index.ts
@@ -7,7 +7,7 @@ class IgrDataGridComponent extends BaseComponent {
 	constructor() {
 		super(__dirname);
 		this.name = "Data Grid";
-		this.group = "Grids & Lists";
+		this.group = "Grids";
 		this.description = "pick from grids: basic, sorting, templating.";
 	}
 }
diff --git a/packages/cli/templates/react/igr-es6/groups.json b/packages/cli/templates/react/igr-es6/groups.json
index 4d9ba21df..f55a8a30b 100644
--- a/packages/cli/templates/react/igr-es6/groups.json
+++ b/packages/cli/templates/react/igr-es6/groups.json
@@ -1,5 +1,5 @@
 {
 	"Gauges": "scale measure Controls including Linear and Radial Gauge and Bullet Graph.",
 	"Charts": "high-performance data visualization for category and financial data.",
-	"Grids & Lists": "bind and display data sets with little coding or configuration."
-}
\ No newline at end of file
+	"Grids": "bind and display data sets with little coding or configuration."
+}
diff --git a/packages/cli/templates/react/igr-es6/pie-chart/default/files/src/views/__path__/index.js b/packages/cli/templates/react/igr-es6/pie-chart/default/files/src/views/__path__/index.js
index 5174ae999..38bc72df1 100644
--- a/packages/cli/templates/react/igr-es6/pie-chart/default/files/src/views/__path__/index.js
+++ b/packages/cli/templates/react/igr-es6/pie-chart/default/files/src/views/__path__/index.js
@@ -58,7 +58,7 @@ export default class $(ClassName) extends Component {
                 <h1 className={style.title}>{this.title}</h1>
                 <div>
                     Read more on the&nbsp;
-                    <a href="https://www.infragistics.com/products/ignite-ui-react/react/components/piechart.html">
+                    <a href="https://www.infragistics.com/products/ignite-ui-react/react/components/pie-chart.html">
                         official documentation page
                     </a>
                 </div>
diff --git a/packages/cli/templates/react/igr-ts/grid/basic/files/src/app/__path__/__filePrefix__.tsx b/packages/cli/templates/react/igr-ts/grid/basic/files/src/app/__path__/__filePrefix__.tsx
index 59fce80ab..58d273f35 100644
--- a/packages/cli/templates/react/igr-ts/grid/basic/files/src/app/__path__/__filePrefix__.tsx
+++ b/packages/cli/templates/react/igr-ts/grid/basic/files/src/app/__path__/__filePrefix__.tsx
@@ -15,40 +15,11 @@ export default function $(ClassName)() {
       <h1 className={style.title}>{title}</h1>
       <div>
         Read more on the&nbsp;
-        <a href="https://www.infragistics.com/products/ignite-ui-react/react/components/grid.html">
+        <a href="https://www.infragistics.com/products/ignite-ui-react/react/components/grids/data-grid.html">
           official documentation page
         </a>
       </div>
       <div className={style.container}>
-        <div className={style.grid}>
-          <IgrGrid autoGenerate={false} data={data}>
-            <IgrColumn
-              field="ProductID"
-              header="Product ID"
-              dataType="number">
-            </IgrColumn>
-            <IgrColumn
-              field="ProductName"
-              header="Product Name"
-              dataType="string">
-            </IgrColumn>
-            <IgrColumn
-              field="QuantityPerUnit"
-              header="Quantity Per Unit"
-              dataType="string">
-            </IgrColumn>
-            <IgrColumn
-              field="UnitsInStock"
-              header="Units In Stock"
-              dataType="number">
-            </IgrColumn>
-            <IgrColumn
-              field="OrderDate"
-              header="Order Date"
-              dataType="date">
-            </IgrColumn>
-          </IgrGrid>
-        </div>
         <div className={style.grid}>
           <IgrGrid autoGenerate={true} data={data} />
         </div>
diff --git a/packages/cli/templates/react/igr-ts/grid/index.ts b/packages/cli/templates/react/igr-ts/grid/index.ts
index ae88539fe..b617d80f7 100644
--- a/packages/cli/templates/react/igr-ts/grid/index.ts
+++ b/packages/cli/templates/react/igr-ts/grid/index.ts
@@ -7,7 +7,7 @@ class IgrTsDataGridComponent extends BaseComponent {
 	constructor() {
 		super(__dirname);
 		this.name = "Data Grid";
-		this.group = "Grids & Lists";
+		this.group = "Grids";
 		this.description = "pick from grids: basic, sorting, templating.";
 	}
 }
diff --git a/packages/cli/templates/react/igr-ts/groups.json b/packages/cli/templates/react/igr-ts/groups.json
index 579789370..f55a8a30b 100644
--- a/packages/cli/templates/react/igr-ts/groups.json
+++ b/packages/cli/templates/react/igr-ts/groups.json
@@ -1,5 +1,5 @@
 {
 	"Gauges": "scale measure Controls including Linear and Radial Gauge and Bullet Graph.",
 	"Charts": "high-performance data visualization for category and financial data.",
-	"Grids & Lists": "bind and display data sets with little coding or configuration."
+	"Grids": "bind and display data sets with little coding or configuration."
 }
diff --git a/packages/cli/templates/react/igr-ts/pie-chart/default/files/src/app/__path__/__filePrefix__.tsx b/packages/cli/templates/react/igr-ts/pie-chart/default/files/src/app/__path__/__filePrefix__.tsx
index 898a90045..f6442bbcf 100644
--- a/packages/cli/templates/react/igr-ts/pie-chart/default/files/src/app/__path__/__filePrefix__.tsx
+++ b/packages/cli/templates/react/igr-ts/pie-chart/default/files/src/app/__path__/__filePrefix__.tsx
@@ -31,7 +31,7 @@ export default function $(ClassName)() {
       <h1 className={style.title}>{title}</h1>
       <div>
         Read more on the&nbsp;
-        <a href="https://www.infragistics.com/products/ignite-ui-react/react/components/piechart.html">
+        <a href="https://www.infragistics.com/products/ignite-ui-react/react/components/pie-chart.html">
           official documentation page
         </a>
       </div>

From b482ea465914bbf95c5b8a4d52c3e10ae9629d2e Mon Sep 17 00:00:00 2001
From: lipata <nikolay.alipiev@gmail.com>
Date: Wed, 10 Sep 2025 10:46:27 +0300
Subject: [PATCH 2/3] chore: update react and grid packages

---
 packages/cli/templates/react/igr-ts/grid/basic/index.ts | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/cli/templates/react/igr-ts/grid/basic/index.ts b/packages/cli/templates/react/igr-ts/grid/basic/index.ts
index 21b845829..24f873e9f 100644
--- a/packages/cli/templates/react/igr-ts/grid/basic/index.ts
+++ b/packages/cli/templates/react/igr-ts/grid/basic/index.ts
@@ -14,8 +14,8 @@ class GridTemplate extends IgniteUIForReactTemplate {
 		this.projectType = "igr-ts";
 		this.components = ["Grid"];
 		this.controlGroup = "Data Grids";
-		this.packages = ["igniteui-react-grids@~19.0.2", "igniteui-react-inputs@~19.0.0",
-			"igniteui-react-layouts@~19.0.0", "igniteui-react@~19.0.3"];
+		this.packages = ["igniteui-react-grids@~19.2.1", "igniteui-react-inputs@~19.0.1",
+			"igniteui-react-layouts@~19.0.1", "igniteui-react@~19.2.1"];
 
 		this.hasExtraConfiguration = false;
 	}

From faeb25a64effeba39e24dafe6e93e5a26a07c5bc Mon Sep 17 00:00:00 2001
From: lipata <nikolay.alipiev@gmail.com>
Date: Thu, 11 Sep 2025 14:30:38 +0300
Subject: [PATCH 3/3] fix: use only grid with defined columns

---
 .../basic/files/src/views/__path__/index.js   | 11 ++++++--
 .../files/src/app/__path__/__filePrefix__.tsx | 28 ++++++++++++++++++-
 2 files changed, 35 insertions(+), 4 deletions(-)

diff --git a/packages/cli/templates/react/igr-es6/grid/basic/files/src/views/__path__/index.js b/packages/cli/templates/react/igr-es6/grid/basic/files/src/views/__path__/index.js
index 965428cad..96d0c993a 100644
--- a/packages/cli/templates/react/igr-es6/grid/basic/files/src/views/__path__/index.js
+++ b/packages/cli/templates/react/igr-es6/grid/basic/files/src/views/__path__/index.js
@@ -30,9 +30,14 @@ export default class $(ClassName) extends Component {
 				<div className={style.grid}>
 					<IgrDataGrid
 						height="100%"
-						width="100%"
-						autoGenerateColumns="true"
-						dataSource={this.data} />
+						autoGenerateColumns="false"
+						dataSource={this.data}>
+						<IgrNumericColumn field="ProductID" headerText="Product ID" />
+						<IgrTextColumn field="ProductName" headerText="Product Name" />
+						<IgrTextColumn field="QuantityPerUnit" headerText="Quantity Per Unit" />
+						<IgrNumericColumn field="UnitsInStock" headerText="Units In Stock" />
+						<IgrDateTimeColumn field="OrderDate" headerText="Order Date" />
+					</IgrDataGrid>
 				</div>
 				</div>
 			</div>
diff --git a/packages/cli/templates/react/igr-ts/grid/basic/files/src/app/__path__/__filePrefix__.tsx b/packages/cli/templates/react/igr-ts/grid/basic/files/src/app/__path__/__filePrefix__.tsx
index 58d273f35..ac53526e6 100644
--- a/packages/cli/templates/react/igr-ts/grid/basic/files/src/app/__path__/__filePrefix__.tsx
+++ b/packages/cli/templates/react/igr-ts/grid/basic/files/src/app/__path__/__filePrefix__.tsx
@@ -21,7 +21,33 @@ export default function $(ClassName)() {
       </div>
       <div className={style.container}>
         <div className={style.grid}>
-          <IgrGrid autoGenerate={true} data={data} />
+          <IgrGrid autoGenerate={false} data={data}>
+            <IgrColumn
+              field="ProductID"
+              header="Product ID"
+              dataType="number">
+            </IgrColumn>
+            <IgrColumn
+              field="ProductName"
+              header="Product Name"
+              dataType="string">
+            </IgrColumn>
+            <IgrColumn
+              field="QuantityPerUnit"
+              header="Quantity Per Unit"
+              dataType="string">
+            </IgrColumn>
+            <IgrColumn
+              field="UnitsInStock"
+              header="Units In Stock"
+              dataType="number">
+            </IgrColumn>
+            <IgrColumn
+              field="OrderDate"
+              header="Order Date"
+              dataType="date">
+            </IgrColumn>
+          </IgrGrid>
         </div>
       </div>
     </div>