feat: implement htmx with partials on index and cps pages

crates/app/src/pages/cps.html

@@ -6,7 +6,7 @@
 {% block body %}
 {% call navbar::navbar(current="cps") %}
 <div class="py-10">
-  <header>
+  <header id="page-header">
     <div class="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8">
       <h1
         id="page-title"
@@ -16,17 +16,16 @@
       </h1>
     </div>
   </header>
-  <main>
+  <main id="page-main">
     <div
-      id="main-container"
       class="mx-auto max-w-7xl px-4 py-8 sm:px-6 lg:px-8"
     >
+      <div
+        class="border-2 border-dashed rounded-lg border-gray-300 dark:border-gray-600 h-96 mb-4"
+      >A</div>
       <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4 mb-4">
         <div
           class="border-2 border-dashed border-gray-300 rounded-lg dark:border-gray-600 h-32 md:h-64"
-        >A</div>
-        <div
-          class="border-2 border-dashed rounded-lg border-gray-300 dark:border-gray-600 h-32 md:h-64"
         >B</div>
         <div
           class="border-2 border-dashed rounded-lg border-gray-300 dark:border-gray-600 h-32 md:h-64"
@@ -34,10 +33,10 @@
         <div
           class="border-2 border-dashed rounded-lg border-gray-300 dark:border-gray-600 h-32 md:h-64"
         >D</div>
+        <div
+          class="border-2 border-dashed rounded-lg border-gray-300 dark:border-gray-600 h-32 md:h-64"
+        >E</div>
       </div>
-      <div
-        class="border-2 border-dashed rounded-lg border-gray-300 dark:border-gray-600 h-96 mb-4"
-      >E</div>
     </div>
   </main>
 </div>

crates/app/src/pages/cps.rs

@@ -1,34 +1,12 @@
 use askama_axum::Template;
-use axum::{
-    async_trait,
-    extract::FromRequestParts,
-    http::{request::Parts, HeaderMap, StatusCode},
-};
+use axum_htmx::HxRequest;
 
 #[derive(Template)]
 #[template(path = "cps.html")]
-pub struct CpsTemplate;
-
-pub struct ExtractHxRequest(bool);
-
-#[async_trait]
-impl<S> FromRequestParts<S> for ExtractHxRequest
-where
-    S: Send + Sync,
-{
-    type Rejection = (StatusCode, &'static str);
-
-    async fn from_request_parts(parts: &mut Parts, _state: &S) -> Result<Self, Self::Rejection> {
-        if parts.headers.get("HX-Request").is_some() {
-            Ok(ExtractHxRequest(true))
-        } else {
-            Ok(ExtractHxRequest(false))
-        }
-    }
+pub struct CpsTemplate {
+    hx_request: bool,
 }
 
-pub async fn cps(headers: HeaderMap, hx_request: ExtractHxRequest) -> CpsTemplate {
-    println!("{:#?}", headers);
-    println!("{:#?}", hx_request.0);
-    CpsTemplate
+pub async fn cps(HxRequest(hx_request): HxRequest) -> CpsTemplate {
+    CpsTemplate { hx_request }
 }

crates/app/src/pages/index.html

@@ -6,7 +6,7 @@
 {% block body %}
 {% call navbar::navbar(current="home") %}
 <div class="py-10">
-  <header>
+  <header id="page-header">
     <div class="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8">
       <h1
         id="page-title"
@@ -16,9 +16,8 @@
       </h1>
     </div>
   </header>
-  <main>
+  <main id="page-main">
     <div
-      id="main-container"
       class="mx-auto max-w-7xl px-4 py-8 sm:px-6 lg:px-8"
     >
       <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4 mb-4">