]> git.localhorst.tv Git - alttp.git/blob - resources/js/components/aos/BaseRomButton.js
client side aos base rom select
[alttp.git] / resources / js / components / aos / BaseRomButton.js
1 import React from 'react';
2 import { Button } from 'react-bootstrap';
3 import { withTranslation } from 'react-i18next';
4
5 import i18n from '../../i18n';
6
7 import { useAosBaseRom } from '../../helpers/AosBaseRomContext';
8
9 const BaseRomButton = () => {
10         const { rom, setRom } = useAosBaseRom();
11
12         const handleFile = React.useCallback(async e => {
13                 if (e.target.files.length != 1) {
14                         setRom(null);
15                 } else {
16                         const buf = await e.target.files[0].arrayBuffer();
17                         setRom(buf);
18                 }
19         }, [setRom]);
20
21         if (rom) return null;
22
23         return <span>
24                 <input
25                         accept=".gba"
26                         className="d-none"
27                         id="aos.baseRom"
28                         onChange={handleFile}
29                         type="file"
30                 />
31                 <label htmlFor="aos.baseRom">
32                         <Button as="span" variant="primary">
33                                 {i18n.t('aos.setBaseRom')}
34                         </Button>
35                 </label>
36         </span>;
37 };
38
39 export default withTranslation()(BaseRomButton);