1// Copyright 2022 The Pigweed Authors 2// 3// Licensed under the Apache License, Version 2.0 (the "License"); you may not 4// use this file except in compliance with the License. You may obtain a copy of 5// the License at 6// 7// https://www.apache.org/licenses/LICENSE-2.0 8// 9// Unless required by applicable law or agreed to in writing, software 10// distributed under the License is distributed on an "AS IS" BASIS, WITHOUT 11// WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the 12// License for the specific language governing permissions and limitations under 13// the License. 14 15import type {NextPage} from 'next' 16import Head from 'next/head' 17import styles from '../styles/Home.module.scss'; 18import Log from "../components/log"; 19import Repl from "../components/repl"; 20import Connect from "../components/connect"; 21import BtnUploadDB from '../components/uploadDb'; 22import {WebSerial, Device} from "pigweedjs"; 23import {useState} from 'react'; 24type WebSerialTransport = WebSerial.WebSerialTransport 25 26const Home: NextPage = () => { 27 const [device, setDevice] = useState<Device | undefined>(undefined); 28 const [tokenDB, setTokenDB] = useState(""); 29 return ( 30 <div className={styles.container}> 31 <Head> 32 <title>Pigweed Console</title> 33 <meta name="description" content="Generated by create next app" /> 34 <link rel="icon" href="/favicon.png" /> 35 </Head> 36 37 <main className={styles.main}> 38 <div className={styles.toolbar}> 39 <span className={styles.logo}><span>Pigweed</span> Web Console</span> 40 <Connect onConnection={(device) => { 41 setDevice(device); 42 }} /> 43 <BtnUploadDB onUpload={(db) => { 44 setTokenDB(db); 45 }} /> 46 </div> 47 48 <div className={styles.grid}> 49 <div> 50 <Log device={device} tokenDB={tokenDB}></Log> 51 </div> 52 <div> 53 <Repl device={device}></Repl> 54 </div> 55 </div> 56 </main> 57 </div> 58 ) 59} 60 61export default Home 62