chrissewell/hetty
1
0
Fork 0
mirror of https://github.com/dstotijn/hetty.git synced 2025-07-01 18:47:29 -04:00
Code Issues Packages Projects Releases Wiki Activity

First rough version of proxy logs frontend

Browse Source
This commit is contained in:
David Stotijn
2020-09-20 22:30:17 +02:00
parent 211c11be2b
commit 21c78cdc23
22 changed files with 2244 additions and 1349 deletions
Download Patch File Download Diff File Expand all files Collapse all files

41
admin/src/pages/_app.tsx Normal file
View File

@ -0,0 +1,41 @@
import React from "react";
import { AppProps } from "next/app";
import { ApolloProvider } from "@apollo/client";
import Head from "next/head";
import { ThemeProvider } from "@material-ui/core/styles";
import CssBaseline from "@material-ui/core/CssBaseline";
import theme from "../lib/theme";
import { useApollo } from "../lib/graphql";
function App({ Component, pageProps }: AppProps): JSX.Element {
const apolloClient = useApollo(pageProps.initialApolloState);
React.useEffect(() => {
// Remove the server-side injected CSS.
const jssStyles = document.querySelector("#jss-server-side");
if (jssStyles) {
jssStyles.parentElement.removeChild(jssStyles);
}
}, []);
return (
<React.Fragment>
<Head>
<title>gurp</title>
<meta
name="viewport"
content="minimum-scale=1, initial-scale=1, width=device-width"
/>
</Head>
<ApolloProvider client={apolloClient}>
<ThemeProvider theme={theme}>
<CssBaseline />
<Component {...pageProps} />
</ThemeProvider>
</ApolloProvider>
</React.Fragment>
);
}
export default App;

49
admin/src/pages/_document.tsx Normal file
View File

@ -0,0 +1,49 @@
import React from "react";
import Document, { Html, Head, Main, NextScript } from "next/document";
import { ServerStyleSheets } from "@material-ui/core/styles";
import theme from "../lib/theme";
export default class MyDocument extends Document {
render() {
return (
<Html lang="en">
<Head>
<meta name="theme-color" content={theme.palette.primary.main} />
<link
rel="stylesheet"
href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap"
/>
</Head>
<body>
<Main />
<NextScript />
</body>
</Html>
);
}
}
// `getInitialProps` belongs to `_document` (instead of `_app`),
// it's compatible with server-side generation (SSG).
MyDocument.getInitialProps = async (ctx) => {
// Render app and page and get the context of the page with collected side effects.
const sheets = new ServerStyleSheets();
const originalRenderPage = ctx.renderPage;
ctx.renderPage = () =>
originalRenderPage({
enhanceApp: (App) => (props) => sheets.collect(<App {...props} />),
});
const initialProps = await Document.getInitialProps(ctx);
return {
...initialProps,
// Styles fragment is rendered after the app and page rendering finish.
styles: [
...React.Children.toArray(initialProps.styles),
sheets.getStyleElement(),
],
};
};

11
admin/src/pages/index.tsx Normal file
View File

@ -0,0 +1,11 @@
import RequestList from "../components/reqlog/RequestList";
function Index(): JSX.Element {
return (
<div>
<h1>gurp</h1>
</div>
);
}
export default Index;

22
admin/src/pages/proxy/logs.tsx Normal file
View File

@ -0,0 +1,22 @@
import { useState } from "react";
import { Box } from "@material-ui/core";
import RequestList from "../../components/reqlog/RequestList";
import LogDetail from "../../components/reqlog/LogDetail";
function Logs(): JSX.Element {
const [detailReqLogId, setDetailReqLogId] = useState<string>();
const handleLogClick = (reqId: string) => setDetailReqLogId(reqId);
return (
<div>
<Box minHeight="375px" maxHeight="33vh" overflow="scroll">
<RequestList onLogClick={handleLogClick} />
</Box>
<Box>{detailReqLogId && <LogDetail requestId={detailReqLogId} />}</Box>
</div>
);
}
export default Logs;