icd/rentgen
icd/rentgen
2
1
Fork 0
Code Issues 72 Pull Requests Projects Releases 6 Wiki Activity

Report window to handle refreshes properly

Browse Source
This commit is contained in:
Kuba Orlik 2022-02-10 20:03:48 +01:00
parent 473424d88d
commit 468391489c
1 changed files with 63 additions and 52 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

115
report-window/report-window.tsx
View File

@ -9,59 +9,70 @@ import EmailContent from './email-content';
import { parseAnswers, ParsedAnswers } from './parse-answers';
function Report() {
try {
const origin = new URL(document.location.toString()).searchParams.get('origin');
const [counter] = useEmitter(getMemory());
const [answers, setAnswers] = React.useState<ParsedAnswers>(null);
const [mode, setMode] = React.useState('survey');
const clusters = getMemory().getClustersForOrigin(origin);
/* const [entries, setEntries] = React.useState<StolenDataEntry[]>([]); */
/* React.useEffect(() => {
* setEntries(
* Object.values(clusters)
* .map((cluster) => {
* cluster.calculateRepresentativeStolenData();
* return cluster.representativeStolenData;
* })
* .reduce(reduceConcat, [])
* .filter((entry) => entry.isMarked)
* );
* }, []); */
/* if (entries.length == 0) {
* return <>Wczytywanie...</>;
* } */
const visited_url = Object.values(clusters)
.find((cluster) => cluster.getMarkedRequests().length > 0)
?.getMarkedRequests()[0].originalURL;
try {
const url = new URL(document.location.toString());
const origin = url.searchParams.get('origin');
const [counter] = useEmitter(getMemory());
const [answers, setAnswers] = React.useState<ParsedAnswers>(
url.searchParams.get('answers') ? JSON.parse(url.searchParams.get('answers')) : null
);
const [mode, setMode] = React.useState(url.searchParams.get('mode') || 'survey');
const clusters = getMemory().getClustersForOrigin(origin);
/* const [entries, setEntries] = React.useState<StolenDataEntry[]>([]); */
/* React.useEffect(() => {
* setEntries(
* Object.values(clusters)
* .map((cluster) => {
* cluster.calculateRepresentativeStolenData();
* return cluster.representativeStolenData;
* })
* .reduce(reduceConcat, [])
* .filter((entry) => entry.isMarked)
* );
* }, []); */
/* if (entries.length == 0) {
* return <>Wczytywanie...</>;
* } */
const result = (
<div {...{ 'data-version': counter }}>
<nav>
<img src="../assets/icon-addon.svg" width={48} height={48}></img>{' '}
<h1>Rentgen - Generuj treść maila dla {origin}</h1>
</nav>
{mode === 'survey' ? (
<Questions
hosts={Object.values(clusters)
.filter((cluster) => cluster.getMarkedRequests().length > 0)
.map((cluster) => cluster.id)}
onComplete={(answers) => {
setAnswers(parseAnswers(answers));
setMode('preview');
}}
></Questions>
) : (
''
)}
{mode === 'preview' ? <EmailContent {...{ answers, visited_url, clusters }} /> : ''}
{/* <HARConverter {...{ entries }} /> */}
</div>
);
return result;
} catch (e) {
console.error(e);
return <div>ERROR! {JSON.stringify(e)}</div>;
}
React.useEffect(() => {
const url = new URL(document.location.toString());
url.searchParams.set('origin', origin);
url.searchParams.set('answers', JSON.stringify(answers));
url.searchParams.set('mode', mode);
history.pushState({}, 'Rentgen', url.toString());
}, [mode, answers, origin]);
const visited_url = Object.values(clusters)
.find((cluster) => cluster.getMarkedRequests().length > 0)
?.getMarkedRequests()[0].originalURL;
const result = (
<div {...{ 'data-version': counter }}>
<nav>
<img src="../assets/icon-addon.svg" width={48} height={48}></img>{' '}
<h1>Rentgen - Generuj treść maila dla {origin}</h1>
</nav>
{mode === 'survey' ? (
<Questions
hosts={Object.values(clusters)
.filter((cluster) => cluster.getMarkedRequests().length > 0)
.map((cluster) => cluster.id)}
onComplete={(answers) => {
setAnswers(parseAnswers(answers));
setMode('preview');
}}
></Questions>
) : (
''
)}
{mode === 'preview' ? <EmailContent {...{ answers, visited_url, clusters }} /> : ''}
{/* <HARConverter {...{ entries }} /> */}
</div>
);
return result;
} catch (e) {
console.error(e);
return <div>ERROR! {JSON.stringify(e)}</div>;
}
}
ReactDOM.render(<Report />, document.getElementById('app'));