refactor: Replace action objects with action components

Some actions, such as `AddMenuItem`, are more optimal and simpler to compose.
cozy · Nov 27, 2024 · 0863f7a · 0863f7a
1 parent 004a843
commit 0863f7a
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 47 deletions.
diff --git a/src/modules/public/PublicToolbarByLink.jsx b/src/modules/public/PublicToolbarByLink.jsx
@@ -1,20 +1,17 @@
 import { useDisplayedFolder } from 'hooks'
 import React from 'react'
 
-import { useClient } from 'cozy-client'
-import { makeActions } from 'cozy-ui/transpiled/react/ActionsMenu/Actions'
-import { useAlert } from 'cozy-ui/transpiled/react/providers/Alert'
 import useBreakpoints from 'cozy-ui/transpiled/react/providers/Breakpoints'
-import { useI18n } from 'cozy-ui/transpiled/react/providers/I18n'
 
 import { BarRightOnMobile } from 'components/Bar'
 import { HOME_LINK_HREF } from 'constants/config'
-import { download, openExternalLink } from 'modules/actions'
 import AddMenuProvider from 'modules/drive/AddMenu/AddMenuProvider'
 import AddButton from 'modules/drive/Toolbar/components/AddButton'
 import AddMenuItem from 'modules/drive/Toolbar/components/AddMenuItem'
+import DownloadButtonItem from 'modules/drive/Toolbar/components/DownloadButtonItem'
 import SelectableItem from 'modules/drive/Toolbar/selectable/SelectableItem'
 import { DownloadFilesButton } from 'modules/public/DownloadFilesButton'
+import OpenExternalLinkItem from 'modules/public/OpenExternalLinkItem'
 import PublicToolbarMoreMenu from 'modules/public/PublicToolbarMoreMenu'
 import { useSelectionContext } from 'modules/selection/SelectionProvider'
 
@@ -24,25 +21,10 @@ const PublicToolbarByLink = ({
   refreshFolderContent
 }) => {
   const { isMobile } = useBreakpoints()
-  const client = useClient()
-  const { showAlert } = useAlert()
-  const { t } = useI18n()
   const { displayedFolder } = useDisplayedFolder()
   const { showSelectionBar, isSelectionBarVisible } = useSelectionContext()
 
-  const actionOptions = {
-    client,
-    t,
-    showAlert,
-    isPublic: true,
-    link: HOME_LINK_HREF
-  }
-  const actions = makeActions(
-    [isMobile && files.length > 0 && download, isMobile && openExternalLink],
-    actionOptions
-  )
-
-  const isMoreMenuDisplayed = actions.length > 0 || files.length > 1
+  const isMoreMenuDisplayed = files.length > 1
 
   return (
     <BarRightOnMobile>
@@ -57,18 +39,20 @@ const PublicToolbarByLink = ({
         {!isMobile && (
           <>
             {hasWriteAccess && <AddButton className="u-mr-half" />}
-            {files.length > 0 && (
-              <DownloadFilesButton files={files} className="u-mr-half" />
-            )}
+            {files.length > 0 && <DownloadFilesButton files={files} />}
           </>
         )}
         {isMoreMenuDisplayed && (
           <PublicToolbarMoreMenu
             files={files}
             hasWriteAccess={hasWriteAccess}
             showSelectionBar={showSelectionBar}
-            actions={actions}
+            actions={[]}
           >
+            {isMobile && <OpenExternalLinkItem link={HOME_LINK_HREF} />}
+            {isMobile && files.length > 0 && (
+              <DownloadButtonItem files={files} />
+            )}
             {isMobile && hasWriteAccess && <AddMenuItem />}
             {files.length > 1 && <SelectableItem onClick={showSelectionBar} />}
           </PublicToolbarMoreMenu>

diff --git a/src/modules/public/PublicToolbarCozyToCozy.jsx b/src/modules/public/PublicToolbarCozyToCozy.jsx
@@ -1,15 +1,12 @@
 import React from 'react'
 
-import { useClient } from 'cozy-client'
-import { makeActions } from 'cozy-ui/transpiled/react/ActionsMenu/Actions'
-import { useAlert } from 'cozy-ui/transpiled/react/providers/Alert'
 import useBreakpoints from 'cozy-ui/transpiled/react/providers/Breakpoints'
-import { useI18n } from 'cozy-ui/transpiled/react/providers/I18n'
 
 import { BarRightOnMobile } from 'components/Bar'
-import { download, openExternalLink } from 'modules/actions'
+import DownloadButtonItem from 'modules/drive/Toolbar/components/DownloadButtonItem'
 import SelectableItem from 'modules/drive/Toolbar/selectable/SelectableItem'
 import { DownloadFilesButton } from 'modules/public/DownloadFilesButton'
+import OpenExternalLinkItem from 'modules/public/OpenExternalLinkItem'
 import PublicToolbarMoreMenu from 'modules/public/PublicToolbarMoreMenu'
 import { useSelectionContext } from 'modules/selection/SelectionProvider'
 
@@ -19,32 +16,21 @@ const PublicToolbarCozyToCozy = ({
   files
 }) => {
   const { isMobile } = useBreakpoints()
-  const { t } = useI18n()
   const { showSelectionBar } = useSelectionContext()
-  const client = useClient()
-  const { showAlert } = useAlert()
-
-  const actionOptions = {
-    client,
-    t,
-    showAlert,
-    isPublic: true,
-    isSharingShortcutCreated,
-    link: discoveryLink
-  }
-  const actions = makeActions(
-    [isMobile && files.length > 0 && download, openExternalLink],
-    actionOptions
-  )
 
   return (
     <BarRightOnMobile>
       {!isMobile && files.length > 0 && <DownloadFilesButton files={files} />}
       <PublicToolbarMoreMenu
         files={files}
         showSelectionBar={showSelectionBar}
-        actions={actions}
+        actions={[]}
       >
+        <OpenExternalLinkItem
+          isSharingShortcutCreated={isSharingShortcutCreated}
+          link={discoveryLink}
+        />
+        {isMobile && files.length > 0 && <DownloadButtonItem files={files} />}
         {files.length > 1 && <SelectableItem onClick={showSelectionBar} />}
       </PublicToolbarMoreMenu>
     </BarRightOnMobile>