New email template

report-window/email-template-1.tsx

@@ -0,0 +1,216 @@
+import React from "react";
+import { useState } from "react";
+import { RequestCluster } from "../request-cluster";
+import { StolenDataEntry } from "../stolen-data-entry";
+import { getDate, toBase64 } from "../util";
+import DomainSummary from "./domain-summary";
+
+type PopupState = "not_clicked" | "clicked_but_no_reject_all";
+
+export default function EmailTemplate1({
+  entries,
+  clusters,
+}: {
+  entries: StolenDataEntry[];
+  clusters: Record<string, RequestCluster>;
+  version: number;
+}): JSX.Element {
+  const [popupState, setPopupState] = useState<PopupState>("not_clicked");
+  const [acceptAllName, setAcceptAllName] = useState<string>(
+    "Zaakceptuj wszystkie"
+  );
+  const [popupScreenshotBase64, setPopupScreenshotBase64] = useState<string>(
+    null
+  );
+
+  return (
+    <div>
+      <label htmlFor="popupState">Status okienka o rodo:</label>
+      <select
+        id="popupState"
+        value={popupState}
+        onChange={(e) => setPopupState(e.target.value as PopupState)}
+      >
+        <option value="not_clicked">Nic nie kliknięte</option>
+        <option value="clicked_but_no_reject_all">
+          Kliknięte "akceptuj wszystkie", ale nie było opcji "Odrzuć wszystkie"
+        </option>
+      </select>
+      {popupState === "clicked_but_no_reject_all" ? (
+        <>
+          <div>
+            <label htmlFor="acceptAllName">
+              Tekst na przycisku do zatwierdzania wszystkich zgód:
+            </label>
+            <input
+              {...{
+                type: "text",
+                value: acceptAllName,
+                onChange: (e) => setAcceptAllName(e.target.value),
+              }}
+            />
+          </div>
+          <div>
+            <label htmlFor="popup-screenshot">
+              Zrzut ekranu z tego, jak wyglądał popup przed kliknięciem „
+              {acceptAllName}”:
+            </label>
+            <input
+              {...{
+                type: "file",
+                id: "popup-screenshot",
+                onChange: async (e) => {
+                  setPopupScreenshotBase64(await toBase64(e.target.files[0]));
+                },
+              }}
+            />
+          </div>
+        </>
+      ) : null}
+      <p>
+        Dzień dobry, w dniu {getDate()} odwiedziłem stronę{" "}
+        {entries[0].request.originalURL}. Strona ta wysłała moje dane osobowe do
+        podmiotów trzecich - bez mojej zgody.{" "}
+      </p>
+      <ul>
+        {Object.values(clusters)
+          .filter((cluster) => cluster.hasMarks())
+          .map((cluster) => (
+            <DomainSummary cluster={cluster} />
+          ))}
+      </ul>
+      <p>
+        {" "}
+        Dane te zostały wysłane przez Państwa stronę - a mówiąc dokładniej,
+        przez zamieszczone przez Państwa na tej stronie skrypty.
+      </p>
+      {popupState === "not_clicked" ? (
+        <p>
+          Nastąpiło to, zanim zdążyłem w ogóle przeczytać treść wyskakującego
+          okienka ze zgodami i zanim miałem szansę wyrazić sprzeciw takiemu
+          przetwarzaniu danych osobowych.
+        </p>
+      ) : null}
+      {popupState === "clicked_but_no_reject_all" ? (
+        <p>
+          O ile po wejściu na stronę wcisnąłem w wyskakującym okienku przycisk „
+          {acceptAllName}”, o tyle nie stanowi to według mnie ważnej w świetle
+          RODO zgody, gdyż brakowało w tym okienku równie łatwo osiągalnego
+          przycisku, którego kliknięcie skutkowałoby zasygnalizowaniem braku
+          mojej zgody na takie przetwarzanie moich danych. Mówiąc wprost -
+          wyrażenie „zgody” było łatwiejsze niż jej niewyrażenie. Niewyrażenie
+          zgody wiąże się z negatywną konsekwencją konieczności przechodzenia
+          przez dodatkowe kroki w wyskakującym okienku. Zatem tak otrzymana
+          przez Państwo moja „zgoda” nie jest poprawną podstawą prawną do
+          przetwarzania moich danych osobowych, gdyż nie spełnia warunku
+          dobrowolności wspomnianego w Art. 4. pkt 11{" "}
+          <em>
+            rozporządzenia Parlamentu Europejskiego i Rady (UE) 2016/679 z dnia
+            27 kwietnia 2016 r. w sprawie ochrony osób fizycznych w związku z
+            przetwarzaniem danych osobowych i w sprawie swobodnego przepływu
+            takich danych oraz uchylenia dyrektywy 95/46/WE
+          </em>
+          .{<img {...{ src: popupScreenshotBase64 }} />}
+        </p>
+      ) : null}
+      <p>
+        Udokumentowałem to na zrzutach ekranu z mojej przeglądarki internetowej,
+        które to zrzuty przesyłam w załączeniu.
+      </p>
+      <p>
+        Wiem, że nie wszystkie rodzaje przetwarzania danych wymagają zgody
+        użytkownika. W kontekście stron internetowych z wymienionych w Art. 6.
+        pkt 1. RODO mogą mieć zastosowanie albo „zgoda” (Art. 6. pkt 1. lit.
+        a)), albo niezbędność tego przetwarzania do wykonania umowy (Art. 6. pkt
+        1. lit. b)), albo uzasadniony interes (Art. 6. pkt 1. lit. f)). Wiem
+        też, że każda z tych podstaw prawnych ma moc dopiero po spełnieniu
+        określonych warunków.
+      </p>
+      <p>
+        Nie widzę ważnej podstawy prawnej legalizującej procesy przetwarzania
+        moich danych osobowych, jakie wymieniłem powyżej (na pewno nie jest to
+        przetwarzanie konieczne do wyświetlenia strony z technicznego punktu
+        widzenia). Jeżeli takie przesłanki legalizujące jednak występują, proszę
+        o ich wskazanie,
+        <strong>
+          {" "}
+          dla każdego z celów i podmiotów z <em>osobna</em>
+        </strong>
+        .
+      </p>
+      <p>
+        Jeżeli wskazaną przez Państwa przesłanką legalizującą dany element
+        procesu przetwarzania danych osobowych przez Państwa stronę jest Art 6.
+        pkt 1 lit. a) RODO (zgoda), na mocy Art. 7 pkt 1 RODO proszę o
+        wykazanie, że udzieliłem Państwu zgodę na takie przetwarzanie moich
+        danych osobowych zanim to przetwarzanie nastąpiło, oraz że ta zgoda jest
+        ważna w świetle RODO (odnosząc się w szczególności do art. 7 ust. 3
+        RODO). Z góry zaznaczam, że „ustawienia przeglądarki” nie stanowią
+        ważnej w świetle RODO zgody.
+      </p>
+      <p>
+        Jeżeli wskazaną przez Państwa przesłanką legalizującą dany element
+        procesu przetwarzania danych osobowych przez Państwa stronę jest Art 6.
+        pkt 1 lit. b) RODO (niezbędność takiego przetwarzania do wykonania
+        umowy), proszę o wskazanie, w jaki sposób ta konieczność zachodzi, oraz
+        co sprawia, że Państwa zdaniem nie można wykonać umowy związanej z
+        wyświetleniem Państwa strony bez przekazywania sztucznie nadanego ID w
+        plikach Cookies lub historii przeglądania w nagłówku Referer do
+        wskazanych podmiotów trzecich.
+      </p>
+      <p>
+        Jeżeli wskazaną przez Państwa przesłanką legalizującą dany element
+        procesu przetwarzania danych osobowych przez Państwa stronę jest Art 6.
+        pkt 1 lit. f) RODO (uzasadniony interes), proszę o wskazanie, jaki to
+        jest <strong>konkretny interes</strong> (prosze o bardziej dokładny opis
+        niż np. tylko "marketing"), oraz o wynik testu równowagi pomiędzy
+        Państwa interesem a moimi podstawowymi wolnościami i prawami - ze
+        wskazaniem tego, co sprawia, że w Państwa ocenie Państwa uzasadniony
+        interes przeważa moje prawa i interesy w kontekście wspomnianych powyżej
+        procesów przetwarzania danych. Proszę też pamiętać, że aby w ramach
+        danego celu przetwarzania powołać się na prawnie uzasadniony interes,
+        powinni mi Państo umożliwić wyrażenie sprzeciwu wobec przetwarzania
+        moich danych w tym celu <em>przed</em> rozpoczęciem przetwarzania - zob.{" "}
+        <a href="https://edpb.europa.eu/system/files/2021-11/edpb_guidelines_082020_on_the_targeting_of_social_media_users_pl_0.pdf">
+          Wytyczne 8/2020 Europejskiej Rady Ochrony Danych dotyczące
+          targetowania użytkowników mediów społecznościowych
+        </a>
+      </p>
+      <p>
+        Niniejszym zwracam się także z żądaniem ujawnienia tożsamości podmiotów,
+        które są właścicielami wyżej wymienionych domen, abym mógł zapoznać się
+        z ich politykami prywatności i zwrócić się do tych podmiotów o usunięcie
+        z ich baz wysłanych przez Państwa stronę moich danych.
+      </p>
+      <p>
+        Proszę też o wysłanie kopii danych zebranych na mój temat i wysłanych do
+        wyżej wymienionych podmiotów.
+      </p>
+      <p>
+        W odpowiedzi proszę się nie powoływać na IAB Europe i ich rzekomą renomę
+        w tworzeniu rozwiązań zgodnych z RODO. IAB chroni interes reklamodawców,
+        a nie Użytkowników, i ich rozwiązania (np. TCF) są{" "}
+        <a href="https://panoptykon.org/search/site/IAB">
+          notorycznie niezgodne z RODO i pozbawione szacunku dla Użytkowników
+        </a>
+        .
+      </p>
+      <p>
+        Apeluję także o wprowadzenie stosownych zmian na stronie tak, aby nie
+        pozostawiać cienia wątpliwości odnośnie tego, na mocy jakiej przesłanki
+        legalizującej dane są przetwarzane przez wspomniane podmioty trzecie,
+        lub tak, aby te dane po prostu nie były wysyłane. Pomoże to zachować
+        prywatność innym użytkownikom Państwa strony. Polecam Państwa uwadze
+        oficjalne wytyczne EROD dotyczące zgody w kontekście RODO:
+        https://edpb.europa.eu/sites/default/files/files/file1/edpb_guidelines_202005_consent_pl.pdf
+        ). Aby na przykład zapobiec automatycznemu wysyłaniu historii
+        przeglądania do podmiotów trzecich przez Państwa stronę, można po prostu
+        ustawić odpowiednio treść nagłówka{" "}
+        <a href="https://developer.mozilla.org/pl/docs/Web/HTTP/Headers/Referrer-Policy">
+          Referrer-Policy{" "}
+        </a>
+        .
+      </p>
+    </div>
+  );
+}

