diff --git a/sidebar/sidebar.tsx b/sidebar/sidebar.tsx index 5350fd9..5cb2861 100644 --- a/sidebar/sidebar.tsx +++ b/sidebar/sidebar.tsx @@ -17,247 +17,234 @@ import './global.scss'; import './sidebar.scss'; const Sidebar = () => { - try { - const [origin, setOrigin] = React.useState(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(false); - const [stolenDataView, setStolenDataView] = - React.useState(true); - const [cookiesOrOriginOnly, setCookiesOrOriginOnly] = - React.useState(false); - const [counter, setCounter] = useEmitter(getMemory()); - const [marksOccurrence, setMarksOccurrence] = - React.useState(false); - const [warningDataDialogAck, setWarningDataDialogAck] = - React.useState( - localStorage.getItem('warningDataDialogAck') === null - ? true - : localStorage.getItem('warningDataDialogAck') == 'true' - ? true - : false - ); - const [logoVisibility, setLogoVisibility] = React.useState( - localStorage.getItem('logoVisibility') === null - ? false - : localStorage.getItem('logoVisibility') == 'true' + const [origin, setOrigin] = React.useState(null); + const [minValueLength, setMinValueLength] = React.useState( + localStorage.getItem('minValueLength') === null + ? 7 + : (localStorage.getItem('minValueLength') as unknown as number) + ); + const [cookiesOnly, setCookiesOnly] = React.useState(false); + const [stolenDataView, setStolenDataView] = React.useState(true); + const [cookiesOrOriginOnly, setCookiesOrOriginOnly] = + React.useState(false); + const [counter, setCounter] = useEmitter(getMemory()); + const [marksOccurrence, setMarksOccurrence] = + React.useState(false); + const [warningDataDialogAck, setWarningDataDialogAck] = + React.useState( + localStorage.getItem('warningDataDialogAck') === null + ? true + : localStorage.getItem('warningDataDialogAck') == 'true' ? true : false ); + const [logoVisibility, setLogoVisibility] = React.useState( + 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 ( -
-
{ + for (const cluster of Object.values( + getMemory().getClustersForOrigin(origin) + )) { + if (cluster.hasMarks()) { + return setMarksOccurrence(true); + } + } + return setMarksOccurrence(false); + }, [counter, origin]); + + return ( +
+
+ +
- -
- {origin ? ( - <> - Analiza strony - - {origin} - - - ) : ( - Przejdź do wybranej strony internetowej - )} -
- {stolenDataView ? ( - - - - ) : ( - - )} -
- - {stolenDataView ? ( - - ) : null} - -
- {stolenDataView ? ( + {origin ? ( <> - {warningDataDialogAck ? ( -
- - Uwaga! 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. - - -
- ) : null} - setCounter((c) => c + 1)} - minValueLength={minValueLength} - cookiesOnly={cookiesOnly} - cookiesOrOriginOnly={cookiesOrOriginOnly} - /> + Analiza strony + + {origin} + ) : ( - + Przejdź do wybranej strony internetowej )} -
-
- ); - } catch (e) { - console.error(e); - } +
+ {stolenDataView ? ( + + + + ) : ( + + )} + + + {stolenDataView ? ( + + ) : null} + +
+ {stolenDataView ? ( + <> + {warningDataDialogAck ? ( +
+ + Uwaga! 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. + + +
+ ) : null} + setCounter((c) => c + 1)} + minValueLength={minValueLength} + cookiesOnly={cookiesOnly} + cookiesOrOriginOnly={cookiesOrOriginOnly} + /> + + ) : ( + + )} +
+ + ); }; -debugger; + ReactDOM.render(, document.getElementById('app'));