Fix select all button when searching

DantSu · May 3, 2024 · 0aa21b8 · 0aa21b8
1 parent 13c7af6
commit 0aa21b8
Show file tree

Hide file tree

Showing 6 changed files with 21 additions and 36 deletions.
diff --git a/src/App/Components/Table/Table.js b/src/App/Components/Table/Table.js
@@ -22,7 +22,6 @@ function Table({
                  data,
                  selectedData,
                  onSelect,
-                 onSelectGroup,
                  onSelectAll,
                  onPlay,
                  onInfo,
@@ -78,6 +77,15 @@ function Table({
         )
       },
       [searchInput, data, setDataFiltered]
+    ),
+    onSelectAllCallback = useCallback(
+      () => typeof onSelectAll === 'function' && onSelectAll(
+        dataFiltered.reduce(
+          (acc, d) => d.tableGroup !== undefined ? [...acc, ...d.tableChildren] : [...acc, d],
+          []
+        )
+      ),
+      [onSelectAll, dataFiltered]
     )
 
   useEffect(() => onSearch(), [onSearch]);
@@ -117,7 +125,7 @@ function Table({
             onSelectAll &&
             <TableHeaderIcon componentIcon={ButtonIconSquareCheck}
                              title="select-all"
-                             onClick={onSelectAll}/>
+                             onClick={onSelectAllCallback}/>
           }
           {additionalHeaderButtons || null}
         </ul>
@@ -139,7 +147,7 @@ function Table({
                                  data={v}
                                  selectedData={selectedData}
                                  onSelect={onSelect}
-                                 onSelectGroup={onSelectGroup}
+                                 onSelectAll={onSelectAll}
                                  onPlay={onPlay}
                                  onOptimizeAudio={onOptimizeAudio}
                                  onEdit={onEdit}

diff --git a/src/App/Components/Table/TableGroup.js b/src/App/Components/Table/TableGroup.js
@@ -9,7 +9,7 @@ import TableList from './TableList.js'
 
 import styles from './Table.module.scss'
 
-function TableGroup ({data, selectedData, onSelect, onSelectGroup, onPlay, onInfo, onEdit, onOptimizeAudio, onDownload, onDelete}) {
+function TableGroup ({data, selectedData, onSelect, onSelectAll, onPlay, onInfo, onEdit, onOptimizeAudio, onDownload, onDelete}) {
   const
     {getLocale} = useLocale(),
     [displayCells, setDisplayCells] = useState(false),
@@ -18,8 +18,8 @@ function TableGroup ({data, selectedData, onSelect, onSelectGroup, onPlay, onInf
       [setDisplayCells]
     ),
     onCSelectGroup = useCallback(
-      () => typeof onSelectGroup === 'function' && onSelectGroup(data.tableChildren),
-      [onSelectGroup, data]
+      () => typeof onSelectAll === 'function' && onSelectAll(data.tableChildren),
+      [onSelectAll, data]
     )
 
   return <li className={styles.cellGroup}>
@@ -36,7 +36,7 @@ function TableGroup ({data, selectedData, onSelect, onSelectGroup, onPlay, onInf
                             onClick={onCDisplayCells}/>
         }
         {
-          onSelectGroup &&
+          onSelectAll &&
           <ButtonIconSquareCheck className={styles.cellGroupButton}
                                  title={getLocale('select-all')}
                                  onClick={onCSelectGroup}/>

diff --git a/src/App/Modules/Synchronize/Music/MusicTable.js b/src/App/Modules/Synchronize/Music/MusicTable.js
@@ -53,7 +53,7 @@ function MusicTable ({className, musics, selectedMusics, setSelectedMusics, onEd
       [setSelectedMusics]
     ),
 
-    onSelectGroup = useCallback(
+    onSelectAll = useCallback(
       (musicTracks) => setSelectedMusics((musics) => {
         if (musicTracks.reduce((acc, music) => isCellSelected(musics, music) ? acc + 1 : acc, 0) === musicTracks.length) {
           return musics.filter((music) => !isCellSelected(musicTracks, music))
@@ -63,17 +63,6 @@ function MusicTable ({className, musics, selectedMusics, setSelectedMusics, onEd
       [setSelectedMusics]
     ),
 
-    onSelectAll = useCallback(
-      () => setSelectedMusics((musics) => {
-        if (flatTableMusics.length === musics.length) {
-          return []
-        } else {
-          return [...flatTableMusics]
-        }
-      }),
-      [flatTableMusics, setSelectedMusics]
-    ),
-
     onCallbackEdit = useCallback(
       (music) => {
         addModal((key) => {
@@ -149,7 +138,6 @@ function MusicTable ({className, musics, selectedMusics, setSelectedMusics, onEd
                 data={tableMusics}
                 selectedData={selectedMusics}
                 onSelect={onSelect}
-                onSelectGroup={onSelectGroup}
                 onSelectAll={onSelectAll}
                 onEdit={onEdit !== undefined ? onCallbackEdit : undefined}
                 onEditSelected={onEditSelected !== undefined ? onCallbackEditSelected : undefined}

diff --git a/src/App/Modules/Synchronize/Stories/StoriesTable.js b/src/App/Modules/Synchronize/Stories/StoriesTable.js
@@ -49,7 +49,7 @@ function StoriesTable ({stories, className, onEdit, onEditSelected, onDelete, on
       }),
       [setSelectedStories]
     ),
-    onSelectGroup = useCallback(
+    onSelectAll = useCallback(
       (stories) => setSelectedStories((currentStories) => {
         if (stories.reduce((acc, story) => isCellSelected(currentStories, story) ? acc + 1 : acc, 0) === stories.length) {
           return currentStories.filter((story) => !isCellSelected(stories, story))
@@ -58,16 +58,6 @@ function StoriesTable ({stories, className, onEdit, onEditSelected, onDelete, on
       }),
       [setSelectedStories]
     ),
-    onSelectAll = useCallback(
-      () => setSelectedStories((stories) => {
-        if (stories.length === flatTableStories.length) {
-          return []
-        } else {
-          return [...flatTableStories]
-        }
-      }),
-      [flatTableStories, setSelectedStories]
-    ),
     onPlay = useCallback((story) => (new Audio(story.audio)).play(), []),
     callbackOnEdit = useCallback(
       (story) => {
@@ -145,7 +135,6 @@ function StoriesTable ({stories, className, onEdit, onEditSelected, onDelete, on
                 data={tableStories}
                 selectedData={selectedStories}
                 onSelect={onSelect}
-                onSelectGroup={onSelectGroup}
                 onSelectAll={onSelectAll}
                 onPlay={onPlay}
                 onOptimizeAudio={onOptimizeAudio}

diff --git a/src/Locales/en.js b/src/Locales/en.js
@@ -91,7 +91,7 @@ const en = {
   'stories': 'Stories',
   'stories-local': 'My stories ({0})',
   'stories-on-store': '{0} stories on the store',
-  'stories-selected': '{0} selected stories',
+  'stories-selected': '{0} selected',
   'stories-edit': 'Edit the stories',
   'stories-delete': 'Delete the stories',
   'stories-delete-confirm': 'Are you sure you want to delete the selected stories ?',
@@ -110,7 +110,7 @@ const en = {
   'musics': 'Music tracks',
   'musics-edit': 'Edit the music tracks',
   'musics-local': 'My music tracks ({0})',
-  'musics-selected': '{0} selected music tracks',
+  'musics-selected': '{0} selected',
   'musics-delete': 'Delete the selected music tracks',
   'musics-delete-confirm': 'Are you sure you want to delete the selected music tracks ?',
   'musics-transferring': 'Transferring music tracks',

diff --git a/src/Locales/fr.js b/src/Locales/fr.js
@@ -91,7 +91,7 @@ const fr = {
   'stories': 'Histoires',
   'stories-local': 'Mes histoires ({0})',
   'stories-on-store': '{0} histoires sur le store',
-  'stories-selected': '{0} histoire(s) sélectionnée(s)',
+  'stories-selected': '{0} sélectionnées',
   'stories-edit': 'Edites les histoires',
   'stories-delete': 'Supprimer les histoires',
   'stories-delete-confirm': 'Êtes-vous sûr de vouloir supprimer les histoires sélectionnées ?',
@@ -110,7 +110,7 @@ const fr = {
   'musics': 'Musiques',
   'musics-edit': 'Editer les musiques',
   'musics-local': 'Mes musiques ({0})',
-  'musics-selected': '{0} musique(s) sélectionné(s)',
+  'musics-selected': '{0} sélectionnées',
   'musics-delete': 'Supprimer les musiques',
   'musics-delete-confirm': 'Êtes-vous sûr de vouloir supprimer les musiques sélectionnées ?',
   'musics-transferring': 'Transfert des musiques',