From 71aa6c36b5cfdf8c6eec242ae36aabcf047d69f9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Gabriel=20D=C3=ADaz?= <git@subsme.slmail.me>
Date: Thu, 5 Dec 2024 09:17:59 -0300
Subject: [PATCH] fix: Update review TP items (#3228)

* fix: Update review TP items

* refactor: Items validation

* fix: Items review trigger

* fix: get random page
---
 .../ItemEditorPage/LeftPanel/Items/Items.tsx  | 40 ++++++++++++++-----
 .../LeftPanel/Items/Items.types.ts            |  2 +-
 .../ItemEditorPage/LeftPanel/LeftPanel.tsx    |  8 ++--
 3 files changed, 35 insertions(+), 15 deletions(-)

diff --git a/src/components/ItemEditorPage/LeftPanel/Items/Items.tsx b/src/components/ItemEditorPage/LeftPanel/Items/Items.tsx
index eb29d898e..f48670b76 100644
--- a/src/components/ItemEditorPage/LeftPanel/Items/Items.tsx
+++ b/src/components/ItemEditorPage/LeftPanel/Items/Items.tsx
@@ -1,4 +1,5 @@
 import * as React from 'react'
+import equal from 'fast-deep-equal'
 import { T, t } from 'decentraland-dapps/dist/modules/translation/utils'
 import { getAnalytics } from 'decentraland-dapps/dist/modules/analytics/utils'
 import {
@@ -42,6 +43,23 @@ export default class Items extends React.PureComponent<Props, State> {
 
   analytics = getAnalytics()
 
+  componentDidMount() {
+    this.handleReviewItemsTrigger()
+  }
+
+  componentDidUpdate(prevProps: Props) {
+    this.handleReviewItemsTrigger(prevProps)
+  }
+
+  handleReviewItemsTrigger = (prevProps?: Props) => {
+    const { items, onReviewItems } = this.props
+    const { currentTab } = this.state
+
+    if (this.getIsReviewingTPItems() && currentTab === ItemPanelTabs.TO_REVIEW && !equal(items, prevProps?.items)) {
+      onReviewItems()
+    }
+  }
+
   isVisible = (item: Item) => {
     const { visibleItems } = this.props
     return visibleItems.some(_item => _item.id === item.id)
@@ -81,30 +99,32 @@ export default class Items extends React.PureComponent<Props, State> {
   }
 
   handleTabChange = (targetTab: ItemPanelTabs) => {
-    const { onLoadPage, onResetReviewedItems } = this.props
-    const { currentPages, currentTab } = this.state
+    const { onLoadPage, onReviewItems, onResetReviewedItems } = this.props
+    const { currentPages } = this.state
 
     if (targetTab === ItemPanelTabs.ALL_ITEMS) {
-      this.setState({ showAllItemsTabChangeModal: false }, () => onLoadPage(currentPages[ItemPanelTabs.ALL_ITEMS]))
-    } else if (targetTab === ItemPanelTabs.TO_REVIEW && currentTab === ItemPanelTabs.ALL_ITEMS) {
-      onResetReviewedItems()
-      onLoadPage(1)
+      this.setState({ showAllItemsTabChangeModal: false }, () => {
+        onResetReviewedItems()
+        onLoadPage(currentPages[ItemPanelTabs.ALL_ITEMS])
+      })
+    } else if (targetTab === ItemPanelTabs.TO_REVIEW) {
+      onReviewItems()
     }
     this.setState({ currentTab: targetTab })
   }
 
   handleGetRandomSampleClick = () => {
-    const { showSamplesModalAgain, onReviewItems } = this.props
+    const { showSamplesModalAgain, onLoadRandomPage } = this.props
     if (!showSamplesModalAgain) {
-      onReviewItems()
+      onLoadRandomPage()
     } else {
       this.setState({ showGetMoreSamplesModal: true })
     }
   }
 
   handleModalProceed = () => {
-    const { onReviewItems } = this.props
-    onReviewItems()
+    const { onLoadRandomPage } = this.props
+    onLoadRandomPage()
     this.setState({ showGetMoreSamplesModal: false })
   }
 
diff --git a/src/components/ItemEditorPage/LeftPanel/Items/Items.types.ts b/src/components/ItemEditorPage/LeftPanel/Items/Items.types.ts
index d45c6071e..ff48aad26 100644
--- a/src/components/ItemEditorPage/LeftPanel/Items/Items.types.ts
+++ b/src/components/ItemEditorPage/LeftPanel/Items/Items.types.ts
@@ -37,5 +37,5 @@ export type Props = {
   onSetItems: typeof setItems
   onReviewItems: () => void
   onLoadPage: (page: number) => void
-  onSetReviewedItems: (itemIds: Item[]) => void
+  onLoadRandomPage: () => void
 }
diff --git a/src/components/ItemEditorPage/LeftPanel/LeftPanel.tsx b/src/components/ItemEditorPage/LeftPanel/LeftPanel.tsx
index c83a778a1..10676ba02 100644
--- a/src/components/ItemEditorPage/LeftPanel/LeftPanel.tsx
+++ b/src/components/ItemEditorPage/LeftPanel/LeftPanel.tsx
@@ -155,7 +155,7 @@ export default class LeftPanel extends React.PureComponent<Props, State> {
     const totalPages = Math.ceil(totalResources! / LEFT_PANEL_PAGE_SIZE)
     if (pages.length !== totalPages) {
       let randomPage: number | undefined
-      while (randomPage !== undefined) {
+      while (randomPage === undefined) {
         randomPage = this.getRandomPage(1, totalPages)
         if (pages.includes(randomPage)) {
           randomPage = undefined
@@ -163,7 +163,7 @@ export default class LeftPanel extends React.PureComponent<Props, State> {
       }
       onSetReviewedItems(currentItems)
       if (randomPage !== undefined) {
-        this.setState(prevState => ({ pages: [...prevState.pages, randomPage] }), this.fetchResource)
+        this.setState(prevState => ({ pages: [...prevState.pages, randomPage as number] }), this.fetchResource)
       }
     } else {
       onSetReviewedItems(currentItems)
@@ -273,9 +273,9 @@ export default class LeftPanel extends React.PureComponent<Props, State> {
                         isLoading={isLoadingCollectionItems || isLoadingOrphanItems}
                         onToggleShowSamplesModalAgain={this.handleToggleShowSamplesModalAgain}
                         showSamplesModalAgain={showSamplesModalAgain}
-                        onReviewItems={() => this.loadRandomPage(items)}
+                        onReviewItems={() => onSetReviewedItems(items)}
+                        onLoadRandomPage={() => this.loadRandomPage(items)}
                         onLoadPage={this.loadPage}
-                        onSetReviewedItems={onSetReviewedItems}
                       />
                       <ItemAddedToast collectionId={selectedCollectionId} />
                     </>