Fix react-beautiful-dnd warning in development
Signed-off-by: Egor Savkin <es@m-labs.hk>
This commit is contained in:
parent
5eaeecbf5b
commit
c7527fbcf0
|
@ -406,6 +406,7 @@ class ProductItem extends React.PureComponent {
|
|||
static get propTypes() {
|
||||
return {
|
||||
id: PropTypes.string.isRequired,
|
||||
index: PropTypes.number.isRequired,
|
||||
name: PropTypes.string.isRequired,
|
||||
name_codename: PropTypes.string,
|
||||
price: PropTypes.number.isRequired,
|
||||
|
@ -433,6 +434,7 @@ class ProductItem extends React.PureComponent {
|
|||
render() {
|
||||
const {
|
||||
id,
|
||||
index,
|
||||
name,
|
||||
name_codename,
|
||||
price,
|
||||
|
@ -482,7 +484,7 @@ class ProductItem extends React.PureComponent {
|
|||
<img src="/images/shop/icon-add.svg" alt="add" />
|
||||
</button>
|
||||
|
||||
<Draggable draggableId={id}>
|
||||
<Draggable draggableId={id} index={index}>
|
||||
{(provided, snapshot) => (
|
||||
<React.Fragment>
|
||||
<img
|
||||
|
@ -1510,7 +1512,8 @@ class Backlog extends React.PureComponent {
|
|||
const ordered_groups = data.categories.map(groupItem => ({ name: groupItem.name,
|
||||
items: groupItem.itemIds.map(itemId => items[itemId])
|
||||
}));
|
||||
const groups = ordered_groups.map((group, g_index) => {
|
||||
let item_index = -1;
|
||||
const groups = ordered_groups.map((group, g_index) => {
|
||||
return (
|
||||
<div className="accordion-item" key={`${group.name}`}>
|
||||
<h2 className="accordion-header">
|
||||
|
@ -1522,21 +1525,24 @@ class Backlog extends React.PureComponent {
|
|||
<div id={`collapse${g_index}`} className="accordion-collapse collapse" aria-labelledby="headingOne"
|
||||
data-bs-parent="#accordion_categories">
|
||||
<div className="accordion-body">
|
||||
{group.items.map(item => (
|
||||
<ProductItem
|
||||
key={item.id}
|
||||
id={item.id}
|
||||
name={`${item.name_number} ${item.name}`}
|
||||
name_codename={item.name_codename}
|
||||
price={item.price}
|
||||
currency={currency}
|
||||
image={`/images/${item.image}`}
|
||||
specs={item.specs}
|
||||
datasheet_file={item.datasheet_file}
|
||||
datasheet_name={item.datasheet_name}
|
||||
onClickAddItem={onClickAddItem}
|
||||
></ProductItem>
|
||||
))}
|
||||
{group.items.map(item => {
|
||||
item_index++;
|
||||
return (
|
||||
<ProductItem
|
||||
key={item.id}
|
||||
id={item.id}
|
||||
index={item_index}
|
||||
name={`${item.name_number} ${item.name}`}
|
||||
name_codename={item.name_codename}
|
||||
price={item.price}
|
||||
currency={currency}
|
||||
image={`/images/${item.image}`}
|
||||
specs={item.specs}
|
||||
datasheet_file={item.datasheet_file}
|
||||
datasheet_name={item.datasheet_name}
|
||||
onClickAddItem={onClickAddItem}
|
||||
></ProductItem>
|
||||
)})}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
Loading…
Reference in New Issue