xref: /aosp_15_r20/external/pigweed/pw_web/webconsole/components/uploadDb.tsx (revision 61c4878ac05f98d0ceed94b57d316916de578985)
1*61c4878aSAndroid Build Coastguard Worker// Copyright 2022 The Pigweed Authors
2*61c4878aSAndroid Build Coastguard Worker//
3*61c4878aSAndroid Build Coastguard Worker// Licensed under the Apache License, Version 2.0 (the "License"); you may not
4*61c4878aSAndroid Build Coastguard Worker// use this file except in compliance with the License. You may obtain a copy of
5*61c4878aSAndroid Build Coastguard Worker// the License at
6*61c4878aSAndroid Build Coastguard Worker//
7*61c4878aSAndroid Build Coastguard Worker//     https://www.apache.org/licenses/LICENSE-2.0
8*61c4878aSAndroid Build Coastguard Worker//
9*61c4878aSAndroid Build Coastguard Worker// Unless required by applicable law or agreed to in writing, software
10*61c4878aSAndroid Build Coastguard Worker// distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
11*61c4878aSAndroid Build Coastguard Worker// WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
12*61c4878aSAndroid Build Coastguard Worker// License for the specific language governing permissions and limitations under
13*61c4878aSAndroid Build Coastguard Worker// the License.
14*61c4878aSAndroid Build Coastguard Worker
15*61c4878aSAndroid Build Coastguard Workerimport Button from '@mui/material/Button';
16*61c4878aSAndroid Build Coastguard Workerimport {Alert} from '@mui/material';
17*61c4878aSAndroid Build Coastguard Workerimport {useState, useRef} from 'react';
18*61c4878aSAndroid Build Coastguard Worker
19*61c4878aSAndroid Build Coastguard Workerinterface Props {
20*61c4878aSAndroid Build Coastguard Worker  onUpload: (db: string) => void
21*61c4878aSAndroid Build Coastguard Worker}
22*61c4878aSAndroid Build Coastguard Worker
23*61c4878aSAndroid Build Coastguard Workerexport default function BtnUploadDB({onUpload}: Props) {
24*61c4878aSAndroid Build Coastguard Worker  const [uploaded, setUploaded] = useState(false);
25*61c4878aSAndroid Build Coastguard Worker  const [error, setError] = useState("");
26*61c4878aSAndroid Build Coastguard Worker  const uploadInputRef = useRef<HTMLInputElement>(null);
27*61c4878aSAndroid Build Coastguard Worker
28*61c4878aSAndroid Build Coastguard Worker  if (uploaded) return (<Alert severity="success">DB Loaded</Alert>)
29*61c4878aSAndroid Build Coastguard Worker  return (
30*61c4878aSAndroid Build Coastguard Worker    <>
31*61c4878aSAndroid Build Coastguard Worker      <input
32*61c4878aSAndroid Build Coastguard Worker        ref={uploadInputRef}
33*61c4878aSAndroid Build Coastguard Worker        type="file"
34*61c4878aSAndroid Build Coastguard Worker        accept="text/*"
35*61c4878aSAndroid Build Coastguard Worker        style={{display: "none"}}
36*61c4878aSAndroid Build Coastguard Worker        onChange={async e => {
37*61c4878aSAndroid Build Coastguard Worker          const tokenCsv = await readFile(e.target.files![0]);
38*61c4878aSAndroid Build Coastguard Worker          try {
39*61c4878aSAndroid Build Coastguard Worker            onUpload(tokenCsv);
40*61c4878aSAndroid Build Coastguard Worker            setUploaded(true);
41*61c4878aSAndroid Build Coastguard Worker            setError("");
42*61c4878aSAndroid Build Coastguard Worker          }
43*61c4878aSAndroid Build Coastguard Worker          catch (e: any) {
44*61c4878aSAndroid Build Coastguard Worker            if (e instanceof Error) setError(e.message);
45*61c4878aSAndroid Build Coastguard Worker            else setError("Error loading token database.");
46*61c4878aSAndroid Build Coastguard Worker          }
47*61c4878aSAndroid Build Coastguard Worker        }}
48*61c4878aSAndroid Build Coastguard Worker      />
49*61c4878aSAndroid Build Coastguard Worker      <Button
50*61c4878aSAndroid Build Coastguard Worker        onClick={() => uploadInputRef.current && uploadInputRef.current.click()}
51*61c4878aSAndroid Build Coastguard Worker        variant="contained">
52*61c4878aSAndroid Build Coastguard Worker        Upload token database
53*61c4878aSAndroid Build Coastguard Worker      </Button>
54*61c4878aSAndroid Build Coastguard Worker      {error && <Alert severity="error">{error}</Alert>}
55*61c4878aSAndroid Build Coastguard Worker    </>
56*61c4878aSAndroid Build Coastguard Worker  )
57*61c4878aSAndroid Build Coastguard Worker}
58*61c4878aSAndroid Build Coastguard Worker
59*61c4878aSAndroid Build Coastguard Workerfunction readFile(file: Blob): Promise<string> {
60*61c4878aSAndroid Build Coastguard Worker  return new Promise((resolve, reject) => {
61*61c4878aSAndroid Build Coastguard Worker    if (!file) return resolve('');
62*61c4878aSAndroid Build Coastguard Worker    const reader = new FileReader();
63*61c4878aSAndroid Build Coastguard Worker    reader.onload = function (e) {
64*61c4878aSAndroid Build Coastguard Worker      resolve(String(e.target!.result));
65*61c4878aSAndroid Build Coastguard Worker    };
66*61c4878aSAndroid Build Coastguard Worker    reader.readAsText(file);
67*61c4878aSAndroid Build Coastguard Worker  });
68*61c4878aSAndroid Build Coastguard Worker}
69