New types of data

extended-request.ts

@@ -1,3 +1,4 @@
+import { StolenDataEntry } from "./request-cluster";
 import { getshorthost, Request } from "./util";
 
 export default class ExtendedRequest {
@@ -52,6 +53,21 @@ export default class ExtendedRequest {
     return this.requestHeaders.find((h) => h.name == "Cookie")?.value;
   }
 
+  getPathParams(): StolenDataEntry[] {
+    const url = new URL(this.data.url);
+    const path = url.pathname;
+    if (!path.includes(";")) {
+      return [];
+    }
+    return path
+      .split(";")
+      .map((e) => e.split("="))
+      .map(
+        ([key, value]) =>
+          new StolenDataEntry("pathname", key, decodeURIComponent(value))
+      );
+  }
+
   constructor(public data: Request) {
     this.tabId = data.tabId;
     this.url = data.url;

request-cluster.ts

@@ -2,6 +2,10 @@ import { EventEmitter } from "events";
 import ExtendedRequest from "./extended-request";
 import { parseCookie } from "./util";
 
+export class StolenDataEntry {
+  constructor(public type: string, public name: string, public value: string) {}
+}
+
 export class RequestCluster extends EventEmitter {
   public requests: ExtendedRequest[] = [];
   constructor(public id: string) {
@@ -25,7 +29,8 @@ export class RequestCluster extends EventEmitter {
     minValueLength,
   }: {
     minValueLength: number;
-  }): [string, string][] {
+  }): StolenDataEntry[] {
+    this.getQueryParamsContent({ minValueLength });
     const cookieValues = new Set<string>();
     for (const request of this.requests) {
       if (request.hasCookie()) {
@@ -36,7 +41,40 @@ export class RequestCluster extends EventEmitter {
       .map(parseCookie)
       .map((o) => Object.entries(o))
       .reduce((a, b) => a.concat(b), [])
-      .filter(([_, value]) => value.length >= minValueLength);
+      .map(([key, value]) => new StolenDataEntry("cookie", key, value))
+      .filter((e) => e.value.length >= minValueLength);
+  }
+
+  getQueryParamsContent({
+    minValueLength,
+  }: {
+    minValueLength: number;
+  }): StolenDataEntry[] {
+    const result = [];
+    for (const request of this.requests) {
+      console.log(request.data.url);
+    }
+    return result;
+  }
+
+  getPathnameParamsContent({
+    minValueLength,
+  }: {
+    minValueLength: number;
+  }): StolenDataEntry[] {
+    let result = [];
+    for (const request of this.requests) {
+      result = [...result, ...request.getPathParams()];
+    }
+    console.log("PATHNAME PARAMS FOR", this.id, result);
+    return result;
+  }
+
+  getStolenData(filter: { minValueLength: number }) {
+    return [
+      ...this.getCookiesContent(filter),
+      ...this.getPathnameParamsContent(filter),
+    ];
   }
 
   static sortCompare(a: RequestCluster, b: RequestCluster) {

sidebar.tsx

@@ -68,16 +68,14 @@ const StolenDataRow = ({
       </h2>
       <table>
         <tbody>
-          {cluster
-            .getCookiesContent({ minValueLength })
-            .map(([cookie_name, cookie_value]) => (
-              <tr>
-                <th style={{ maxWidth: "200px", wordWrap: "break-word" }}>
-                  {cookie_name}
-                </th>
-                <td>{cookie_value}</td>
-              </tr>
-            ))}
+          {cluster.getStolenData({ minValueLength }).map((entry) => (
+            <tr>
+              <th style={{ maxWidth: "200px", wordWrap: "break-word" }}>
+                {entry.name}
+              </th>
+              <td>{entry.value}</td>
+            </tr>
+          ))}
         </tbody>
       </table>
     </div>
@@ -107,7 +105,9 @@ const StolenData = ({
     <div style={{ padding: "5px" }}>
       {" "}
       <div>
-        <img src={tab.favIconUrl} width="20" height="20" /> {tab.title}
+        <h1>
+          <img src={tab.favIconUrl} width="20" height="20" /> {tab.title}
+        </h1>
         {clusters.map((cluster) => (
           <StolenDataRow
             tabID={pickedTab}
@@ -122,10 +122,27 @@ const StolenData = ({
   );
 };
 
+const Options = ({ minValueLength, setMinValueLength }) => {
+  return (
+    <fieldset>
+      <h3>Zaawansowane ustawienia</h3>
+      <label htmlFor="minValueLength">
+        Pokazuj tylko wartości o długości co najmniej{" "}
+      </label>
+      <input
+        type="number"
+        id="minValueLength"
+        value={minValueLength}
+        onChange={(e) => setMinValueLength(parseInt(e.target.value))}
+      />
+    </fieldset>
+  );
+};
+
 const Sidebar = () => {
   console.log("rendering!");
   const [pickedTab, setPickedTab] = useState<number | null>(null);
-  const [minValueLength, setMinValueLength] = useState<number | null>(3);
+  const [minValueLength, setMinValueLength] = useState<number | null>(5);
   const counter = useEmitter(memory);
   return (
     <>
@@ -138,10 +155,9 @@ const Sidebar = () => {
           Wybierz aktywną kartę{" "}
         </button>
       </div>
-      <input
-        type="number"
-        value={minValueLength}
-        onChange={(e) => setMinValueLength(parseInt(e.target.value))}
+      <Options
+        minValueLength={minValueLength}
+        setMinValueLength={setMinValueLength}
       />
       <StolenData
         pickedTab={pickedTab}