mark.ts

@@ -1,32 +0,0 @@
-import { Classifications, StolenDataEntry } from "./stolen-data-entry";
-
-export default class Mark {
-  classification: keyof typeof Classifications;
-  constructor(public entry: StolenDataEntry, public key: string) {
-    this.classification = entry.classification;
-  }
-
-  getParsedValue() {
-    return this.entry.getParsedValue(this.key);
-  }
-
-  get shorthost() {
-    return this.entry.request.shorthost;
-  }
-
-  get source() {
-    return this.entry.source;
-  }
-
-  get name() {
-    return this.entry.name;
-  }
-
-  get originalURL() {
-    return this.entry.request.originalURL;
-  }
-
-  get valuePreview(): string {
-    return this.entry.getValuePreview(this.key);
-  }
-}

memory.ts

@@ -1,11 +1,10 @@
 import ExtendedRequest from "./extended-request";
-import { getshorthost, makeThrottle } from "./util";
+import { getshorthost } from "./util";
 import { EventEmitter } from "events";
 import { RequestCluster } from "./request-cluster";
 
 export default class Memory extends EventEmitter {
   origin_to_history = {} as Record<string, Record<string, RequestCluster>>;
-  private throttle = makeThrottle(200);
   async register(request: ExtendedRequest) {
     await request.init();
     console.log("registering request for", request.origin);
@@ -35,20 +34,6 @@ export default class Memory extends EventEmitter {
     );
   }
 
-  emit(eventName: string, immediate = false) {
-    try {
-      if (immediate) {
-        super.emit(eventName);
-        return;
-      } else {
-        this.throttle(() => super.emit(eventName));
-      }
-      return true;
-    } catch (e) {
-      debugger;
-    }
-  }
-
   getClustersForOrigin(origin: string): Record<string, RequestCluster> {
     return this.origin_to_history[origin] || {};
   }

report-window/domain-summary.tsx

@@ -5,7 +5,6 @@ import { Classifications, Sources } from "../stolen-data-entry";
 const emailClassifications: Record<keyof typeof Classifications, string> = {
   id: "sztucznie nadane mi ID",
   history: "część mojej historii przeglądania",
-  location: "informacje na temat mojej lokalizacji geograficznej",
 };
 
 const emailSources: Record<Sources, string> = {
@@ -26,22 +25,22 @@ export default function DomainSummary({
       <ul>
         <li>Mój adres IP</li>
         {cluster
-          .getMarks()
+          .getMarkedEntries()
-          .sort((markA, markB) =>
+          .sort((entryA, entryB) => (entryA.value > entryB.value ? -1 : 1))
-            markA.entry.value > markB.entry.value ? -1 : 1
+          .reduce((acc, entry, index, arr) => {
-          )
+            if (index === 0) {
-          .map((mark) => (
+              return [entry];
+            }
+            if (entry.value != arr[index - 1].value) {
+              acc.push(entry);
+            }
+            return acc;
+          }, [])
+          .map((entry) => (
             <li>
-              {emailClassifications[mark.classification]}{" "}
+              {emailClassifications[entry.classification]}{" "}
-              {emailSources[mark.source]} (nazwa: {mark.name},{" "}
+              {emailSources[entry.source]}
-              {mark.key ? (
+              &nbsp;(<code>{entry.name.trim()}</code>)
-                <>
-                  pozycja <code>{mark.key}</code>,
-                </>
-              ) : (
-                ""
-              )}
-              wartość: <code>{mark.valuePreview}</code>)
             </li>
           ))}
       </ul>

report-window/email-template.tsx

@@ -1,27 +1,24 @@
 import React, { useState } from "react";
-import Mark from "../mark";
 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_invalid";
 
 export default function EmailTemplate({
-  marks,
+  marked_entries,
   clusters,
-  version,
 }: {
-  marks: Mark[];
+  marked_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>(
+  const [popupScreenshotBase64, setPopupScreenshotBase64] =
-    null
+    useState<string>(null);
-  );
 
   return (
     <div>
@@ -67,8 +64,8 @@ export default function EmailTemplate({
       ) : null}
       <p>
         Dzień dobry, w dniu {getDate()} odwiedziłem stronę{" "}
-        {marks[0].originalURL}. Strona ta wysłała moje dane osobowe do podmiotów
+        {marked_entries[0].request.originalURL}. Strona ta wysłała moje dane
-        trzecich - bez mojej zgody.{" "}
+        osobowe do podmiotów trzecich - bez mojej zgody.{" "}
       </p>
       <ul>
         {Object.values(clusters)
@@ -77,15 +74,10 @@ export default function EmailTemplate({
             <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
+          Dane te zostały wysłane przez Państwa stronę, zanim zdążyłem w ogóle
-          okienka ze zgodami.
+          przeczytać treść wyskakującego okienka ze zgodami.
         </p>
       ) : null}
       {popupState === "clicked_but_invalid" ? (
@@ -153,10 +145,12 @@ export default function EmailTemplate({
         procesów przetwarzania danych.
       </p>
       <p>
-        Niniejszym zwracam się także z żądaniem ujawnienia tożsamości podmiotów,
+        Niniejszym zwracam się także z żądaniem wycofania przesłanych przez
-        które są właścicielami wyżej wymienionych domen, abym mógł zapoznać się
+        Państwa stronę moich danych osobowych z baz wyżej wymienionych podmiotów
-        z ich politykami prywatności i zwrócić się do tych podmiotów o usunięcie
+        oraz przesłania potwierdzenia uwiarygadniającego pomyślne wycofanie tych
-        z ich baz wysłanych przez Państwa stronę moich danych.
+        danych. Proszę też o przesłanie 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.
       </p>
       <p>
         Proszę też o wysłanie kopii danych zebranych na mój temat i wysłanych do

report-window/har-converter.tsx

@@ -1,18 +1,20 @@
-import React, { useEffect, useState } from "react";
+import React, { useState } from "react";
 import { HAREntry } from "../extended-request";
-import Mark from "../mark";
+import { StolenDataEntry } from "../stolen-data-entry";
 import { getshorthost, unique } from "../util";
 
 function handleNewFile(
   element: HTMLInputElement,
-  marks: Mark[],
+  marked_entries: StolenDataEntry[],
   setFiltered: (Blob) => void
 ): void {
   const reader = new FileReader();
   reader.addEventListener("load", () => {
     const content = JSON.parse(reader.result as string);
     content.log.entries = content.log.entries.filter((har_entry: HAREntry) =>
-      marks.some((mark) => mark.entry.matchesHAREntry(har_entry))
+      marked_entries.some((stolen_entry) =>
+        stolen_entry.matchesHAREntry(har_entry)
+      )
     );
     setFiltered(
       new Blob([JSON.stringify(content)], { type: "application/json" })
@@ -21,8 +23,8 @@ function handleNewFile(
   reader.readAsText(element.files[0]);
 }
 
-function generateFakeHAR(marks: Mark[]) {
+function generateFakeHAR(marked_entries: StolenDataEntry[]) {
-  const requests = marks.map((mark) => mark.entry.request);
+  const requests = marked_entries.map((entry) => entry.request);
   return {
     log: {
       version: "1.2",
@@ -50,14 +52,14 @@ function generateFakeHAR(marks: Mark[]) {
   };
 }
 
-export default function HARConverter({ marks }: { marks: Mark[] }) {
+export default function HARConverter({
+  marked_entries,
+}: {
+  marked_entries: StolenDataEntry[];
+}) {
   const [filtered, setFiltered] = useState<Blob | null>(null);
   const [filename, setFilename] = useState("");
-  const [fakeHAR, setFakeHAR] = useState<ReturnType<typeof generateFakeHAR>>();
+  const fakeHAR = generateFakeHAR(marked_entries);
-  useEffect(() => {
-    setFakeHAR(generateFakeHAR(marks));
-  }, []);
-
   return (
     <div>
       <input
@@ -65,7 +67,7 @@ export default function HARConverter({ marks }: { marks: Mark[] }) {
         accept=".har"
         onChange={(e) => {
           setFilename(e.target.files[0].name);
-          handleNewFile(e.target, marks, setFiltered);
+          handleNewFile(e.target, marked_entries, setFiltered);
         }}
       />
       {(filtered && (
@@ -82,7 +84,7 @@ export default function HARConverter({ marks }: { marks: Mark[] }) {
           new Blob([JSON.stringify(fakeHAR)], { type: "application/json" })
         )}
         download={`${getshorthost(
-          marks[0].originalURL
+          marked_entries[0].request.originalURL
         )}-${new Date().toJSON()}-trimmed.har`}
       >
         Pobierz "zfałszowany" HAR

report-window/report-window.tsx

@@ -1,8 +1,6 @@
 import React from "react";
 import ReactDOM from "react-dom";
 import { getMemory } from "../memory";
-import { Classifications } from "../stolen-data-entry";
-import { reduceConcat, useEmitter } from "../util";
 import EmailTemplate from "./email-template";
 import HARConverter from "./har-converter";
 
@@ -10,20 +8,14 @@ function Report() {
   const origin = new URL(document.location.toString()).searchParams.get(
     "origin"
   );
-  const [counter, setCounter] = useEmitter(getMemory());
-  function refresh() {
-    setCounter((c) => c + 1);
-  }
   const clusters = getMemory().getClustersForOrigin(origin);
-  const marks = Object.values(clusters)
+  const marked_entries = Object.values(clusters)
     .map((cluster) => cluster.getMarkedRequests())
-    .reduce(reduceConcat, [])
+    .reduce((a, b) => a.concat(b), [])
     .map((request) => request.getMarkedEntries())
-    .reduce(reduceConcat, [])
+    .reduce((a, b) => a.concat(b), []);
-    .map((entry) => entry.marks)
-    .reduce(reduceConcat, []);
   return (
-    <div {...{ "data-version": counter }}>
+    <div>
       <h1>Generuj treść maila dla {origin}</h1>
       <table>
         <thead>
@@ -35,46 +27,34 @@ function Report() {
           </tr>
         </thead>
         <tbody>
-          {marks.map((mark) => (
+          {marked_entries.map((entry) => (
             <tr
-              key={mark.entry.request.originalURL + ";" + mark.key}
               style={{
                 backgroundColor:
-                  mark.classification == "id" ? "yellow" : "white",
+                  entry.classification == "id" ? "yellow" : "white",
               }}
             >
-              <td>{mark.shorthost}</td>
+              <td>{entry.request.shorthost}</td>
               <td style={{ overflowWrap: "anywhere" }}>
-                {mark.source}:{mark.name}
+                {entry.source}:{entry.name}
-                {mark.key}
+                {entry.markedKeys.join(",")}
               </td>
               <td
                 style={{
                   width: "400px",
                   overflowWrap: "anywhere",
-                  backgroundColor: mark.entry.isRelatedToID()
+                  backgroundColor: entry.isRelatedToID()
                     ? "#ffff0054"
                     : "white",
                 }}
               >
-                {mark.valuePreview}
+                {entry.value}
-                {/* always gonna have
-                one key, because unwrapEntry is calle above */}
               </td>
               <td>
-                <select
+                <select value={entry.classification}>
-                  value={mark.classification}
-                  onChange={(e) => {
-                    mark.classification = e.target
-                      .value as keyof typeof Classifications;
-                    console.log("changed classification!");
-                    refresh();
-                  }}
-                >
                   {[
                     ["history", "Historia przeglądania"],
                     ["id", "Sztucznie nadane id"],
-                    ["location", "Lokalizacja"],
                   ].map(([key, name]) => (
                     <option key={key} value={key}>
                       {name}
@@ -86,8 +66,8 @@ function Report() {
           ))}
         </tbody>
       </table>
-      <EmailTemplate {...{ marks, clusters, version: counter }} />
+      <EmailTemplate {...{ marked_entries, clusters }} />
-      <HARConverter {...{ marks }} />
+      <HARConverter {...{ marked_entries }} />
     </div>
   );
 }

request-cluster.ts

@@ -105,7 +105,7 @@ export class RequestCluster extends EventEmitter {
     return this.requests.some((request) => request.hasMark());
   }
 
-  getMarkedEntries(): StolenDataEntry[] {
+  getMarkedEntries() {
     return this.requests
       .map((request) => request.getMarkedEntries())
       .reduce(reduceConcat, []);
@@ -114,12 +114,4 @@ export class RequestCluster extends EventEmitter {
   exposesOrigin() {
     return this.requests.some((request) => request.exposesOrigin());
   }
-
-  getMarks() {
-    return this.requests
-      .map((request) => request.getMarkedEntries())
-      .reduce(reduceConcat, [])
-      .map((entry) => entry.marks)
-      .reduce(reduceConcat, []);
-  }
 }

sidebar/stolen-data-cluster.tsx

@@ -118,14 +118,7 @@ export default function StolenDataCluster({
                 key={origin + cluster.id + entry.getUniqueKey()}
                 data-key={origin + cluster.id + entry.getUniqueKey()}
               >
-                <th
+                <th style={{ width: "100px", overflowWrap: "anywhere" }}>
-                  style={{
-                    width: "100px",
-                    overflowWrap: "anywhere",
-                    border: entry.hasMark("") ? "2px solid red" : "",
-                  }}
-                  onClick={() => entry.addMark("")}
-                >
                   {entry.getNames().map(hyphenate).join(", ")}
                 </th>
                 <td>{entry.getSources().map((source) => icons[source])}</td>

stolen-data-entry.ts

@@ -1,6 +1,5 @@
 import { TCModel } from "@iabtcf/core";
 import ExtendedRequest, { HAREntry } from "./extended-request";
-import Mark from "./mark";
 import { getMemory } from "./memory";
 import {
   getshorthost,
@@ -16,11 +15,8 @@ export type Sources = "cookie" | "pathname" | "queryparams" | "header";
 export const Classifications = <const>{
   id: "Sztucznie nadane ID",
   history: "Część historii przeglądania",
-  location: "Informacje na temat mojego położenia",
 };
 
-const ID_PREVIEW_MAX_LENGTH = 20;
-
 const id = (function* id() {
   let i = 0;
   while (true) {
@@ -33,7 +29,7 @@ export class StolenDataEntry {
   public isIAB = false;
   public iab: TCModel | null = null;
   public id: number;
-  public marks: Mark[] = [];
+  public markedKeys: string[] = [];
   public classification: keyof typeof Classifications;
 
   constructor(
@@ -82,7 +78,6 @@ export class StolenDataEntry {
     } else if (isURL(value)) {
       const url = new URL(value);
       const object = {
-        [Symbol.for("originalURL")]: value,
         host: url.host,
         path: url.pathname,
         ...Object.fromEntries(
@@ -97,7 +92,7 @@ export class StolenDataEntry {
     }
   }
 
-  getParsedValue(key_path: string): string | Record<string | symbol, unknown> {
+  getParsedValue(key_path: string): string | Record<string, unknown> {
     let object = StolenDataEntry.parseValue(this.value);
     for (const key of key_path.split(".")) {
       if (key === "") continue;
@@ -107,20 +102,20 @@ export class StolenDataEntry {
   }
 
   addMark(key: string) {
-    this.marks.push(new Mark(this, key));
+    this.markedKeys.push(key);
-    getMemory().emit("change", true); // to trigger rerender
+    getMemory().emit("change"); // to trigger rerender
   }
 
   hasMark(key?: string) {
     if (key) {
-      return this.marks.some((k) => k.key == key);
+      return this.markedKeys.some((k) => k == key);
     } else {
-      return this.marks.length > 0;
+      return this.markedKeys.length > 0;
     }
   }
 
   removeMark(key: string) {
-    this.marks = this.marks.filter((mark) => mark.key != key);
+    this.markedKeys = this.markedKeys.filter((e) => e != key);
     getMemory().emit("change"); // to trigger rerender
   }
 
@@ -159,29 +154,15 @@ export class StolenDataEntry {
   matchesHAREntry(har: HAREntry): boolean {
     return this.request.matchesHAREntry(har);
   }
-
-  getValuePreview(key = ""): string {
-    const value = this.getParsedValue(key);
-    const str = value.toString();
-    if (this.classification == "id") {
-      return (
-        str.slice(0, Math.min(str.length / 3, ID_PREVIEW_MAX_LENGTH)) + "(...)"
-      );
-    } else if (typeof value === "object" && value[Symbol.for("originalURL")]) {
-      return value[Symbol.for("originalURL")] as string;
-    } else {
-      return str;
-    }
-  }
 }
 
 export class MergedStolenDataEntry {
   constructor(public entries: StolenDataEntry[]) {
     const all_marks = unique(
-      entries.map((entry) => entry.marks).reduce(reduceConcat, [])
+      entries.map((entry) => entry.markedKeys).reduce(reduceConcat, [])
     );
     for (const entry of entries) {
-      entry.marks = all_marks;
+      entry.markedKeys = all_marks;
     }
     // getMemory().emit("change"); // to trigger render
   }
@@ -229,7 +210,7 @@ export class MergedStolenDataEntry {
 
   getMarkedValues() {
     return this.entries
-      .map((entry) => entry.marks)
+      .map((entry) => entry.markedKeys)
       .reduce((a, b) => a.concat(b), []);
   }
 

tsconfig.json

@@ -4,7 +4,6 @@
     "esModuleInterop": true,
     "lib": ["es2017", "dom", "es2019"],
     "typeRoots": ["node_modules/@types", "node_modules/web-ext-types"],
-    "target": "es2019",
     "outDir": "lib"
   }
 }

util.ts

@@ -138,21 +138,3 @@ export function toBase64(file: File): Promise<string> {
     FR.readAsDataURL(file);
   });
 }
-
-export function makeThrottle(interval: number) {
-  let last_emit = 0;
-  function emit(callback: () => void) {
-    if (Date.now() - last_emit > interval) {
-      callback();
-      last_emit = Date.now();
-      return true;
-    } else {
-      return false;
-    }
-  }
-  return function (callback: () => void) {
-    if (!emit(callback)) {
-      setTimeout(() => emit(callback), interval);
-    }
-  };
-}