Skip to content

Commit cd65a6c

Browse files
committed
feat(ActionsMenuButton): Add component
we could pass DotsIcon as prop but for now it's not necessary
1 parent 00b3413 commit cd65a6c

File tree

6 files changed

+52
-43
lines changed

6 files changed

+52
-43
lines changed

react/ActionsMenu/Actions/locales/en.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
{
2+
"menu": "Menu",
23
"viewInContacts": "View in Cozy Contacts",
34
"viewInDrive": "Open",
45
"modify": "Modify",

react/ActionsMenu/Actions/locales/fr.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
{
2+
"menu": "Menu",
23
"viewInContacts": "Voir dans Cozy Contacts",
34
"viewInDrive": "Ouvrir",
45
"modify": "Modifier",
Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
import React, { useState, useRef } from 'react'
2+
3+
import ActionsMenu from '.'
4+
import { locales } from './Actions/locales/withActionsLocales'
5+
import Icon from '../Icon'
6+
import IconButton from '../IconButton'
7+
import DotsIcon from '../Icons/Dots'
8+
import ListItemIcon from '../ListItemIcon'
9+
import { useI18n, useExtendI18n } from '../providers/I18n'
10+
11+
const ActionsMenuButton = ({ docs, actions }) => {
12+
const [showActions, setShowActions] = useState(false)
13+
const actionsRef = useRef()
14+
useExtendI18n(locales)
15+
const { t } = useI18n()
16+
17+
return (
18+
<>
19+
<ListItemIcon>
20+
<IconButton
21+
ref={actionsRef}
22+
arial-label={t('menu')}
23+
onClick={() => setShowActions(true)}
24+
>
25+
<Icon icon={DotsIcon} />
26+
</IconButton>
27+
</ListItemIcon>
28+
{showActions && (
29+
<ActionsMenu
30+
open
31+
ref={actionsRef}
32+
docs={docs}
33+
actions={actions}
34+
anchorOrigin={{
35+
vertical: 'bottom',
36+
horizontal: 'right'
37+
}}
38+
onClose={() => setShowActions(false)}
39+
/>
40+
)}
41+
</>
42+
)
43+
}
44+
45+
export default ActionsMenuButton

react/ContactsList/ContactCell.jsx

Lines changed: 3 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,9 @@
1-
import React, { useRef, useState } from 'react'
1+
import React from 'react'
22

33
import ContactIdentity from './Contacts/ContactIdentity'
4-
import { locales } from './locales/withContactsListLocales'
5-
import ActionsMenu from '../ActionsMenu'
6-
import Icon from '../Icon'
7-
import IconButton from '../IconButton'
8-
import DotsIcon from '../Icons/Dots'
9-
import ListItemIcon from '../ListItemIcon'
10-
import { useI18n, useExtendI18n } from '../providers/I18n'
4+
import ActionsMenuButton from '../ActionsMenu/ActionsMenuButton'
115

126
const Cell = ({ row, column, cell, actions }) => {
13-
const [showActions, setShowActions] = useState(false)
14-
useExtendI18n(locales)
15-
const { t } = useI18n()
16-
const actionsRef = useRef()
17-
187
if (column.id === 'fullname') {
198
return <ContactIdentity contact={row} noWrapper />
209
}
@@ -24,32 +13,7 @@ const Cell = ({ row, column, cell, actions }) => {
2413
return null
2514
}
2615

27-
return (
28-
<>
29-
<ListItemIcon>
30-
<IconButton
31-
ref={actionsRef}
32-
arial-label={t('menu')}
33-
onClick={() => setShowActions(true)}
34-
>
35-
<Icon icon={DotsIcon} />
36-
</IconButton>
37-
</ListItemIcon>
38-
{showActions && (
39-
<ActionsMenu
40-
open
41-
ref={actionsRef}
42-
docs={[row]}
43-
actions={actions}
44-
anchorOrigin={{
45-
vertical: 'bottom',
46-
horizontal: 'right'
47-
}}
48-
onClose={() => setShowActions(false)}
49-
/>
50-
)}
51-
</>
52-
)
16+
return <ActionsMenuButton docs={[row]} actions={actions} />
5317
}
5418

5519
return cell

react/ContactsList/locales/en.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
{
22
"empty": "EMPTY",
33
"me": "me",
4-
"favorite": "favorites",
5-
"menu": "Menu"
4+
"favorite": "favorites"
65
}

react/ContactsList/locales/fr.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
{
22
"empty": "VIDE",
33
"me": "moi",
4-
"favorite": "favoris",
5-
"menu": "Menu"
4+
"favorite": "favoris"
65
}

0 commit comments

Comments
 (0)