// 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, useEffect} from 'react'; const Home: NextPage = () => { const [device, setDevice] = useState(undefined); const [tokenDB, setTokenDB] = useState(""); useEffect(() => { if (!device || !tokenDB) return; // Dynamically load logging component import('pigweedjs/logging') .then(({createLogViewer, PigweedRPCLogSource}) => { const source = new PigweedRPCLogSource(device, tokenDB); createLogViewer(source, document.querySelector('.log-container')!); }); }, [device, tokenDB]); return (
Pigweed Console
Pigweed Web Console { setDevice(device); }} /> { setTokenDB(db); }} />
) } export default Home