Remove debug and try/catch
try/catch was there because Firefox decided to not show me any errors...
This commit is contained in:
Kuba Orlik
parent
b1c84b99ac
commit
9e372ca130
@ -17,247 +17,234 @@ import './global.scss';
|
||||
import './sidebar.scss';
|
||||
|
||||
const Sidebar = () => {
|
||||
try {
|
||||
const [origin, setOrigin] = React.useState<string | null>(null);
|
||||
const [minValueLength, setMinValueLength] = React.useState<
|
||||
number | null
|
||||
>(
|
||||
localStorage.getItem('minValueLength') === null
|
||||
? 7
|
||||
: (localStorage.getItem('minValueLength') as unknown as number)
|
||||
);
|
||||
const [cookiesOnly, setCookiesOnly] = React.useState<boolean>(false);
|
||||
const [stolenDataView, setStolenDataView] =
|
||||
React.useState<boolean>(true);
|
||||
const [cookiesOrOriginOnly, setCookiesOrOriginOnly] =
|
||||
React.useState<boolean>(false);
|
||||
const [counter, setCounter] = useEmitter(getMemory());
|
||||
const [marksOccurrence, setMarksOccurrence] =
|
||||
React.useState<boolean>(false);
|
||||
const [warningDataDialogAck, setWarningDataDialogAck] =
|
||||
React.useState<boolean>(
|
||||
localStorage.getItem('warningDataDialogAck') === null
|
||||
? true
|
||||
: localStorage.getItem('warningDataDialogAck') == 'true'
|
||||
? true
|
||||
: false
|
||||
);
|
||||
const [logoVisibility, setLogoVisibility] = React.useState<boolean>(
|
||||
localStorage.getItem('logoVisibility') === null
|
||||
? false
|
||||
: localStorage.getItem('logoVisibility') == 'true'
|
||||
const [origin, setOrigin] = React.useState<string | null>(null);
|
||||
const [minValueLength, setMinValueLength] = React.useState<number | null>(
|
||||
localStorage.getItem('minValueLength') === null
|
||||
? 7
|
||||
: (localStorage.getItem('minValueLength') as unknown as number)
|
||||
);
|
||||
const [cookiesOnly, setCookiesOnly] = React.useState<boolean>(false);
|
||||
const [stolenDataView, setStolenDataView] = React.useState<boolean>(true);
|
||||
const [cookiesOrOriginOnly, setCookiesOrOriginOnly] =
|
||||
React.useState<boolean>(false);
|
||||
const [counter, setCounter] = useEmitter(getMemory());
|
||||
const [marksOccurrence, setMarksOccurrence] =
|
||||
React.useState<boolean>(false);
|
||||
const [warningDataDialogAck, setWarningDataDialogAck] =
|
||||
React.useState<boolean>(
|
||||
localStorage.getItem('warningDataDialogAck') === null
|
||||
? true
|
||||
: localStorage.getItem('warningDataDialogAck') == 'true'
|
||||
? true
|
||||
: false
|
||||
);
|
||||
const [logoVisibility, setLogoVisibility] = React.useState<boolean>(
|
||||
localStorage.getItem('logoVisibility') === null
|
||||
? false
|
||||
: localStorage.getItem('logoVisibility') == 'true'
|
||||
? true
|
||||
: false
|
||||
);
|
||||
|
||||
React.useEffect(() => {
|
||||
const listener = async (data: any) => {
|
||||
console.log('tab change!');
|
||||
const tab = await getCurrentTab();
|
||||
const url = new URL(tab.url);
|
||||
if (url.origin.startsWith('moz-extension')) {
|
||||
return;
|
||||
}
|
||||
setOrigin(url.origin);
|
||||
};
|
||||
browser.tabs.onUpdated.addListener(listener);
|
||||
return () => {
|
||||
browser.tabs.onUpdated.removeListener(listener);
|
||||
};
|
||||
});
|
||||
|
||||
React.useEffect(() => {
|
||||
for (const cluster of Object.values(
|
||||
getMemory().getClustersForOrigin(origin)
|
||||
)) {
|
||||
if (cluster.hasMarks()) {
|
||||
return setMarksOccurrence(true);
|
||||
}
|
||||
React.useEffect(() => {
|
||||
const listener = async (data: any) => {
|
||||
console.log('tab change!');
|
||||
const tab = await getCurrentTab();
|
||||
const url = new URL(tab.url);
|
||||
if (url.origin.startsWith('moz-extension')) {
|
||||
return;
|
||||
}
|
||||
return setMarksOccurrence(false);
|
||||
}, [counter, origin]);
|
||||
setOrigin(url.origin);
|
||||
};
|
||||
browser.tabs.onUpdated.addListener(listener);
|
||||
return () => {
|
||||
browser.tabs.onUpdated.removeListener(listener);
|
||||
};
|
||||
});
|
||||
|
||||
return (
|
||||
<div className="sidebar">
|
||||
<header
|
||||
React.useEffect(() => {
|
||||
for (const cluster of Object.values(
|
||||
getMemory().getClustersForOrigin(origin)
|
||||
)) {
|
||||
if (cluster.hasMarks()) {
|
||||
return setMarksOccurrence(true);
|
||||
}
|
||||
}
|
||||
return setMarksOccurrence(false);
|
||||
}, [counter, origin]);
|
||||
|
||||
return (
|
||||
<div className="sidebar">
|
||||
<header
|
||||
className={
|
||||
logoVisibility ? 'header' : 'header header--without-logo'
|
||||
}
|
||||
>
|
||||
<img
|
||||
src="../assets/logo-internet-czas-dzialac.svg"
|
||||
height={40}
|
||||
style={!logoVisibility ? { display: 'none' } : null}
|
||||
></img>
|
||||
<div
|
||||
className={
|
||||
logoVisibility
|
||||
? 'header'
|
||||
: 'header header--without-logo'
|
||||
? 'webpage-metadata'
|
||||
: 'webpage-metadata webpage-metadata--without-logo'
|
||||
}
|
||||
>
|
||||
<img
|
||||
src="../assets/logo-internet-czas-dzialac.svg"
|
||||
height={40}
|
||||
style={!logoVisibility ? { display: 'none' } : null}
|
||||
></img>
|
||||
<div
|
||||
className={
|
||||
logoVisibility
|
||||
? 'webpage-metadata'
|
||||
: 'webpage-metadata webpage-metadata--without-logo'
|
||||
}
|
||||
>
|
||||
{origin ? (
|
||||
<>
|
||||
<span>Analiza strony</span>
|
||||
<span className="webpage-metadata--hyperlink">
|
||||
{origin}
|
||||
</span>
|
||||
</>
|
||||
) : (
|
||||
<span>Przejdź do wybranej strony internetowej</span>
|
||||
)}
|
||||
</div>
|
||||
{stolenDataView ? (
|
||||
<a href="https://internet-czas-dzialac.pl">
|
||||
<img
|
||||
src="/assets/icons/info_circle_outline.svg"
|
||||
width="20"
|
||||
height="20"
|
||||
/>
|
||||
</a>
|
||||
) : (
|
||||
<button onClick={() => setStolenDataView(true)}>
|
||||
<img
|
||||
src="/assets/icons/short_left.svg"
|
||||
width="20"
|
||||
height="20"
|
||||
/>
|
||||
</button>
|
||||
)}
|
||||
</header>
|
||||
|
||||
{stolenDataView ? (
|
||||
<nav>
|
||||
<button
|
||||
onClick={() => setStolenDataView(!stolenDataView)}
|
||||
>
|
||||
<img
|
||||
src="/assets/icons/settings.svg"
|
||||
width="20"
|
||||
height="20"
|
||||
/>
|
||||
<span>Ustawienia</span>
|
||||
</button>
|
||||
<button
|
||||
onClick={() => {
|
||||
getMemory().removeRequestsFor(origin);
|
||||
setCounter((c) => c + 1);
|
||||
setMarksOccurrence(false);
|
||||
}}
|
||||
>
|
||||
<img
|
||||
src="/assets/icons/trash_full.svg"
|
||||
width="20"
|
||||
height="20"
|
||||
/>
|
||||
<span>Wyczyść historię wtyczki</span>
|
||||
</button>
|
||||
<button
|
||||
onClick={() => {
|
||||
getMemory().removeCookiesFor(origin);
|
||||
setCounter((c) => c + 1);
|
||||
setMarksOccurrence(false);
|
||||
}}
|
||||
>
|
||||
<img
|
||||
src="/assets/icons/cookie.svg"
|
||||
width="20"
|
||||
height="20"
|
||||
/>
|
||||
<span>Wyczyść ciasteczka</span>
|
||||
</button>
|
||||
<button
|
||||
disabled={!marksOccurrence}
|
||||
title={
|
||||
marksOccurrence
|
||||
? 'Kliknij, aby wygenerować wiadomość'
|
||||
: 'Zaznacz poniżej elementy, aby móc wygenerować wiadomość'
|
||||
}
|
||||
onClick={() => {
|
||||
const params = [
|
||||
'height=' + screen.height,
|
||||
'width=' + screen.width,
|
||||
'fullscreen=yes',
|
||||
].join(',');
|
||||
window.open(
|
||||
`/report-window/report-window.html?origin=${origin}`,
|
||||
'new_window',
|
||||
params
|
||||
);
|
||||
}}
|
||||
>
|
||||
<img
|
||||
src="/assets/icons/mail.svg"
|
||||
width="20"
|
||||
height="20"
|
||||
/>
|
||||
<span>
|
||||
Utwórz wiadomość dla administratora witryny
|
||||
</span>
|
||||
</button>
|
||||
</nav>
|
||||
) : null}
|
||||
|
||||
<section>
|
||||
{stolenDataView ? (
|
||||
{origin ? (
|
||||
<>
|
||||
{warningDataDialogAck ? (
|
||||
<section className="warning-container">
|
||||
<span>
|
||||
<strong>Uwaga!</strong> Niekoniecznie
|
||||
każda przechwycona poniżej informacja
|
||||
jest daną osobową. Niektóre z podanych
|
||||
domen mogą należeć do właściciela strony
|
||||
i nie reprezentować podmiotów trzecich.
|
||||
</span>
|
||||
<button
|
||||
onClick={() => {
|
||||
setWarningDataDialogAck(false);
|
||||
localStorage.setItem(
|
||||
'warningDataDialogAck',
|
||||
false as unknown as string
|
||||
);
|
||||
}}
|
||||
>
|
||||
<img
|
||||
src="/assets/icons/close_big.svg"
|
||||
width="16"
|
||||
height="16"
|
||||
/>
|
||||
</button>
|
||||
</section>
|
||||
) : null}
|
||||
<StolenData
|
||||
origin={origin}
|
||||
refreshToken={counter}
|
||||
refresh={() => setCounter((c) => c + 1)}
|
||||
minValueLength={minValueLength}
|
||||
cookiesOnly={cookiesOnly}
|
||||
cookiesOrOriginOnly={cookiesOrOriginOnly}
|
||||
/>
|
||||
<span>Analiza strony</span>
|
||||
<span className="webpage-metadata--hyperlink">
|
||||
{origin}
|
||||
</span>
|
||||
</>
|
||||
) : (
|
||||
<Options
|
||||
minValueLength={minValueLength}
|
||||
setMinValueLength={setMinValueLength}
|
||||
cookiesOnly={cookiesOnly}
|
||||
setCookiesOnly={setCookiesOnly}
|
||||
cookiesOrOriginOnly={cookiesOrOriginOnly}
|
||||
setCookiesOrOriginOnly={setCookiesOrOriginOnly}
|
||||
warningDataDialogAck={warningDataDialogAck}
|
||||
setWarningDataDialogAck={setWarningDataDialogAck}
|
||||
logoVisibility={logoVisibility}
|
||||
setLogoVisibility={setLogoVisibility}
|
||||
/>
|
||||
<span>Przejdź do wybranej strony internetowej</span>
|
||||
)}
|
||||
</section>
|
||||
</div>
|
||||
);
|
||||
} catch (e) {
|
||||
console.error(e);
|
||||
}
|
||||
</div>
|
||||
{stolenDataView ? (
|
||||
<a href="https://internet-czas-dzialac.pl">
|
||||
<img
|
||||
src="/assets/icons/info_circle_outline.svg"
|
||||
width="20"
|
||||
height="20"
|
||||
/>
|
||||
</a>
|
||||
) : (
|
||||
<button onClick={() => setStolenDataView(true)}>
|
||||
<img
|
||||
src="/assets/icons/short_left.svg"
|
||||
width="20"
|
||||
height="20"
|
||||
/>
|
||||
</button>
|
||||
)}
|
||||
</header>
|
||||
|
||||
{stolenDataView ? (
|
||||
<nav>
|
||||
<button onClick={() => setStolenDataView(!stolenDataView)}>
|
||||
<img
|
||||
src="/assets/icons/settings.svg"
|
||||
width="20"
|
||||
height="20"
|
||||
/>
|
||||
<span>Ustawienia</span>
|
||||
</button>
|
||||
<button
|
||||
onClick={() => {
|
||||
getMemory().removeRequestsFor(origin);
|
||||
setCounter((c) => c + 1);
|
||||
setMarksOccurrence(false);
|
||||
}}
|
||||
>
|
||||
<img
|
||||
src="/assets/icons/trash_full.svg"
|
||||
width="20"
|
||||
height="20"
|
||||
/>
|
||||
<span>Wyczyść historię wtyczki</span>
|
||||
</button>
|
||||
<button
|
||||
onClick={() => {
|
||||
getMemory().removeCookiesFor(origin);
|
||||
setCounter((c) => c + 1);
|
||||
setMarksOccurrence(false);
|
||||
}}
|
||||
>
|
||||
<img
|
||||
src="/assets/icons/cookie.svg"
|
||||
width="20"
|
||||
height="20"
|
||||
/>
|
||||
<span>Wyczyść ciasteczka</span>
|
||||
</button>
|
||||
<button
|
||||
disabled={!marksOccurrence}
|
||||
title={
|
||||
marksOccurrence
|
||||
? 'Kliknij, aby wygenerować wiadomość'
|
||||
: 'Zaznacz poniżej elementy, aby móc wygenerować wiadomość'
|
||||
}
|
||||
onClick={() => {
|
||||
const params = [
|
||||
'height=' + screen.height,
|
||||
'width=' + screen.width,
|
||||
'fullscreen=yes',
|
||||
].join(',');
|
||||
window.open(
|
||||
`/report-window/report-window.html?origin=${origin}`,
|
||||
'new_window',
|
||||
params
|
||||
);
|
||||
}}
|
||||
>
|
||||
<img
|
||||
src="/assets/icons/mail.svg"
|
||||
width="20"
|
||||
height="20"
|
||||
/>
|
||||
<span>Utwórz wiadomość dla administratora witryny</span>
|
||||
</button>
|
||||
</nav>
|
||||
) : null}
|
||||
|
||||
<section>
|
||||
{stolenDataView ? (
|
||||
<>
|
||||
{warningDataDialogAck ? (
|
||||
<section className="warning-container">
|
||||
<span>
|
||||
<strong>Uwaga!</strong> Niekoniecznie każda
|
||||
przechwycona poniżej informacja jest daną
|
||||
osobową. Niektóre z podanych domen mogą
|
||||
należeć do właściciela strony i nie
|
||||
reprezentować podmiotów trzecich.
|
||||
</span>
|
||||
<button
|
||||
onClick={() => {
|
||||
setWarningDataDialogAck(false);
|
||||
localStorage.setItem(
|
||||
'warningDataDialogAck',
|
||||
false as unknown as string
|
||||
);
|
||||
}}
|
||||
>
|
||||
<img
|
||||
src="/assets/icons/close_big.svg"
|
||||
width="16"
|
||||
height="16"
|
||||
/>
|
||||
</button>
|
||||
</section>
|
||||
) : null}
|
||||
<StolenData
|
||||
origin={origin}
|
||||
refreshToken={counter}
|
||||
refresh={() => setCounter((c) => c + 1)}
|
||||
minValueLength={minValueLength}
|
||||
cookiesOnly={cookiesOnly}
|
||||
cookiesOrOriginOnly={cookiesOrOriginOnly}
|
||||
/>
|
||||
</>
|
||||
) : (
|
||||
<Options
|
||||
minValueLength={minValueLength}
|
||||
setMinValueLength={setMinValueLength}
|
||||
cookiesOnly={cookiesOnly}
|
||||
setCookiesOnly={setCookiesOnly}
|
||||
cookiesOrOriginOnly={cookiesOrOriginOnly}
|
||||
setCookiesOrOriginOnly={setCookiesOrOriginOnly}
|
||||
warningDataDialogAck={warningDataDialogAck}
|
||||
setWarningDataDialogAck={setWarningDataDialogAck}
|
||||
logoVisibility={logoVisibility}
|
||||
setLogoVisibility={setLogoVisibility}
|
||||
/>
|
||||
)}
|
||||
</section>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
debugger;
|
||||
|
||||
ReactDOM.render(<Sidebar />, document.getElementById('app'));
|
||||
|
||||
Loading…
Reference in New Issue
Block a user