2021-09-10 15:38:53 +00:00
|
|
|
import variables from 'modules/variables';
|
2022-04-07 09:25:01 +00:00
|
|
|
import { MdCancel } from 'react-icons/md';
|
2021-10-12 21:18:47 +00:00
|
|
|
import { TextField } from '@mui/material';
|
2021-09-10 15:38:53 +00:00
|
|
|
|
2021-09-04 11:20:58 +00:00
|
|
|
export default function KeybindInput(props) {
|
2021-09-10 18:25:09 +00:00
|
|
|
const value = props.state[props.setting];
|
2021-09-04 11:20:58 +00:00
|
|
|
|
|
|
|
const getButton = () => {
|
|
|
|
if (!value) {
|
2022-04-11 21:57:07 +00:00
|
|
|
return (
|
|
|
|
<button
|
|
|
|
className="cleanButton"
|
|
|
|
style={{ visibility: 'hidden' }}
|
|
|
|
onClick={() => props.action('reset', props.setting)}
|
|
|
|
>
|
|
|
|
<MdCancel />
|
|
|
|
</button>
|
|
|
|
);
|
|
|
|
} else if (
|
|
|
|
value ===
|
|
|
|
variables.language.getMessage(
|
|
|
|
variables.languagecode,
|
|
|
|
'modals.main.settings.sections.keybinds.recording',
|
|
|
|
)
|
|
|
|
) {
|
|
|
|
return (
|
|
|
|
<button className="cleanButton" onClick={() => props.action('cancel', props.setting)}>
|
|
|
|
<MdCancel />
|
|
|
|
</button>
|
|
|
|
);
|
2021-09-04 11:20:58 +00:00
|
|
|
} else {
|
2022-04-11 21:57:07 +00:00
|
|
|
return (
|
|
|
|
<button className="cleanButton" onClick={() => props.action('reset', props.setting)}>
|
|
|
|
<MdCancel />
|
|
|
|
</button>
|
|
|
|
);
|
2021-09-04 11:20:58 +00:00
|
|
|
}
|
2022-04-11 21:57:07 +00:00
|
|
|
};
|
2021-09-04 11:20:58 +00:00
|
|
|
|
|
|
|
return (
|
|
|
|
<>
|
2022-04-11 21:57:07 +00:00
|
|
|
<TextField
|
|
|
|
label={props.name}
|
|
|
|
onClick={() => props.action('listen', props.setting)}
|
|
|
|
value={
|
|
|
|
value ||
|
|
|
|
variables.language.getMessage(
|
|
|
|
variables.languagecode,
|
|
|
|
'modals.main.settings.sections.keybinds.click_to_record',
|
|
|
|
)
|
|
|
|
}
|
|
|
|
readOnly
|
|
|
|
spellCheck={false}
|
|
|
|
varient="outlined"
|
|
|
|
InputLabelProps={{ shrink: true }}
|
|
|
|
/>
|
2021-09-04 11:20:58 +00:00
|
|
|
{getButton()}
|
|
|
|
</>
|
|
|
|
);
|
|
|
|
}
|