Remove wczytywanie... text

This commit is contained in:
Arkadiusz Wieczorek 2022-07-09 18:05:56 +02:00
parent f6a28256e9
commit 50701adcf6
2 changed files with 101 additions and 90 deletions

View File

@ -22,6 +22,10 @@ body {
z-index: 1; z-index: 1;
user-select: none; user-select: none;
&--no-page {
border-bottom: 0;
}
.webpage-metadata { .webpage-metadata {
word-break: break-all; word-break: break-all;
display: flex; display: flex;

View File

@ -132,13 +132,9 @@ const Toolbar = () => {
return setMarksOccurrence(true); return setMarksOccurrence(true);
} }
if (!origin) {
return <div>Wczytywanie...</div>;
}
return ( return (
<div className="toolbar"> <div className="toolbar">
<header className="header"> <header className={origin ? 'header' : 'header header--no-page'}>
<img src="../../assets/icon-addon.svg" height={32}></img> <img src="../../assets/icon-addon.svg" height={32}></img>
<div className="webpage-metadata"> <div className="webpage-metadata">
{origin ? ( {origin ? (
@ -157,95 +153,106 @@ const Toolbar = () => {
) : null} ) : null}
</header> </header>
<section className="summary"> {origin ? (
<div className="counters-wrapper">
<div className="counters">
<div className="counter counter--cookies">
<img src="/assets/icons/cookie.svg#color" width="24" height="24" />
<span data-event={`${eventCounts['*']}`}>
{
Object.values(getMemory().getClustersForOrigin(origin)).filter(
(cluster) => cluster.hasCookies()
).length
}
</span>
</div>
<div className="counter counter--browser-history">
<img src="/assets/icons/warning.svg#color" width="24" height="24" />
<span data-event={`${eventCounts['*']}`}>
{
Object.values(getMemory().getClustersForOrigin(origin)).filter(
(cluster) => cluster.exposesOrigin()
).length
}
</span>
</div>
</div>
<div className="big-counter" data-event={`${eventCounts['*']}`}>
{Object.values(getMemory().getClustersForOrigin(origin)).length}
</div>
</div>
<span className="notice">Liczba wykrytych domen podmiotów trzecich</span>
</section>
<section className="details">
{cookieDomainCopy ? (
<p
data-event={`${eventCounts['*']}`}
title={Object.values(getMemory().getClustersForOrigin(origin))
.filter((cluster) => cluster.hasCookies())
.map((domain) => domain.id)
.join(', ')}
>
{first_sentence_cookie}
<strong>{cookieDomainCopy}</strong>
</p>
) : null}
{exposedOriginDomainCopy ? (
<p
data-event={`${eventCounts['*']}`}
title={Object.values(getMemory().getClustersForOrigin(origin))
.filter((cluster) => cluster.exposesOrigin())
.map((domain) => domain.id)
.join(', ')}
>
{first_sentence_history}
<strong>{exposedOriginDomainCopy}</strong>
</p>
) : null}
</section>
{exposedOriginDomainCopy || cookieDomainCopy ? (
<Fragment> <Fragment>
<section className="about"> {' '}
<p> <section className="summary">
Takie przetwarzanie danych może być niezgodne z prawem. Przejdź do <div className="counters-wrapper">
analizy aby pomóc ustalić, czy ta strona nie narusza RODO. <div className="counters">
</p> <div className="counter counter--cookies">
<img
src="/assets/icons/cookie.svg#color"
width="24"
height="24"
/>
<span data-event={`${eventCounts['*']}`}>
{
Object.values(
getMemory().getClustersForOrigin(origin)
).filter((cluster) => cluster.hasCookies()).length
}
</span>
</div>
<div className="counter counter--browser-history">
<img
src="/assets/icons/warning.svg#color"
width="24"
height="24"
/>
<span data-event={`${eventCounts['*']}`}>
{
Object.values(
getMemory().getClustersForOrigin(origin)
).filter((cluster) => cluster.exposesOrigin()).length
}
</span>
</div>
</div>
<div className="big-counter" data-event={`${eventCounts['*']}`}>
{Object.values(getMemory().getClustersForOrigin(origin)).length}
</div>
</div>
<span className="notice">Liczba wykrytych domen podmiotów trzecich</span>
</section> </section>
<section className="actions"> <section className="details">
<button {cookieDomainCopy ? (
className="button button--report" <p
onClick={() => { data-event={`${eventCounts['*']}`}
autoMark(); title={Object.values(getMemory().getClustersForOrigin(origin))
window.open( .filter((cluster) => cluster.hasCookies())
`/components/sidebar/sidebar.html?origin=${origin}`, .map((domain) => domain.id)
'new_tab' .join(', ')}
); >
window.close(); // close toolbar popup {first_sentence_cookie}
}} <strong>{cookieDomainCopy}</strong>
> </p>
Przejdź do analizy ) : null}
</button> {exposedOriginDomainCopy ? (
<p
data-event={`${eventCounts['*']}`}
title={Object.values(getMemory().getClustersForOrigin(origin))
.filter((cluster) => cluster.exposesOrigin())
.map((domain) => domain.id)
.join(', ')}
>
{first_sentence_history}
<strong>{exposedOriginDomainCopy}</strong>
</p>
) : null}
</section> </section>
{exposedOriginDomainCopy || cookieDomainCopy ? (
<Fragment>
<section className="about">
<p>
Takie przetwarzanie danych może być niezgodne z prawem. Przejdź
do analizy aby pomóc ustalić, czy ta strona nie narusza RODO.
</p>
</section>
<section className="actions">
<button
className="button button--report"
onClick={() => {
autoMark();
window.open(
`/components/sidebar/sidebar.html?origin=${origin}`,
'new_tab'
);
window.close(); // close toolbar popup
}}
>
Przejdź do analizy
</button>
</section>
</Fragment>
) : (
<Fragment>
<section className="about about__no-errors">
<p>Nie znaleziono problemów na tej stronie.</p>
</section>
</Fragment>
)}
</Fragment> </Fragment>
) : ( ) : null}
<Fragment>
<section className="about about__no-errors">
<p>Nie znaleziono problemów na tej stronie.</p>
</section>
</Fragment>
)}
</div> </div>
); );
}; };