mirror of
https://git.sr.ht/~ashkeel/strimertul
synced 2024-09-18 01:50:50 +00:00
I'm too tired to make a proper debug page, so here's a lazy port of the old one
This commit is contained in:
parent
dfeb2fbf65
commit
03377cbaef
1 changed files with 123 additions and 4 deletions
|
@ -1,6 +1,20 @@
|
|||
import React from 'react';
|
||||
import React, { useState } from 'react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { Button, PageContainer, PageHeader, PageTitle, styled } from '../theme';
|
||||
import { useSelector } from 'react-redux';
|
||||
import { RootState } from '../../store';
|
||||
import {
|
||||
Button,
|
||||
Field,
|
||||
FieldNote,
|
||||
FlexRow,
|
||||
InputBox,
|
||||
Label,
|
||||
PageContainer,
|
||||
PageHeader,
|
||||
PageTitle,
|
||||
styled,
|
||||
Textarea,
|
||||
} from '../theme';
|
||||
|
||||
const Disclaimer = styled('div', {
|
||||
display: 'flex',
|
||||
|
@ -21,7 +35,36 @@ const DisclaimerParagraph = styled('p', {
|
|||
|
||||
export default function DebugPage(): React.ReactElement {
|
||||
const { t } = useTranslation();
|
||||
const [warningDismissed, setWarningDismissed] = React.useState(false);
|
||||
const [warningDismissed, setWarningDismissed] = useState(false);
|
||||
const [readKey, setReadKey] = useState('');
|
||||
const [readValue, setReadValue] = useState('');
|
||||
const [writeKey, setWriteKey] = useState('');
|
||||
const [writeValue, setWriteValue] = useState('');
|
||||
const [writeErrorMsg, setWriteErrorMsg] = useState(null);
|
||||
const api = useSelector((state: RootState) => state.api.client);
|
||||
|
||||
const performRead = async () => {
|
||||
const value = await api.getKey(readKey);
|
||||
setReadValue(value);
|
||||
};
|
||||
const performWrite = async () => {
|
||||
const result = await api.putKey(writeKey, writeValue);
|
||||
console.log(result);
|
||||
};
|
||||
const fixJSON = () => {
|
||||
try {
|
||||
setWriteValue(JSON.stringify(JSON.parse(writeValue)));
|
||||
setWriteErrorMsg(null);
|
||||
} catch (e) {
|
||||
setWriteErrorMsg(e.message);
|
||||
}
|
||||
};
|
||||
const dumpKeys = async () => {
|
||||
console.log(await api.keyList());
|
||||
};
|
||||
const dumpAll = async () => {
|
||||
console.log(await api.getKeysByPrefix(''));
|
||||
};
|
||||
|
||||
if (!warningDismissed) {
|
||||
return (
|
||||
|
@ -36,5 +79,81 @@ export default function DebugPage(): React.ReactElement {
|
|||
</Disclaimer>
|
||||
);
|
||||
}
|
||||
return <PageContainer>WIP</PageContainer>;
|
||||
return (
|
||||
<PageContainer>
|
||||
<PageHeader>
|
||||
<PageTitle>{t('pages.debug.title')}</PageTitle>
|
||||
</PageHeader>
|
||||
<Field size="fullWidth">
|
||||
<Label htmlFor="read-key">{t('pages.debug.console-ops')}</Label>
|
||||
<FlexRow align="left" spacing="1">
|
||||
<Button type="button" onClick={() => dumpKeys()}>
|
||||
{t('pages.debug.dump-keys')}
|
||||
</Button>
|
||||
<Button type="button" onClick={() => dumpAll()}>
|
||||
{t('pages.debug.dump-all')}
|
||||
</Button>
|
||||
</FlexRow>
|
||||
</Field>
|
||||
<form
|
||||
onSubmit={(e) => {
|
||||
e.preventDefault();
|
||||
if ((e.target as HTMLFormElement).checkValidity()) {
|
||||
performRead();
|
||||
}
|
||||
}}
|
||||
>
|
||||
<Field size="fullWidth">
|
||||
<Label htmlFor="read-key">{t('pages.debug.read-key')}</Label>
|
||||
<FlexRow spacing="1">
|
||||
<InputBox
|
||||
required
|
||||
value={readKey ?? ''}
|
||||
onChange={(e) => setReadKey(e.target.value)}
|
||||
id="read-key"
|
||||
css={{ flex: '1' }}
|
||||
/>
|
||||
<Button type="submit">{t('form-actions.submit')}</Button>
|
||||
</FlexRow>
|
||||
<Textarea value={readValue ?? ''} readOnly>
|
||||
{readValue ?? ''}
|
||||
</Textarea>
|
||||
</Field>
|
||||
</form>
|
||||
|
||||
<form
|
||||
onSubmit={(e) => {
|
||||
e.preventDefault();
|
||||
if ((e.target as HTMLFormElement).checkValidity()) {
|
||||
performWrite;
|
||||
}
|
||||
}}
|
||||
>
|
||||
<Field size="fullWidth">
|
||||
<Label htmlFor="write-key">{t('pages.debug.write-key')}</Label>
|
||||
<FlexRow spacing={1}>
|
||||
<InputBox
|
||||
required
|
||||
value={writeKey ?? ''}
|
||||
onChange={(e) => setWriteKey(e.target.value)}
|
||||
id="write-key"
|
||||
css={{ flex: '1' }}
|
||||
/>
|
||||
<Button type="button" onClick={() => fixJSON()}>
|
||||
{t('pages.debug.fix-json')}
|
||||
</Button>
|
||||
<Button type="submit">{t('form-actions.submit')}</Button>
|
||||
</FlexRow>
|
||||
<Textarea
|
||||
required
|
||||
value={writeValue ?? ''}
|
||||
onChange={(e) => setWriteValue(e.target.value)}
|
||||
>
|
||||
{writeValue ?? ''}
|
||||
</Textarea>
|
||||
{writeErrorMsg && <FieldNote>{writeErrorMsg}</FieldNote>}
|
||||
</Field>
|
||||
</form>
|
||||
</PageContainer>
|
||||
);
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue