101 lines
2.1 KiB
TypeScript
101 lines
2.1 KiB
TypeScript
import { useState } from 'react'
|
|
import { Divider, IconButton, Menu } from 'react-native-paper'
|
|
import ConfirmDialog from './ConfirmDialog'
|
|
import useDark from './use-dark'
|
|
|
|
export default function ListMenu({
|
|
onEdit,
|
|
onCopy,
|
|
onClear,
|
|
onDelete,
|
|
onSelect,
|
|
ids,
|
|
}: {
|
|
onEdit: () => void
|
|
onCopy: () => void
|
|
onClear: () => void
|
|
onDelete: () => void
|
|
onSelect: () => void
|
|
ids?: number[]
|
|
}) {
|
|
const [showMenu, setShowMenu] = useState(false)
|
|
const [showRemove, setShowRemove] = useState(false)
|
|
const dark = useDark()
|
|
|
|
const edit = () => {
|
|
setShowMenu(false)
|
|
onEdit()
|
|
}
|
|
|
|
const copy = () => {
|
|
setShowMenu(false)
|
|
onCopy()
|
|
}
|
|
|
|
const clear = () => {
|
|
setShowMenu(false)
|
|
onClear()
|
|
}
|
|
|
|
const remove = () => {
|
|
setShowMenu(false)
|
|
setShowRemove(false)
|
|
onDelete()
|
|
}
|
|
|
|
const select = () => {
|
|
onSelect()
|
|
}
|
|
|
|
return (
|
|
<Menu
|
|
visible={showMenu}
|
|
onDismiss={() => setShowMenu(false)}
|
|
anchor={
|
|
<IconButton
|
|
color={dark ? 'white' : 'white'}
|
|
onPress={() => setShowMenu(true)}
|
|
icon='more-vert'
|
|
/>
|
|
}
|
|
>
|
|
<Menu.Item icon='done-all' title='Select all' onPress={select} />
|
|
<Menu.Item
|
|
icon='clear'
|
|
title='Clear'
|
|
onPress={clear}
|
|
disabled={ids?.length === 0}
|
|
/>
|
|
<Menu.Item
|
|
icon='edit'
|
|
title='Edit'
|
|
onPress={edit}
|
|
disabled={ids?.length === 0}
|
|
/>
|
|
<Menu.Item
|
|
icon='content-copy'
|
|
title='Copy'
|
|
onPress={copy}
|
|
disabled={ids?.length === 0}
|
|
/>
|
|
<Divider />
|
|
<Menu.Item
|
|
icon='delete'
|
|
onPress={() => setShowRemove(true)}
|
|
title='Delete'
|
|
/>
|
|
<ConfirmDialog
|
|
title={ids?.length === 0 ? 'Delete all' : 'Delete selected'}
|
|
show={showRemove}
|
|
setShow={setShowRemove}
|
|
onOk={remove}
|
|
onCancel={() => setShowMenu(false)}
|
|
>
|
|
{ids?.length === 0
|
|
? <>This irreversibly deletes records from the app. Are you sure?</>
|
|
: <>This will delete {ids?.length} record(s). Are you sure?</>}
|
|
</ConfirmDialog>
|
|
</Menu>
|
|
)
|
|
}
|