From 5ca41615029662e7062c3930d398f064bf428fc6 Mon Sep 17 00:00:00 2001
From: Hendrik Eeckhaut <hendrik@eeckhaut.org>
Date: Wed, 15 Nov 2023 23:18:27 +0300
Subject: [PATCH] iframe experiment

---
 Cargo.toml                       |  6 -----
 src/components/content_iframe.rs | 45 ++++++++++++++++++++++++++++++++
 src/components/mod.rs            |  1 +
 src/components/view_file.rs      |  3 +++
 4 files changed, 49 insertions(+), 6 deletions(-)
 create mode 100644 src/components/content_iframe.rs

diff --git a/Cargo.toml b/Cargo.toml
index 740e3be..6c79b18 100644
--- a/Cargo.toml
+++ b/Cargo.toml
@@ -18,12 +18,6 @@ elliptic-curve = { version = "0.13.5", features = ["pkcs8"] }
 webpki-roots = "0.25.2"
 wasm-logger = "0.2.0"
 web-time = "0.2"
-yew_icons = { version = "0.8.0", features = [
-    # https://finnbear.github.io/yew_icons/
-    "FontAwesomeSolidUpload",
-    "BootstrapCloudUploadFill",
-] }
-
 
 # tlsn-core = { git = "https://github.com/tlsnotary/tlsn", branch = "dev" }
 [dependencies.tlsn-core]
diff --git a/src/components/content_iframe.rs b/src/components/content_iframe.rs
new file mode 100644
index 0000000..54131f6
--- /dev/null
+++ b/src/components/content_iframe.rs
@@ -0,0 +1,45 @@
+use std::fmt;
+
+use gloo::console::log;
+use yew::prelude::*;
+
+#[derive(Clone, PartialEq, Properties)]
+pub struct Props {
+    pub bytes: String,
+}
+
+fn render(content: String) -> Html {
+    html! {
+        <iframe class="w-full h-64" srcdoc={content} src="demo_iframe_srcdoc.htm">
+            <p>{">Your browser does not support iframes."}</p>
+        </iframe>
+    }
+}
+
+#[function_component]
+pub fn ContentIFrame(props: &Props) -> Html {
+    let content = format!("{}", &props.bytes);
+
+    // Content-Type: text/html
+    let start_html = content.find("<html");
+    let end_html = content.find("/html>");
+
+    let frame = if start_html.is_some() && end_html.is_some() {
+        let html_content = content[start_html.unwrap()..end_html.unwrap() + 5].to_string();
+        log!("html: {}", html_content.clone());
+        render(html_content)
+    } else {
+        // Content-Type: application/json
+
+        let start_html = content.find("<html");
+        let end_html = content.find("/html>");
+
+        render(content)
+    };
+
+    html! {
+        <details class="p-4 w-5/6" open={true}>
+            {frame}
+        </details>
+    }
+}
diff --git a/src/components/mod.rs b/src/components/mod.rs
index ab7b8e4..315931f 100644
--- a/src/components/mod.rs
+++ b/src/components/mod.rs
@@ -1,3 +1,4 @@
+pub mod content_iframe;
 pub mod pem_input;
 pub mod redacted_bytes_component;
 pub mod view_file;
diff --git a/src/components/view_file.rs b/src/components/view_file.rs
index c075950..dc3c649 100644
--- a/src/components/view_file.rs
+++ b/src/components/view_file.rs
@@ -6,6 +6,7 @@ use yew::{function_component, html, Html, Properties};
 
 use tlsn_core::proof::{SessionProof, TlsProof};
 
+use crate::components::content_iframe::ContentIFrame;
 use crate::components::redacted_bytes_component::Direction;
 use crate::components::redacted_bytes_component::RedactedBytesComponent;
 
@@ -107,6 +108,8 @@ pub fn ViewFile(props: &Props) -> Html {
 
                         <RedactedBytesComponent direction={Direction::Send} bytes={bytes_send} />
 
+                        <ContentIFrame bytes={bytes_received.clone()} />
+
                         <RedactedBytesComponent direction={Direction::Received} bytes={bytes_received} />
                     </div>
                 }