Compare commits

...

2 Commits

Author SHA1 Message Date
7b926ec409 Update keyboard shortcut hints in ObjectTableNavigationButtons for clarity
All checks were successful
farmcontrol/farmcontrol-ui/pipeline/head This commit looks good
- Changed the keyboard shortcut hints from 'ALT LEFT' and 'ALT RIGHT' to 'ALT ←' and 'ALT →' respectively, enhancing visual clarity for users.
- This update aligns with the overall goal of improving user experience and accessibility in navigation.
2026-08-01 14:18:05 +01:00
f91b011c5e Add keyboard shortcuts to EditButtons for improved editing experience
- Integrated KeyboardShortcut component to the EditButtons, allowing users to trigger update and cancel actions using 'ALT + S' and 'ALT + C' respectively during editing.
- Added a shortcut for starting editing with 'ALT + E' when not in editing mode, enhancing user interaction and accessibility.
- Updated button states to ensure actions are only available when not loading or disabled, improving overall workflow efficiency.
2026-08-01 14:18:00 +01:00
2 changed files with 51 additions and 20 deletions

View File

@ -2,6 +2,7 @@ import { Button, Space } from 'antd'
import CheckIcon from '../../Icons/CheckIcon.jsx'
import XMarkIcon from '../../Icons/XMarkIcon.jsx'
import EditIcon from '../../Icons/EditIcon.jsx'
import KeyboardShortcut from './KeyboardShortcut.jsx'
import PropTypes from 'prop-types'
const EditButtons = ({
@ -15,26 +16,56 @@ const EditButtons = ({
}) => {
return isEditing ? (
<Space size='small'>
<Button
icon={<CheckIcon />}
type='primary'
onClick={handleUpdate}
loading={loading}
disabled={loading || !formValid || disabled}
/>
<Button
icon={<XMarkIcon />}
onClick={cancelEditing}
disabled={loading || disabled}
/>
<KeyboardShortcut
shortcut='alt+s'
hint='ALT S'
onTrigger={() => {
if (!disabled && !loading && formValid) {
handleUpdate()
}
}}
>
<Button
icon={<CheckIcon />}
type='primary'
onClick={handleUpdate}
loading={loading}
disabled={loading || !formValid || disabled}
/>
</KeyboardShortcut>
<KeyboardShortcut
shortcut='alt+c'
hint='ALT C'
onTrigger={() => {
if (!disabled && !loading) {
cancelEditing()
}
}}
>
<Button
icon={<XMarkIcon />}
onClick={cancelEditing}
disabled={loading || disabled}
/>
</KeyboardShortcut>
</Space>
) : (
<Button
icon={<EditIcon />}
onClick={startEditing}
loading={loading}
disabled={disabled || loading}
/>
<KeyboardShortcut
shortcut='alt+e'
hint='ALT E'
onTrigger={() => {
if (!disabled && !loading) {
startEditing()
}
}}
>
<Button
icon={<EditIcon />}
onClick={startEditing}
loading={loading}
disabled={disabled || loading}
/>
</KeyboardShortcut>
)
}

View File

@ -98,7 +98,7 @@ const ObjectTableNavigationButtons = ({
<Space size='small'>
<KeyboardShortcut
shortcut='alt+arrowleft'
hint='ALT LEFT'
hint='ALT '
onTrigger={useCallback(() => {
if (!disabled && !loading && neighbors.previous?._id) {
handlePrevious()
@ -113,7 +113,7 @@ const ObjectTableNavigationButtons = ({
</KeyboardShortcut>
<KeyboardShortcut
shortcut='alt+arrowright'
hint='ALT RIGHT'
hint='ALT '
onTrigger={useCallback(() => {
if (!disabled && !loading && neighbors.next?._id) {
handleNext()