report-window/email-template-2-controls.tsx

@@ -0,0 +1,99 @@
+import React from "react";
+import { Dispatch, SetStateAction } from "react";
+import { toBase64 } from "../util";
+import { EmailTemplate2Config } from "./email-template-2";
+
+export default function EmailTemplate2Controls({
+  config,
+  setConfig,
+}: {
+  config: EmailTemplate2Config;
+  setConfig: Dispatch<SetStateAction<EmailTemplate2Config>>;
+}): JSX.Element {
+  return (
+    <div>
+      <div>
+        <label htmlFor="poup_type">Typ okienka o RODO:</label>
+        <select
+          id="poup_type"
+          value={config.popup_type}
+          onChange={(e) =>
+            setConfig((v) => ({
+              ...v,
+              popup_type: e.target.value as EmailTemplate2Config["popup_type"],
+            }))
+          }
+        >
+          <option value="none">Brak jakiejkolwiek informacji</option>
+          <option value="passive_cookie_banner">
+            Pasywne powiadomienie o cookiesach
+          </option>
+          <option value="consent">Okienko z pytaniem o zgodę</option>
+        </select>
+      </div>
+      {config.popup_type !== "none" ? (
+        <div>
+          <label htmlFor="popup_screenshot">Zrzut ekranu okienka o RODO:</label>
+          <input
+            {...{
+              type: "file",
+              id: "popup_screenshot",
+              onChange: async (e) => {
+                const popup_screenshot_base64 = await toBase64(
+                  e.target.files[0]
+                );
+                setConfig((v) => ({
+                  ...v,
+                  popup_screenshot_base64,
+                }));
+              },
+            }}
+          />
+        </div>
+      ) : (
+        ""
+      )}
+      {config.popup_type === "consent" ? (
+        <div>
+          <label htmlFor="acceptAllName">
+            Tekst na przycisku do zatwierdzania wszystkich zgód:
+          </label>
+          <input
+            {...{
+              type: "text",
+              value: config.popup_accept_all_text,
+              onChange: (e) =>
+                setConfig((v) => ({
+                  ...v,
+                  popup_accept_all_text: e.target.value,
+                })),
+            }}
+          />
+        </div>
+      ) : (
+        ""
+      )}
+      <div>
+        <label htmlFor="popup_action">
+          Czy coś klikn*ł*m w informacjach o RODO?
+        </label>
+        <select
+          id="popup_action"
+          value={config.popup_type}
+          onChange={(e) =>
+            setConfig((v) => ({
+              ...v,
+              popup_action: e.target
+                .value as EmailTemplate2Config["popup_action"],
+            }))
+          }
+        >
+          <option value="ignored">Nic nie klin*ł*m</option>
+          <option value="accepted">
+            Kliknięte „{config.popup_accept_all_text}”
+          </option>
+        </select>
+      </div>
+    </div>
+  );
+}

