inventree/InvenTree
2
0
Fork 0
mirror of https://github.com/inventree/InvenTree.git synced 2025-06-13 18:45:40 +00:00
Code Activity

feat(frontend): Improve barcode scanning text input on Platform UI. (#9655)

Browse Source 
* feat(frontend): Add control character handling to barcode text input.

Ports part of 8059fb1e05 to Platform UI.

Fixes #7529.

* feat(frontend): Submit barcode scan on EOT character.

Automatically submits 2D barcode scans when end of transmission character is input.

---------

Co-authored-by: Oliver <oliver.henry.walters@gmail.com>
This commit is contained in:
Will Bicks
2025-06-03 20:08:13 -04:00
committed by GitHub
parent 24a2279368
commit 5513291d3f
1 changed files with 26 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
src/frontend/src/components/barcodes/BarcodeKeyboardInput.tsx
View File

@ -4,6 +4,15 @@ import { IconQrcode } from '@tabler/icons-react';
import { useCallback, useState } from 'react';
import type { BarcodeInputProps } from './BarcodeInput';
// Control keys commonly used for ASCII control codes by barcode scanners
// emulating keyboard input.
// See for example: https://docs.zebra.com/us/en/scanners/general/sm72-ig/ascii-character-sets.html
const BarcodeControlKeys: Record<string, string> = {
KeyD: String.fromCharCode(4), // End of transmission
BracketRight: String.fromCharCode(29), // Group separator
Digit6: String.fromCharCode(30) // Record separator
} as const;
export default function BarcodeKeyboardInput({
onScan,
actionText = t`Scan`
@ -32,7 +41,23 @@ export default function BarcodeKeyboardInput({
setText(event.currentTarget?.value);
}}
onKeyDown={(event) => {
if (event.code === 'Enter') {
let key = event.key;
if (event.ctrlKey) {
if (event.code in BarcodeControlKeys) {
// Prevent most of the keyboard shortcuts.
// Not all of them will be blocked, browser don't allow this:
// https://stackoverflow.com/questions/59952382/using-preventdefault-to-override-opening-new-tab
event.preventDefault();
key = BarcodeControlKeys[event.code];
setText((prev) => prev + key);
}
}
if (
key === 'Enter' ||
key === String.fromCharCode(4) // End of transmission
) {
onTextScan(text);
}
}}