Improved UX for self-hosted users

This commit is contained in:
Alicia Sykes 2024-05-06 23:30:09 +01:00
parent 42d6e0394f
commit 390b8b9df7
6 changed files with 22 additions and 33 deletions

View File

@ -1,16 +1,19 @@
--- ---
const isBossServer = import.meta.env.BOSS_SERVER === 'true';
--- ---
<html lang="en"> <html>
<head> <head>
<meta charset="utf-8" /> <title>Results</title>
<link rel="icon" type="image/svg+xml" href="/favicon.svg" /> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width" /> {!isBossServer && (
<meta name="generator" content={Astro.generator} /> <meta http-equiv="refresh" content="0; url=/check" />
<title>Astro</title> <script type="text/javascript">window.location.href = '/check';</script>
)}
</head> </head>
<body> <body>
<h1>TODO: Web Check</h1> <h1>hi</h1>
</body> </body>
</html> </html>

View File

@ -1,16 +0,0 @@
---
---
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
<meta name="viewport" content="width=device-width" />
<meta name="generator" content={Astro.generator} />
<title>Astro</title>
</head>
<body>
<h1>TEST</h1>
</body>
</html>

View File

@ -15,6 +15,7 @@ interface ButtonProps {
fgColor?: string, fgColor?: string,
styles?: string, styles?: string,
title?: string, title?: string,
type?: 'button' | 'submit' | 'reset' | undefined,
loadState?: LoadState, loadState?: LoadState,
}; };
@ -67,7 +68,7 @@ const Loader = (props: { loadState: LoadState }) => {
}; };
const Button = (props: ButtonProps): JSX.Element => { const Button = (props: ButtonProps): JSX.Element => {
const { children, size, bgColor, fgColor, onClick, styles, title, loadState } = props; const { children, size, bgColor, fgColor, onClick, styles, title, loadState, type } = props;
return ( return (
<StyledButton <StyledButton
onClick={onClick || (() => null) } onClick={onClick || (() => null) }
@ -76,6 +77,7 @@ const Button = (props: ButtonProps): JSX.Element => {
fgColor={fgColor} fgColor={fgColor}
styles={styles} styles={styles}
title={title?.toString()} title={title?.toString()}
type={type || 'button'}
> >
{ loadState && <Loader loadState={loadState} /> } { loadState && <Loader loadState={loadState} /> }
{children} {children}

View File

@ -50,7 +50,7 @@ const Footer = (props: { isFixed?: boolean }): JSX.Element => {
View source at <Link href={githubUrl}>github.com/lissy93/web-check</Link> View source at <Link href={githubUrl}>github.com/lissy93/web-check</Link>
</span> </span>
<span> <span>
<Link href="/about">Web-Check</Link> is <Link href="/check/about">Web-Check</Link> is
licensed under <Link href={licenseUrl}>MIT</Link> - licensed under <Link href={licenseUrl}>MIT</Link> -
© <Link href={authorUrl}>Alicia Sykes</Link> 2023 © <Link href={authorUrl}>Alicia Sykes</Link> 2023
</span> </span>

View File

@ -214,7 +214,7 @@ const Home = (): JSX.Element => {
/> />
{/* <FindIpButton onClick={findIpAddress}>Or, find my IP</FindIpButton> */} {/* <FindIpButton onClick={findIpAddress}>Or, find my IP</FindIpButton> */}
{ errorMsg && <ErrorMessage>{errorMsg}</ErrorMessage>} { errorMsg && <ErrorMessage>{errorMsg}</ErrorMessage>}
<Button styles="width: calc(100% - 1rem);" size="large" onClick={submit}>Analyze!</Button> <Button type="submit" styles="width: calc(100% - 1rem);" size="large" onClick={submit}>Analyze!</Button>
</UserInputMain> </UserInputMain>
<SponsorCard> <SponsorCard>
<Heading as="h2" size="small" color={colors.primary}>Sponsored by</Heading> <Heading as="h2" size="small" color={colors.primary}>Sponsored by</Heading>
@ -243,7 +243,7 @@ const Home = (): JSX.Element => {
<Heading as="h2" size="small" color={colors.primary}>Supported Checks</Heading> <Heading as="h2" size="small" color={colors.primary}>Supported Checks</Heading>
<ul> <ul>
{docs.map((doc, index) => (<li key={index}>{doc.title}</li>))} {docs.map((doc, index) => (<li key={index}>{doc.title}</li>))}
<li><a href="/about">+ more!</a></li> <li><a href="/check/about">+ more!</a></li>
</ul> </ul>
</div> </div>
<div className="links"> <div className="links">

View File

@ -909,8 +909,8 @@ const Results = (props: { address?: string } ): JSX.Element => {
<div className="control-options"> <div className="control-options">
<span className="toggle-filters" onClick={() => setShowFilters(true)}>Show Filters</span> <span className="toggle-filters" onClick={() => setShowFilters(true)}>Show Filters</span>
<a href="#view-download-raw-data"><span className="toggle-filters">Export Data</span></a> <a href="#view-download-raw-data"><span className="toggle-filters">Export Data</span></a>
<a href="/about"><span className="toggle-filters">Learn about the Results</span></a> <a href="/check/about"><span className="toggle-filters">Learn about the Results</span></a>
<a href="/about#additional-resources"><span className="toggle-filters">More tools</span></a> <a href="/check/about#additional-resources"><span className="toggle-filters">More tools</span></a>
<a target="_blank" rel="noreferrer" href="https://github.com/lissy93/web-check"><span className="toggle-filters">View GitHub</span></a> <a target="_blank" rel="noreferrer" href="https://github.com/lissy93/web-check"><span className="toggle-filters">View GitHub</span></a>
</div> </div>
) } ) }