spinne_html/
lib.rs

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
use serde_json::Value;
use std::fs;
use std::path::Path;

const HTML_TEMPLATE: &str = include_str!("./component-graph.html");

/// Generates an HTML report from a component graph.
/// Uses d3.js to render the graph.
pub struct HtmlGenerator {
    template: String,
}

impl HtmlGenerator {
    pub fn new(graph_data: Value) -> Self {
        let template = HTML_TEMPLATE.replace("{{GRAPH_DATA}}", &graph_data.to_string());
        Self { template }
    }

    pub fn save(&self, output_path: &Path) -> std::io::Result<()> {
        fs::write(output_path, self.template.clone())
    }
}

#[cfg(test)]
mod tests {
    use super::*;
    use serde_json::json;

    #[test]
    fn test_html_generation() {
        let graph_data = json!({
            "nodes": [
                {
                    "name": "ComponentA",
                    "file_path": "/path/to/ComponentA.tsx",
                    "prop_usage": {}
                }
            ],
            "edges": []
        });

        let generator = HtmlGenerator::new(graph_data);

        assert!(generator.template.contains("ComponentA"));
        assert!(!generator.template.contains("{{GRAPH_DATA}}"));
    }

    #[test]
    fn test_html() {
        let graph_data = json!({
            "nodes": [
                {
                    "name": "ComponentA",
                    "file_path": "/path/to/ComponentA.tsx",
                    "prop_usage": {}
                },
                {
                    "name": "ComponentB",
                    "file_path": "/path/to/ComponentB.tsx",
                    "prop_usage": {}
                },
                {
                    "name": "ComponentC",
                    "file_path": "/path/to/ComponentC.tsx",
                    "prop_usage": {}
                },
                {
                    "name": "ComponentD",
                    "file_path": "/path/to/ComponentD.tsx",
                    "prop_usage": {}
                },
                {
                    "name": "ComponentE",
                    "file_path": "/path/to/ComponentE.tsx",
                    "prop_usage": {}
                }
            ],
            "edges": [
                [0, 1],
                [2, 1],
                [3, 1],
                [3, 4]
            ]
        });

        let generator = HtmlGenerator::new(graph_data);
        let output_path = Path::new("test.html");
        generator.save(output_path).unwrap();
        open::that(output_path).unwrap();
    }
}