Allow to inject arbitrary components into the <head> (#1499)

levkk · web-flow · commit b949d45a2353 · 2024-06-03T13:03:49.000-07:00
diff --git a/pgml-dashboard/src/components/layouts/head/mod.rs b/pgml-dashboard/src/components/layouts/head/mod.rs
@@ -1,4 +1,4 @@
-use pgml_components::component;
+use pgml_components::{component, Component};
 use sailfish::TemplateOnce;
 
 #[derive(TemplateOnce, Default, Clone)]
@@ -10,6 +10,7 @@ pub struct Head {
     pub preloads: Vec<String>,
     pub context: Option<String>,
     pub canonical: Option<String>,
+    pub additional_components: Vec<Component>,
 }
 
 impl Head {
@@ -58,6 +59,25 @@ impl Head {
         self.context = context.to_owned();
         self
     }
+
+    /// Add a component to `<head>`.
+    ///
+    /// This can be anything, e.g. a `<script>` tag or a `<meta>` or just some HTML or text.
+    ///
+    /// # Example
+    ///
+    /// ```
+    /// use pgml_components::Component;
+    /// use pgml_components::layouts::Head;
+    ///
+    /// let head = Head::new()
+    ///     .add_component(Component::from("<script>console.log('hello');</script>"));
+    /// ```
+    ///
+    pub fn add_component(mut self, component: Component) -> Self {
+        self.additional_components.push(component);
+        self
+    }
 }
 
 component!(Head);
diff --git a/pgml-dashboard/src/components/layouts/head/template.html b/pgml-dashboard/src/components/layouts/head/template.html
@@ -97,4 +97,8 @@
     };
   </script>
   <% } %>
+
+  <% for component in additional_components { %>
+    <%+ component %>
+  <% } %>
 </head>
diff --git a/pgml-dashboard/src/components/layouts/marketing/base/mod.rs b/pgml-dashboard/src/components/layouts/marketing/base/mod.rs
@@ -3,7 +3,7 @@ use crate::components::notifications::marketing::AlertBanner;
 use crate::guards::Cluster;
 use crate::models::User;
 use crate::Notification;
-use pgml_components::component;
+use pgml_components::{component, Component};
 use sailfish::TemplateOnce;
 use std::fmt;
 
@@ -72,6 +72,15 @@ impl Base {
         rsp
     }
 
+    /// Add a component to the `<head>`.
+    ///
+    /// See [`Head::add_component`](crate::components::layouts::Head::add_component) for more information.
+    ///
+    pub fn add_head_component(mut self, component: Component) -> Self {
+        self.head = self.head.add_component(component);
+        self
+    }
+
     pub fn footer(mut self, footer: String) -> Self {
         self.footer = Some(footer);
         self
diff --git a/pgml-dashboard/src/templates/mod.rs b/pgml-dashboard/src/templates/mod.rs
@@ -163,6 +163,17 @@ impl<'a> WebAppBase<'a> {
         self
     }
 
+    /// Add a component to head (`<head>`).
+    ///
+    /// # Arguments
+    ///
+    /// * `component` - The component to add to the head.
+    ///
+    pub fn add_head_component(&mut self, component: Component) -> &mut Self {
+        self.head = self.head.clone().add_component(component);
+        self
+    }
+
     pub fn render<T>(&mut self, template: T) -> String
     where
         T: sailfish::TemplateOnce,
