diff --git a/apps/yaak-proxy/components/AppIcon.tsx b/apps/yaak-proxy/components/AppIcon.tsx
index c90b0a824..74f9b12e9 100644
--- a/apps/yaak-proxy/components/AppIcon.tsx
+++ b/apps/yaak-proxy/components/AppIcon.tsx
@@ -42,8 +42,13 @@ export function AppIcon({ path, className = "size-4" }: { path: string; classNam
}, [path]);
return url == null ? (
-
+
) : (
-
+ // Square whatever squeezes it, beside text that truncates
+
);
}
diff --git a/apps/yaak-proxy/components/EncryptedCard.tsx b/apps/yaak-proxy/components/EncryptedCard.tsx
index 96db399d3..ec64cfab3 100644
--- a/apps/yaak-proxy/components/EncryptedCard.tsx
+++ b/apps/yaak-proxy/components/EncryptedCard.tsx
@@ -185,6 +185,11 @@ function LineText({ line }: { line: Line }) {
typeof part === "string" ? (
// oxlint-disable-next-line react/no-array-index-key -- the parts of one fixed line
{part}
+ ) : "bold" in part ? (
+ // oxlint-disable-next-line react/no-array-index-key -- the parts of one fixed line
+
+ {part.bold}
+
) : (
// oxlint-disable-next-line react/no-array-index-key -- the parts of one fixed line
{part.code}
@@ -222,7 +227,7 @@ function ActionButton({
flow.clientPath == null ? (
) : (
-
+
)
) : (
@@ -241,7 +246,7 @@ function ActionButton({
action.hint == null ? undefined : (
diff --git a/apps/yaak-proxy/components/HttpsStrip.tsx b/apps/yaak-proxy/components/HttpsStrip.tsx
index 632aa594e..8bbc5a399 100644
--- a/apps/yaak-proxy/components/HttpsStrip.tsx
+++ b/apps/yaak-proxy/components/HttpsStrip.tsx
@@ -77,9 +77,9 @@ export function HttpsStrip() {
app.path == null ? (
app.name
) : (
-
-
- {app.name}
+
+
+ {app.name}
),
keepOpenOnSelect: true,
diff --git a/apps/yaak-proxy/components/Sidebar.tsx b/apps/yaak-proxy/components/Sidebar.tsx
index 1d5f6d8b5..434a50833 100644
--- a/apps/yaak-proxy/components/Sidebar.tsx
+++ b/apps/yaak-proxy/components/Sidebar.tsx
@@ -85,7 +85,9 @@ function ItemInner({ item }: { item: SidebarItem }) {
{item.kind === "encrypted" && }
{item.kind === "saved" && }
{item.kind === "folder" && }
- {item.appPath != null && }
+ {item.appPath != null && (
+
+ )}
{item.kind === "folder" && item.path != null ? (
// Named by its last part; the whole path on hover
diff --git a/apps/yaak-proxy/harness/httpsFixtures.ts b/apps/yaak-proxy/harness/httpsFixtures.ts
index 4fa7a659c..765165470 100644
--- a/apps/yaak-proxy/harness/httpsFixtures.ts
+++ b/apps/yaak-proxy/harness/httpsFixtures.ts
@@ -40,6 +40,12 @@ const apps = {
clientBundleId: "com.1password.1password",
clientPath: "/Applications/1Password.app",
},
+ headless: {
+ clientName: "chrome-headless-shell",
+ clientBundleId: null,
+ clientPath:
+ "/Users/you/.cache/ms-playwright/chromium_headless_shell-1208/chrome-headless-shell",
+ },
acme: {
clientName: "Acme Sync",
clientBundleId: "dev.acme.sync",
@@ -124,6 +130,7 @@ function encryptedScene(): Flow[] {
tunnel(10, "fonts.gstatic.com", apps.dia),
tunnel(11, "clients2.google.com", apps.chrome),
tunnel(12, "home.taila714c.ts.net:8317", apps.dia, { url: "home.taila714c.ts.net:8317" }),
+ tunnel(13, "optimizationguide-pa.googleapis.com", apps.headless),
];
}
diff --git a/apps/yaak-proxy/lib/encryptedCard.test.ts b/apps/yaak-proxy/lib/encryptedCard.test.ts
index 69ea1f72a..c8ab5062d 100644
--- a/apps/yaak-proxy/lib/encryptedCard.test.ts
+++ b/apps/yaak-proxy/lib/encryptedCard.test.ts
@@ -90,7 +90,9 @@ describe("the card of an encrypted connection", () => {
test("something else listed: not on the list, with the same choices", () => {
const c = card({ list: [...user("host:api.stripe.com"), ...BUILT_INS] });
- expect(lineText(c.why)).toBe("Decryption not configured for `www.google.com`");
+ expect(lineText(c.why)).toBe(
+ "**Encrypted Content:** Enable decryption to see requests to `www.google.com`",
+ );
expect(c.actions.map((a) => a.label)).toEqual([
"Decrypt www.google.com",
"Decrypt Dia",
@@ -108,10 +110,10 @@ describe("the card of an encrypted connection", () => {
test("names the host nothing on the list covers, its port only when not 443", () => {
const list = [...user("host:api.stripe.com"), ...BUILT_INS];
expect(lineText(card({ list, flow: { ...tunnel, url: "t.yaak.app:443" } }).why)).toBe(
- "Decryption not configured for `t.yaak.app`",
+ "**Encrypted Content:** Enable decryption to see requests to `t.yaak.app`",
);
expect(lineText(card({ list, flow: { ...tunnel, url: "home.ts.net:8317" } }).why)).toBe(
- "Decryption not configured for `home.ts.net:8317`",
+ "**Encrypted Content:** Enable decryption to see requests to `home.ts.net:8317`",
);
});
diff --git a/apps/yaak-proxy/lib/encryptedCard.ts b/apps/yaak-proxy/lib/encryptedCard.ts
index dd3027a9d..3c86cc648 100644
--- a/apps/yaak-proxy/lib/encryptedCard.ts
+++ b/apps/yaak-proxy/lib/encryptedCard.ts
@@ -78,12 +78,19 @@ export interface CardAction {
icon: "host" | "app" | "everything" | "lock" | "lock_open" | "refresh" | "shield" | "terminal";
}
-/** A line of text, the hosts, apps and entries in it shown as code, as Yaak shows literal values */
-export type Line = (string | { code: string })[];
+/**
+ * A line of text, the hosts, apps and entries in it shown as code, as Yaak shows literal values,
+ * and a lead in bold
+ */
+export type Line = (string | { code: string } | { bold: string })[];
-/** A line as plain text, its code in backticks */
+/** A line as plain text, its code in backticks and its bold in asterisks */
export function lineText(line: Line): string {
- return line.map((part) => (typeof part === "string" ? part : `\`${part.code}\``)).join("");
+ return line
+ .map((part) =>
+ typeof part === "string" ? part : "code" in part ? `\`${part.code}\`` : `**${part.bold}**`,
+ )
+ .join("");
}
export interface EncryptedCardModel {
@@ -265,7 +272,11 @@ function whyLine(
? ["Nothing is decrypted yet"]
: decryptsNow
? ["Not on the decrypt list"]
- : ["Decryption not configured for ", { code: c.label }],
+ : [
+ { bold: "Encrypted Content:" },
+ " Enable decryption to see requests to ",
+ { code: c.label },
+ ],
whySub: null,
};
}