62 lines
2.0 KiB
TypeScript
62 lines
2.0 KiB
TypeScript
|
// Copyright 2022 The Pigweed Authors
|
||
|
|
//
|
||
|
|
// Licensed under the Apache License, Version 2.0 (the "License"); you may not
|
||
|
|
// use this file except in compliance with the License. You may obtain a copy of
|
||
|
|
// the License at
|
||
|
|
//
|
||
|
|
// https://www.apache.org/licenses/LICENSE-2.0
|
||
|
|
//
|
||
|
|
// Unless required by applicable law or agreed to in writing, software
|
||
|
|
// distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
|
||
|
|
// WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
|
||
|
|
// License for the specific language governing permissions and limitations under
|
||
|
|
// the License.
|
||
|
|
|
||
|
|
import type {NextPage} from 'next'
|
||
|
|
import Head from 'next/head'
|
||
|
|
import styles from '../styles/Home.module.scss';
|
||
|
|
import Log from "../components/log";
|
||
|
|
import Repl from "../components/repl";
|
||
|
|
import Connect from "../components/connect";
|
||
|
|
import BtnUploadDB from '../components/uploadDb';
|
||
|
|
import {WebSerial, Device} from "pigweedjs";
|
||
|
|
import {useState} from 'react';
|
||
|
|
type WebSerialTransport = WebSerial.WebSerialTransport
|
||
|
|
|
||
|
|
const Home: NextPage = () => {
|
||
|
|
const [device, setDevice] = useState<Device | undefined>(undefined);
|
||
|
|
const [tokenDB, setTokenDB] = useState("");
|
||
|
|
return (
|
||
|
|
<div className={styles.container}>
|
||
|
|
<Head>
|
||
|
|
<title>Pigweed Console</title>
|
||
|
|
<meta name="description" content="Generated by create next app" />
|
||
|
|
<link rel="icon" href="/favicon.png" />
|
||
|
|
</Head>
|
||
|
|
|
||
|
|
<main className={styles.main}>
|
||
|
|
<div className={styles.toolbar}>
|
||
|
|
<span className={styles.logo}><span>Pigweed</span> Web Console</span>
|
||
|
|
<Connect onConnection={(device) => {
|
||
|
|
setDevice(device);
|
||
|
|
}} />
|
||
|
|
<BtnUploadDB onUpload={(db) => {
|
||
|
|
setTokenDB(db);
|
||
|
|
}} />
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div className={styles.grid}>
|
||
|
|
<div>
|
||
|
|
<Log device={device} tokenDB={tokenDB}></Log>
|
||
|
|
</div>
|
||
|
|
<div>
|
||
|
|
<Repl device={device}></Repl>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</main>
|
||
|
|
</div>
|
||
|
|
)
|
||
|
|
}
|
||
|
|
|
||
|
|
export default Home
|