report-window/email-template-2.tsx

@@ -0,0 +1,332 @@
+import React, { useState } from "react";
+import { RequestCluster } from "../request-cluster";
+import { StolenDataEntry } from "../stolen-data-entry";
+import { getDate, unique } from "../util";
+import DomainSummary from "./domain-summary";
+import EmailTemplate2Controls from "./email-template-2-controls";
+
+export type EmailTemplate2Config = {
+  popup_type: "none" | "passive_cookie_banner" | "consent";
+  popup_action: "ignored" | "accepted";
+  popup_screenshot_base64: string | null;
+  popup_accept_all_text: string;
+};
+
+function ClusterRangeSummary({ cluster }: { cluster: RequestCluster }) {
+  const range = unique(
+    cluster.getMarkedEntries().map((entry) => entry.classification)
+  );
+  const has_cookie_ids = cluster
+    .getMarkedEntries()
+    .filter((entry) => entry.source === "cookie")
+    .some((entry) => entry.classification == "id");
+  return (
+    <>
+      {[
+        range.includes("id")
+          ? "sztucznie nadane id" + (has_cookie_ids ? " z cookie" : "")
+          : "",
+        range.includes("history") ? "część Pańskiej historii przeglądania" : "",
+        range.includes("location") ? "informacje na temat Pana położenia" : "",
+      ]
+        .filter((e) => e !== "")
+        .join(", ")}
+    </>
+  );
+}
+
+function Placeholder({ children }: { children: string }) {
+  return (
+    <span style={{ textDecoration: "underline", fontSize: "0.8em" }}>
+      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
+      <span style={{ color: "gray" }}>({children})</span>
+      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;;
+    </span>
+  );
+}
+
+export default function EmailTemplate2({
+  entries,
+  clusters,
+}: {
+  entries: StolenDataEntry[];
+  clusters: Record<string, RequestCluster>;
+  version: number;
+}): JSX.Element {
+  const [config, setConfig] = useState<EmailTemplate2Config>({
+    popup_type: "none",
+    popup_action: "ignored",
+    popup_screenshot_base64: null,
+    popup_accept_all_text: "Zaakceptuj wszystkie",
+  });
+
+  const visited_url = entries[0].request.originalURL;
+
+  return (
+    <>
+      <EmailTemplate2Controls {...{ config, setConfig }} />
+      <p>
+        Dzień dobry, w dniu {getDate()} odwiedziłem stronę {visited_url}.
+      </p>
+      {config.popup_type === "none" ? (
+        <p>
+          Nie ukazał mi się na stronie żaden mechanizm pozyskujący zgodę na
+          przetwarzanie moich danych osobowych lub umożliwiający mi wyrażenie
+          sprzeciwu wobec przetwarzania przez stronę moich danych osobowych w
+          zakresie wyraczającym poza procesy konieczne do wyświetlenia strony
+        </p>
+      ) : config.popup_type == "passive_cookie_banner" ? (
+        <>
+          <p>Na stronie była widoczna informacja o plikach Cookie. </p>
+          <p>
+            <img {...{ src: config.popup_screenshot_base64 }} />
+          </p>
+        </>
+      ) : (
+        <>
+          <p>
+            Ukazało mi się okienko z informacjami i pytaniami dotyczącymi
+            sposobów, w jaki strona przetwarza moje dane osobowe.{" "}
+          </p>
+          <p>
+            <img {...{ src: config.popup_screenshot_base64 }} />${}
+          </p>
+          <p>
+            $
+            {config.popup_action === "ignored"
+              ? /* HTML */ `Nie kliknąłem żadnego przycisku w tym okienku. W
+                szczególności nie kliknąłem przycisku
+                „${config.popup_accept_all_text}”`
+              : config.popup_action === "accepted"
+              ? `Kliknąlem na widoczną w tym okienku opcję „${config.popup_accept_all_text}”`
+              : ""}
+          </p>
+        </>
+      )}
+      <p>
+        W tym samym czasie rejestrowałem ruch sieciowy generowany przez tę
+        stronę za pomocą narzędzi w przeglądarce Firefox. Okazało się, że
+        Państwa strona wysłała była moje dane osobowe do następujących
+        podmiotów:
+      </p>
+      <ul>
+        {Object.values(clusters)
+          .filter((cluster) => cluster.hasMarks())
+          .map((cluster) => (
+            <DomainSummary cluster={cluster} />
+          ))}
+      </ul>
+      {config.popup_action === "ignored" ? (
+        <p>Dane te zostały wysłane zanim kliknąłem cokolwiek na tej stronie.</p>
+      ) : config.popup_action === "accepted" ? (
+        <p>
+          Dane te zostały wysłane po tym, jak kliknąłem przycisk „
+          {config.popup_accept_all_text}”
+        </p>
+      ) : (
+        ""
+      )}
+      <p>
+        W załączeniu przesyłam zrzuty ekranu, które dokumentują fakt wysłania
+        tych danych przez Państwa stronę.{" "}
+      </p>
+      <h3>Podstawa prawna</h3>
+      <p>
+        W kontekście stron internetowych są właściwie dopuszczalne tylko trzy z
+        sześciu wymienionych w Art. 6 pkt 1 RODO podstaw prawne dla
+        przetwarzania danych osobowych:
+      </p>
+      <ol>
+        <li>
+          „Zgoda” &mdash; osoba, której dane dotyczą wyraziła zgodę na
+          przetwarzanie swoich danych osobowych w jednym lub większej liczbie
+          określonych celów (<em>Art. 6 pkt 1 lit. a)</em>).
+        </li>
+        <li>
+          „Niezbędność” &mdash; przetwarzanie jest niezbędne do wykonania umowy,
+          której stroną jest osoba, której dane dotyczą, lub do podjęcia działań
+          na żądanie osoby, której dane dotyczą, przed zawarciem umowy (
+          <em>Art. 6 pkt 1 lit. b)</em>);{" "}
+        </li>
+        <li>
+          „Uzasadniony Interes” &mdash; przetwarzanie jest niezbędne do celów
+          wynikających z prawnie uzasadnionych interesów realizowanych przez
+          administratora lub przez stronę trzecią, z wyjątkiem sytuacji, w
+          których nadrzędny charakter wobec tych interesów mają interesy lub
+          podstawowe prawa i wolności osoby, której dane dotyczą, wymagające
+          ochrony danych osobowych, w szczególności gdy osoba, której dane
+          dotyczą, jest dzieckiem (<em>Art. 6 pkt 1 lit. f)</em>
+          );
+        </li>
+      </ol>
+      <p>
+        W przypadku opisywanej przeze mnie mojej wizyty na Państwa stronie nie
+        ma zastosowania „Zgoda”, gdyż{" "}
+        {config.popup_action === "ignored"
+          ? `nie wyrażałem żadnej zgody na takie przetwarzanie moich danych`
+          : /* HTML */ `o ile po wejściu na stronę wcisnąłem w wyskakującym
+            okienku przycisk „${config.popup_accept_all_text}”, o tyle nie
+            stanowi to według mnie ważnej w świetle RODO zgody, gdyż brakowało w
+            tym okienku równie łatwo osiągalnego przycisku, którego kliknięcie
+            skutkowałoby zasygnalizowaniem braku mojej zgody na takie
+            przetwarzanie moich danych. Mówiąc wprost &mdash; wyrażenie „zgody”
+            było łatwiejsze niż jej niewyrażenie. Niewyrażenie zgody wiąże się z
+            negatywną konsekwencją konieczności przechodzenia przez dodatkowe
+            kroki w wyskakującym okienku. Zatem tak otrzymana przez Państwo moja
+            „zgoda” nie jest poprawną podstawą prawną do przetwarzania moich
+            danych osobowych, gdyż nie spełnia warunku dobrowolności
+            wspomnianego w Art. 4. pkt 11. RODO`}
+        . Za zgodę nie można też uznać posiadania włączonej obsługi cookies w
+        przeglądarce, jakichkolwiek innych ustawień przeglądarki, ani pasywnych
+        działań z mojej strony (np. „kontynuowanie korzystania ze strony”).
+      </p>
+      <p>
+        W mojej ocenie „Niezbędność“ nie ma zastosowania co do opisanych powyżej
+        sposobów przetwarzania danych. Nie widzę, co miałoby sprawiać, aby
+        wysyłanie moich danych osobowych do wspomnianych powyżej podmiotów
+        trzecich było konieczne do wyświetlenia Państwa strony na ekranie mojego
+        komputera (zob.{" "}
+        <a href="https://edpb.europa.eu/system/files/2021-11/edpb_guidelines_082020_on_the_targeting_of_social_media_users_pl_0.pdf">
+          Wytyczne 8/2020 EROD dotyczące targetowania użytkowników mediów
+          społecznościowych
+        </a>
+        , par. 49);.{" "}
+      </p>
+      <p>
+        Pozostaje zatem „Uzasadniony Interes”. Aby Administrator mógł używać
+        uzasadnionego interesu jako podstawy prawnej targetowania użytkowników
+        Sieci, muszą zostać spełnione m.in. następujące warunki:{" "}
+      </p>
+      <ol>
+        <li>
+          Administrator danych lub podmiot trzeci, któremu dane są ujawniane
+          musi faktycznie realizować dany konkretny uzasadniony interes (
+          <a href="https://curia.europa.eu/juris/document/document.jsf?text=&docid=216555&pageIndex=0&doclang=PL&mode=lst&dir=&occ=first&part=1&cid=1254905">
+            Wyrok TSUE z dnia 29 lipca 2019 r. w sprawie Fashion ID, C-40/17,
+            ECLI:EU:C:2019:629
+          </a>
+          , pkt 95.)
+        </li>
+        <li>
+          Takie przetwarzanie danych jest konieczne dla potrzeb wynikających z
+          danego uzasadnionego interesu (
+          <a href="https://curia.europa.eu/juris/document/document.jsf?text=&docid=216555&pageIndex=0&doclang=PL&mode=lst&dir=&occ=first&part=1&cid=1254905">
+            Wyrok TSUE z dnia 29 lipca 2019 r. w sprawie Fashion ID, C-40/17,
+            ECLI:EU:C:2019:629
+          </a>
+          , pkt 95.)
+        </li>
+        <li>
+          Wybrany uzasadniony interes musi mieć pierwszeństwo nad prawami i
+          wolnościami osoby, której dotyczą przetwarzane dane (
+          <a href="https://curia.europa.eu/juris/document/document.jsf?text=&docid=216555&pageIndex=0&doclang=PL&mode=lst&dir=&occ=first&part=1&cid=1254905">
+            Wyrok TSUE z dnia 29 lipca 2019 r. w sprawie Fashion ID, C-40/17,
+            ECLI:EU:C:2019:629
+          </a>
+          , pkt 95.)
+        </li>
+        <li>
+          Osoby, których dane dotyczą, powinny mieć możliwość wyrażenia
+          sprzeciwu wobec przetwarzania ich danych do celów związanych z
+          targetowaniem <em>przed</em> rozpoczęciem przetwarzania (zob.{" "}
+          <a href="https://edpb.europa.eu/system/files/2021-11/edpb_guidelines_082020_on_the_targeting_of_social_media_users_pl_0.pdf">
+            Wytyczne 8/2020 EROD dotyczące targetowania użytkowników mediów
+            społecznościowych
+          </a>
+          , par. 54);
+        </li>
+      </ol>
+      {config.popup_action !== "accepted" ? (
+        <p>
+          Moje dane zostały ujawnione podmiotom trzecim tuż po włączeniu strony,
+          zatem nie jest spełniony warunek 4. Apeluję o wdrożenie zmian na
+          stronie, które sprawią, że dopiero po świadomym niewyrażeniu sprzeciwu
+          przez użytkownika aktywowane są procesy przetwarzania danych
+          osobowych, których podstawą prawną jest uzasadniony interes.
+        </p>
+      ) : (
+        ""
+      )}
+      <p>
+        Jeżeli istnieją jednak inne niż uzasadniony interes ważne podstawy
+        prawne do takiego przetwarzania moich danych osobowych przez Państwa
+        stronę, proszę o ich wskazanie,{" "}
+        <em>dla każdego z wymienionych podmiotów z osobna</em>. W przeciwnym
+        wypadku, aby ustalić, czy moje dane były przez Państwa przetwarzane na
+        mocy uzasadnionego interesu zgodnie z prawem, proszę o wypełnienie
+        następującego szablonu (lub udzielenie tych samych informacji w innej
+        postaci, przy zachowaniu zakresu i szczegółowości informacji:
+      </p>
+      <div style={{ border: "1px solid black", padding: "1rem" }}>
+        <p>
+          W dniu {getDate()} strona {visited_url}:
+        </p>
+        <ul>
+          {Object.values(clusters)
+            .filter((cluster) => cluster.hasMarks())
+            .map((cluster) => (
+              <li key={cluster.id}>
+                ujawniła pańskie dane w zakresie{" "}
+                <em>
+                  <ClusterRangeSummary {...{ cluster }} />
+                </em>{" "}
+                firmie <Placeholder>nazwa firmy</Placeholder>, która jest
+                właścicielem domeny <strong>{cluster.id}</strong> i swoją
+                politykę prywatności publikuje pod adresem{" "}
+                <Placeholder>
+                  adres URL polityki prywatności tej firmy
+                </Placeholder>
+                . Podstawą prawną takiego przetwarzania danych przez naszą
+                stronę jest uzasadniony interes:{" "}
+                <Placeholder>
+                  na czym polega ten uzasadniony interes, tzn. bieżące działania
+                  podejmowane przez podmiot realizujący ten interes lub korzyści
+                  dla podmiotu realizującego ten interes oczekiwane w bardzo
+                  bliskiej przyszłości
+                </Placeholder>{" "}
+                realizowany przez{" "}
+                <Placeholder>
+                  kogo? jaki podmiot podejmuje wspomniane działania lub jest
+                  beneficjentem wspomnianych korzyści?
+                </Placeholder>
+                . Ujawnienie tych danych temu podmiotowi przez naszą stronę było
+                konieczne dla potrzeb wynikających z tego interesu, ponieważ
+                <Placeholder>uzasadnienie konieczności</Placeholder>.<br />
+              </li>
+            ))}
+        </ul>
+      </div>
+      <p>
+        Proszę w szczególności zwrócić uwagę na podanie adresów do polityk
+        prywatności tych firm, abym wiedział, jak skontaktować się z nimi i
+        wnioskować o usunięcie z ich baz wysłanych przez Państwa stronę moich
+        danych. )
+      </p>
+      <p>
+        W odpowiedzi proszę się nie powoływać na IAB Europe i ich rzekomą renomę
+        w tworzeniu rozwiązań zgodnych z RODO. IAB chroni interes reklamodawców,
+        a nie Użytkowników, i ich rozwiązania (np. TCF) są{" "}
+        <a href="https://panoptykon.org/search/site/IAB">
+          notorycznie niezgodne z RODO i pozbawione szacunku dla Użytkowników
+        </a>
+        .
+      </p>
+      <p>
+        Apeluję także o wprowadzenie stosownych zmian na stronie tak, aby nie
+        pozostawiać cienia wątpliwości odnośnie tego, na mocy jakiej przesłanki
+        legalizującej dane są przetwarzane przez wspomniane podmioty trzecie,
+        lub tak, aby te dane po prostu nie były wysyłane. Pomoże to zachować
+        prywatność innym użytkownikom Państwa strony. Polecam Państwa uwadze
+        oficjalne wytyczne EROD dotyczące zgody w kontekście RODO:
+        https://edpb.europa.eu/sites/default/files/files/file1/edpb_guidelines_202005_consent_pl.pdf
+        ). Aby na przykład zapobiec automatycznemu wysyłaniu historii
+        przeglądania do podmiotów trzecich przez Państwa stronę, można po prostu
+        ustawić odpowiednio treść nagłówka{" "}
+        <a href="https://developer.mozilla.org/pl/docs/Web/HTTP/Headers/Referrer-Policy">
+          Referrer-Policy{" "}
+        </a>
+        .
+      </p>
+    </>
+  );
+}

