htmx_components/server/
html_layout.rs

1use once_cell::sync::Lazy;
2use rscx::{component, html, props};
3use std::time::{SystemTime, UNIX_EPOCH};
4
5// TEMP HACK! Used to bust cache on client scripts and stylesheets.
6// TODO Get hash of each build file and use that.
7static TS: Lazy<u128> = Lazy::new(|| {
8    SystemTime::now()
9        .duration_since(UNIX_EPOCH)
10        .unwrap()
11        .as_millis()
12});
13
14#[props]
15pub struct HtmlLayoutProps {
16    #[builder(setter(into), default = "Yall Chart".to_string())]
17    head_title: String,
18
19    #[builder(default)]
20    head_links: String,
21
22    #[builder(default)]
23    head_scripts: String,
24
25    #[builder(default)]
26    children: String,
27}
28
29/**
30* Note, for now, im using a CDN for tailwindcss. This is not ideal for productionn -- but
31* theres a bunch to figure out how to get this working well as a library, what with all
32* the tailwind building and themes and junk.
33*
34*/
35#[component]
36pub fn HtmlLayout(props: HtmlLayoutProps) -> String {
37    html! {
38        <!DOCTYPE html>
39        <html lang="en">
40            <head>
41                <meta charset="utf-8" />
42                <meta name="viewport" content="width=device-width, initial-scale=1" />
43                <title>{props.head_title}</title>
44                <script src="https://cdn.tailwindcss.com"></script>
45                <script>{
46                    "window.YcControls = {
47                        attachOnReadyQueue: [],
48                        attach: function(element) {
49                            this.attachOnReadyQueue.push(element);
50                        },
51                        onReadyQueue: [],
52                        onReady: function(onReadyHandler) {
53                            this.onReadyQueue.push(onReadyHandler);
54                        },
55                    };"
56                }</script>
57                {props.head_links}
58                {props.head_scripts}
59            </head>
60            <body>
61                {props.children}
62                <script src="https://unpkg.com/htmx-glue/out/common.js"></script>
63            </body>
64        </html>
65    }
66}