Fix #4089: Orderlist require dataKey (#5732)

primefaces · Jan 11, 2024 · c00c029 · c00c029
1 parent 6f05fd4
commit c00c029
Show file tree

Hide file tree

Showing 6 changed files with 18 additions and 14 deletions.
diff --git a/components/doc/orderlist/basicdoc.js b/components/doc/orderlist/basicdoc.js
@@ -29,7 +29,7 @@ export function BasicDoc(props) {
 
     const code = {
         basic: `
-<OrderList value={products} onChange={(e) => setProducts(e.value)} itemTemplate={itemTemplate} header="Products"></OrderList>
+<OrderList dataKey="id" value={products} onChange={(e) => setProducts(e.value)} itemTemplate={itemTemplate} header="Products"></OrderList>
         `,
         javascript: `
 import React, { useState, useEffect } from 'react';
@@ -61,7 +61,7 @@ export default function BasicDemo() {
     
     return (
         <div className="card xl:flex xl:justify-content-center">
-            <OrderList value={products} onChange={(e) => setProducts(e.value)} itemTemplate={itemTemplate} header="Products"></OrderList>
+            <OrderList dataKey="id" value={products} onChange={(e) => setProducts(e.value)} itemTemplate={itemTemplate} header="Products"></OrderList>
         </div>
     )
 }
@@ -109,7 +109,7 @@ export default function BasicDemo() {
     
     return (
         <div className="card xl:flex xl:justify-content-center">
-            <OrderList value={products} onChange={(e) => setProducts(e.value)} itemTemplate={itemTemplate} header="Products"></OrderList>
+            <OrderList dataKey="id" value={products} onChange={(e) => setProducts(e.value)} itemTemplate={itemTemplate} header="Products"></OrderList>
         </div>
     )
 }
@@ -140,7 +140,7 @@ export default function BasicDemo() {
                 </p>
             </DocSectionText>
             <div className="card xl:flex xl:justify-content-center">
-                <OrderList value={products} onChange={(e) => setProducts(e.value)} itemTemplate={itemTemplate} header="Products"></OrderList>
+                <OrderList dataKey="id" value={products} onChange={(e) => setProducts(e.value)} itemTemplate={itemTemplate} header="Products"></OrderList>
             </div>
             <DocSectionCode code={code} service={['ProductService']} />
         </>

diff --git a/components/doc/orderlist/dragdropdoc.js b/components/doc/orderlist/dragdropdoc.js
@@ -29,7 +29,7 @@ export function DragDropDoc(props) {
 
     const code = {
         basic: `
-<OrderList value={products} onChange={(e) => setProducts(e.value)} itemTemplate={itemTemplate} 
+<OrderList dataKey="id" value={products} onChange={(e) => setProducts(e.value)} itemTemplate={itemTemplate} 
     header="Products" dragdrop></OrderList>
         `,
         javascript: `
@@ -62,7 +62,7 @@ export default function BasicDemo() {
     
     return (
         <div className="card xl:flex xl:justify-content-center">
-            <OrderList value={products} onChange={(e) => setProducts(e.value)} itemTemplate={itemTemplate} header="Products" dragdrop></OrderList>
+            <OrderList dataKey="id" value={products} onChange={(e) => setProducts(e.value)} itemTemplate={itemTemplate} header="Products" dragdrop></OrderList>
         </div>
     )
 }
@@ -110,7 +110,7 @@ export default function BasicDemo() {
     
     return (
         <div className="card xl:flex xl:justify-content-center">
-            <OrderList value={products} onChange={(e) => setProducts(e.value)} itemTemplate={itemTemplate} header="Products" dragdrop></OrderList>
+            <OrderList dataKey="id" value={products} onChange={(e) => setProducts(e.value)} itemTemplate={itemTemplate} header="Products" dragdrop></OrderList>
         </div>
     )
 }
@@ -141,7 +141,7 @@ export default function BasicDemo() {
                 </p>
             </DocSectionText>
             <div className="card xl:flex xl:justify-content-center">
-                <OrderList value={products} onChange={(e) => setProducts(e.value)} itemTemplate={itemTemplate} header="Products" dragdrop></OrderList>
+                <OrderList dataKey="id" value={products} onChange={(e) => setProducts(e.value)} itemTemplate={itemTemplate} header="Products" dragdrop></OrderList>
             </div>
             <DocSectionCode code={code} service={['ProductService']} />
         </>

diff --git a/components/doc/orderlist/filterdoc.js b/components/doc/orderlist/filterdoc.js
@@ -29,7 +29,7 @@ export function FilterDoc(props) {
 
     const code = {
         basic: `
-<OrderList value={products} onChange={(e) => setProducts(e.value)} itemTemplate={itemTemplate} header="Products" filter filterBy="name"></OrderList>
+<OrderList dataKey="id" value={products} onChange={(e) => setProducts(e.value)} itemTemplate={itemTemplate} header="Products" filter filterBy="name"></OrderList>
         `,
         javascript: `
 import React, { useState, useEffect } from 'react';
@@ -61,7 +61,7 @@ export default function FilterDemo() {
     
     return (
         <div className="card xl:flex xl:justify-content-center">
-            <OrderList value={products} onChange={(e) => setProducts(e.value)} itemTemplate={itemTemplate} header="Products" filter filterBy="name"></OrderList>
+            <OrderList dataKey="id" value={products} onChange={(e) => setProducts(e.value)} itemTemplate={itemTemplate} header="Products" filter filterBy="name"></OrderList>
         </div>
     )
 }
@@ -109,7 +109,7 @@ export default function FilterDemo() {
     
     return (
         <div className="card xl:flex xl:justify-content-center">
-            <OrderList value={products} onChange={(e) => setProducts(e.value)} itemTemplate={itemTemplate} header="Products" filter filterBy="name"></OrderList>
+            <OrderList dataKey="id" value={products} onChange={(e) => setProducts(e.value)} itemTemplate={itemTemplate} header="Products" filter filterBy="name"></OrderList>
         </div>
     )
 }
@@ -141,7 +141,7 @@ export default function FilterDemo() {
                 </p>
             </DocSectionText>
             <div className="card xl:flex xl:justify-content-center">
-                <OrderList value={products} onChange={(e) => setProducts(e.value)} itemTemplate={itemTemplate} header="Products" filter filterBy="name"></OrderList>
+                <OrderList dataKey="id" value={products} onChange={(e) => setProducts(e.value)} itemTemplate={itemTemplate} header="Products" filter filterBy="name"></OrderList>
             </div>
             <DocSectionCode code={code} service={['ProductService']} />
         </>

diff --git a/components/doc/orderlist/pt/ptdoc.js b/components/doc/orderlist/pt/ptdoc.js
@@ -30,6 +30,7 @@ export function PTDoc(props) {
     const code = {
         basic: `
 <OrderList
+    dataKey="id" 
     value={products}
     onChange={(e) => setProducts(e.value)}
     itemTemplate={itemTemplate}
@@ -74,6 +75,7 @@ export default function PTDemo() {
     return (
         <div className="card xl:flex xl:justify-content-center">
             <OrderList
+                dataKey="id" 
                 value={products}
                 onChange={(e) => setProducts(e.value)}
                 itemTemplate={itemTemplate}
@@ -134,6 +136,7 @@ export default function PTDemo() {
     return (
         <div className="card xl:flex xl:justify-content-center">
             <OrderList
+                dataKey="id" 
                 value={products}
                 onChange={(e) => setProducts(e.value)}
                 itemTemplate={itemTemplate}
@@ -173,6 +176,7 @@ export default function PTDemo() {
             <DocSectionText {...props}></DocSectionText>
             <div className="card xl:flex xl:justify-content-center">
                 <OrderList
+                    dataKey="id"
                     value={products}
                     onChange={(e) => setProducts(e.value)}
                     itemTemplate={itemTemplate}

diff --git a/components/doc/orderlist/theming/tailwinddoc.js b/components/doc/orderlist/theming/tailwinddoc.js
@@ -128,7 +128,7 @@ export default function UnstyledDemo() {
     
     return (
         <div className="card xl:flex xl:justify-center">
-            <OrderList value={products} onChange={(e) => setProducts(e.value)} itemTemplate={itemTemplate} header="Products"></OrderList>
+            <OrderList dataKey="id" value={products} onChange={(e) => setProducts(e.value)} itemTemplate={itemTemplate} header="Products"></OrderList>
         </div>
     )
 }

diff --git a/components/lib/orderlist/orderlist.d.ts b/components/lib/orderlist/orderlist.d.ts
@@ -201,7 +201,7 @@ export interface OrderListProps extends Omit<React.DetailedHTMLProps<React.HTMLA
     /**
      * Name of the field that uniquely identifies the a record in the data.
      */
-    dataKey?: string | undefined;
+    dataKey: string;
     /**
      * The breakpoint to define the maximum width boundary when responsiveness is enabled.
      * @defaultValue '960px'.