report-window/email-template.tsx

@@ -1,215 +1,33 @@
 import React, { useState } from "react";
 import { RequestCluster } from "../request-cluster";
 import { StolenDataEntry } from "../stolen-data-entry";
-import { getDate, toBase64 } from "../util";
+import EmailTemplate1 from "./email-template-1";
-import DomainSummary from "./domain-summary";
+import EmailTemplate2 from "./email-template-2";
-
-type PopupState = "not_clicked" | "clicked_but_no_reject_all";
 
 export default function EmailTemplate({
   entries,
   clusters,
+  version,
 }: {
   entries: StolenDataEntry[];
   clusters: Record<string, RequestCluster>;
   version: number;
-}): JSX.Element {
+}) {
-  const [popupState, setPopupState] = useState<PopupState>("not_clicked");
+  const [templateVersion, setTemplateVersion] = useState("2");
-  const [acceptAllName, setAcceptAllName] = useState<string>(
-    "Zaakceptuj wszystkie"
-  );
-  const [popupScreenshotBase64, setPopupScreenshotBase64] = useState<string>(
-    null
-  );
-
   return (
     <div>
-      <label htmlFor="popupState">Status okienka o rodo:</label>
       <select
-        id="popupState"
+        value={templateVersion}
-        value={popupState}
+        onChange={(e) => setTemplateVersion(e.target.value)}
-        onChange={(e) => setPopupState(e.target.value as PopupState)}
       >
-        <option value="not_clicked">Nic nie kliknięte</option>
+        <option value="1">wersja 1</option>
-        <option value="clicked_but_no_reject_all">
+        <option value="2">wersja 2</option>
-          Kliknięte "akceptuj wszystkie", ale nie było opcji "Odrzuć wszystkie"
-        </option>
       </select>
-      {popupState === "clicked_but_no_reject_all" ? (
+      {templateVersion === "1" ? (
-        <>
+        <EmailTemplate1 {...{ entries, clusters, version }} />
-          <div>
+      ) : (
-            <label htmlFor="acceptAllName">
+        <EmailTemplate2 {...{ entries, clusters, version }} />
-              Tekst na przycisku do zatwierdzania wszystkich zgód:
+      )}
-            </label>
-            <input
-              {...{
-                type: "text",
-                value: acceptAllName,
-                onChange: (e) => setAcceptAllName(e.target.value),
-              }}
-            />
-          </div>
-          <div>
-            <label htmlFor="popup-screenshot">
-              Zrzut ekranu z tego, jak wyglądał popup przed kliknięciem „
-              {acceptAllName}”:
-            </label>
-            <input
-              {...{
-                type: "file",
-                id: "popup-screenshot",
-                onChange: async (e) => {
-                  setPopupScreenshotBase64(await toBase64(e.target.files[0]));
-                },
-              }}
-            />
-          </div>
-        </>
-      ) : null}
-      <p>
-        Dzień dobry, w dniu {getDate()} odwiedziłem stronę{" "}
-        {entries[0].request.originalURL}. Strona ta wysłała moje dane osobowe do
-        podmiotów trzecich - bez mojej zgody.{" "}
-      </p>
-      <ul>
-        {Object.values(clusters)
-          .filter((cluster) => cluster.hasMarks())
-          .map((cluster) => (
-            <DomainSummary cluster={cluster} />
-          ))}
-      </ul>
-      <p>
-        {" "}
-        Dane te zostały wysłane przez Państwa stronę - a mówiąc dokładniej,
-        przez zamieszczone przez Państwa na tej stronie skrypty.
-      </p>
-      {popupState === "not_clicked" ? (
-        <p>
-          Nastąpiło to, zanim zdążyłem w ogóle przeczytać treść wyskakującego
-          okienka ze zgodami i zanim miałem szansę wyrazić sprzeciw takiemu
-          przetwarzaniu danych osobowych.
-        </p>
-      ) : null}
-      {popupState === "clicked_but_no_reject_all" ? (
-        <p>
-          O ile po wejściu na stronę wcisnąłem w wyskakującym okienku przycisk „
-          {acceptAllName}”, o tyle nie stanowi to według mnie ważnej w świetle
-          RODO zgody, gdyż brakowało w tym okienku równie łatwo osiągalnego
-          przycisku, którego kliknięcie skutkowałoby zasygnalizowaniem braku
-          mojej zgody na takie przetwarzanie moich danych. Mówiąc wprost -
-          wyrażenie „zgody” było łatwiejsze niż jej niewyrażenie. Niewyrażenie
-          zgody wiąże się z negatywną konsekwencją konieczności przechodzenia
-          przez dodatkowe kroki w wyskakującym okienku. Zatem tak otrzymana
-          przez Państwo moja „zgoda” nie jest poprawną podstawą prawną do
-          przetwarzania moich danych osobowych, gdyż nie spełnia warunku
-          dobrowolności wspomnianego w Art. 4. pkt 11{" "}
-          <em>
-            rozporządzenia Parlamentu Europejskiego i Rady (UE) 2016/679 z dnia
-            27 kwietnia 2016 r. w sprawie ochrony osób fizycznych w związku z
-            przetwarzaniem danych osobowych i w sprawie swobodnego przepływu
-            takich danych oraz uchylenia dyrektywy 95/46/WE
-          </em>
-          .{<img {...{ src: popupScreenshotBase64 }} />}
-        </p>
-      ) : null}
-      <p>
-        Udokumentowałem to na zrzutach ekranu z mojej przeglądarki internetowej,
-        które to zrzuty przesyłam w załączeniu.
-      </p>
-      <p>
-        Wiem, że nie wszystkie rodzaje przetwarzania danych wymagają zgody
-        użytkownika. W kontekście stron internetowych z wymienionych w Art. 6.
-        pkt 1. RODO mogą mieć zastosowanie albo „zgoda” (Art. 6. pkt 1. lit.
-        a)), albo niezbędność tego przetwarzania do wykonania umowy (Art. 6. pkt
-        1. lit. b)), albo uzasadniony interes (Art. 6. pkt 1. lit. f)). Wiem
-        też, że każda z tych podstaw prawnych ma moc dopiero po spełnieniu
-        określonych warunków.
-      </p>
-      <p>
-        Nie widzę ważnej podstawy prawnej legalizującej procesy przetwarzania
-        moich danych osobowych, jakie wymieniłem powyżej (na pewno nie jest to
-        przetwarzanie konieczne do wyświetlenia strony z technicznego punktu
-        widzenia). Jeżeli takie przesłanki legalizujące jednak występują, proszę
-        o ich wskazanie,
-        <strong>
-          {" "}
-          dla każdego z celów i podmiotów z <em>osobna</em>
-        </strong>
-        .
-      </p>
-      <p>
-        Jeżeli wskazaną przez Państwa przesłanką legalizującą dany element
-        procesu przetwarzania danych osobowych przez Państwa stronę jest Art 6.
-        pkt 1 lit. a) RODO (zgoda), na mocy Art. 7 pkt 1 RODO proszę o
-        wykazanie, że udzieliłem Państwu zgodę na takie przetwarzanie moich
-        danych osobowych zanim to przetwarzanie nastąpiło, oraz że ta zgoda jest
-        ważna w świetle RODO (odnosząc się w szczególności do art. 7 ust. 3
-        RODO). Z góry zaznaczam, że „ustawienia przeglądarki” nie stanowią
-        ważnej w świetle RODO zgody.
-      </p>
-      <p>
-        Jeżeli wskazaną przez Państwa przesłanką legalizującą dany element
-        procesu przetwarzania danych osobowych przez Państwa stronę jest Art 6.
-        pkt 1 lit. b) RODO (niezbędność takiego przetwarzania do wykonania
-        umowy), proszę o wskazanie, w jaki sposób ta konieczność zachodzi, oraz
-        co sprawia, że Państwa zdaniem nie można wykonać umowy związanej z
-        wyświetleniem Państwa strony bez przekazywania sztucznie nadanego ID w
-        plikach Cookies lub historii przeglądania w nagłówku Referer do
-        wskazanych podmiotów trzecich.
-      </p>
-      <p>
-        Jeżeli wskazaną przez Państwa przesłanką legalizującą dany element
-        procesu przetwarzania danych osobowych przez Państwa stronę jest Art 6.
-        pkt 1 lit. f) RODO (uzasadniony interes), proszę o wskazanie, jaki to
-        jest <strong>konkretny interes</strong> (prosze o bardziej dokładny opis
-        niż np. tylko "marketing"), oraz o wynik testu równowagi pomiędzy
-        Państwa interesem a moimi podstawowymi wolnościami i prawami - ze
-        wskazaniem tego, co sprawia, że w Państwa ocenie Państwa uzasadniony
-        interes przeważa moje prawa i interesy w kontekście wspomnianych powyżej
-        procesów przetwarzania danych. Proszę też pamiętać, że aby w ramach
-        danego celu przetwarzania powołać się na prawnie uzasadniony interes,
-        powinni mi Państo umożliwić wyrażenie sprzeciwu wobec przetwarzania
-        moich danych w tym celu <em>przed</em> rozpoczęciem przetwarzania - zob.{" "}
-        <a href="https://edpb.europa.eu/system/files/2021-11/edpb_guidelines_082020_on_the_targeting_of_social_media_users_pl_0.pdf">
-          Wytyczne 8/2020 Europejskiej Rady Ochrony Danych dotyczące
-          targetowania użytkowników mediów społecznościowych
-        </a>
-      </p>
-      <p>
-        Niniejszym zwracam się także z żądaniem ujawnienia tożsamości podmiotów,
-        które są właścicielami wyżej wymienionych domen, abym mógł zapoznać się
-        z ich politykami prywatności i zwrócić się do tych podmiotów o usunięcie
-        z ich baz wysłanych przez Państwa stronę moich danych.
-      </p>
-      <p>
-        Proszę też o wysłanie kopii danych zebranych na mój temat i wysłanych do
-        wyżej wymienionych podmiotów.
-      </p>
-      <p>
-        W odpowiedzi proszę się nie powoływać na IAB Europe i ich rzekomą renomę
-        w tworzeniu rozwiązań zgodnych z RODO. IAB chroni interes reklamodawców,
-        a nie Użytkowników, i ich rozwiązania (np. TCF) są{" "}
-        <a href="https://panoptykon.org/search/site/IAB">
-          notorycznie niezgodne z RODO i pozbawione szacunku dla Użytkowników
-        </a>
-        .
-      </p>
-      <p>
-        Apeluję także o wprowadzenie stosownych zmian na stronie tak, aby nie
-        pozostawiać cienia wątpliwości odnośnie tego, na mocy jakiej przesłanki
-        legalizującej dane są przetwarzane przez wspomniane podmioty trzecie,
-        lub tak, aby te dane po prostu nie były wysyłane. Pomoże to zachować
-        prywatność innym użytkownikom Państwa strony. Polecam Państwa uwadze
-        oficjalne wytyczne EROD dotyczące zgody w kontekście RODO:
-        https://edpb.europa.eu/sites/default/files/files/file1/edpb_guidelines_202005_consent_pl.pdf
-        ). Aby na przykład zapobiec automatycznemu wysyłaniu historii
-        przeglądania do podmiotów trzecich przez Państwa stronę, można po prostu
-        ustawić odpowiednio treść nagłówka{" "}
-        <a href="https://developer.mozilla.org/pl/docs/Web/HTTP/Headers/Referrer-Policy">
-          Referrer-Policy{" "}
-        </a>
-        .
-      </p>
     </div>
   );
 }