Format sizes in the web view in "1.23 MiB" style

CHANGELOG.md

@@ -14,6 +14,7 @@ In Development
 - Add links to version & asset metadata to the web view
 - Adjust the format of timestamps in the web view: Always use UTC, show the
   timezone as "Z", prevent line breaking in the middle, wrap in `<time>` tag
+- Format sizes in the web view in "1.23 MiB" style
 
 v0.2.0 (2024-02-07)
 -------------------

Cargo.toml

@@ -27,6 +27,7 @@ bytes = "1.5.0"
 clap = { version = "4.4.18", default-features = false, features = ["derive", "error-context", "help", "std", "suggestions", "usage", "wrap_help"] }
 enum_dispatch = "0.3.12"
 futures-util = "0.3.30"
+humansize = "2.1.3"
 indoc = "2.0.4"
 itertools = "0.12.1"
 moka = { version = "0.12.5", features = ["future"] }

src/dav/html.rs

@@ -2,8 +2,10 @@
 use super::{DavCollection, DavItem, DavResource, ResourceKind};
 use crate::consts::HTML_TIMESTAMP_FORMAT;
 use crate::paths::Component;
+use humansize::{format_size_i, BINARY};
 use serde::{ser::Serializer, Serialize};
-use tera::{Context, Error, Tera};
+use std::collections::HashMap;
+use tera::{Context, Error, Filter, Tera, Value};
 use thiserror::Error;
 use time::OffsetDateTime;
 
@@ -14,6 +16,7 @@
 impl Templater {
     pub(crate) fn load() -> Result<Self, TemplateError> {
         let mut engine = Tera::default();
+        engine.register_filter("formatsize", FormatSizeFilter);
         engine
             .add_raw_template("collection.html", COLLECTION_TEMPLATE)
             .map_err(|source| TemplateError::Load {
@@ -216,9 +219,45 @@
     s
 }
 
+#[derive(Copy, Clone, Debug, Eq, PartialEq)]
+struct FormatSizeFilter;
+
+impl Filter for FormatSizeFilter {
+    fn filter(&self, value: &Value, _args: &HashMap<String, Value>) -> Result<Value, Error> {
+        match value.as_i64() {
+            Some(size) => Ok(formatsize(size).into()),
+            None => Err(Error::msg("Input to formatsize filter must be an integer")),
+        }
+    }
+
+    fn is_safe(&self) -> bool {
+        true
+    }
+}
+
+fn formatsize(size: i64) -> String {
+    format_size_i(size, BINARY)
+}
+
 #[cfg(test)]
 mod tests {
     use super::*;
+    use rstest::rstest;
+
+    #[rstest]
+    #[case(0, "0 B")]
+    #[case(42, "42 B")]
+    #[case(1000, "1000 B")]
+    #[case(1024, "1 KiB")]
+    #[case(1025, "1.00 KiB")]
+    #[case(1525, "1.49 KiB")]
+    #[case(1535, "1.50 KiB")]
+    #[case(1536, "1.50 KiB")]
+    #[case(10240, "10 KiB")]
+    #[case(10752, "10.50 KiB")]
+    fn test_formatsize(#[case] size: i64, #[case] s: &str) {
+        assert_eq!(formatsize(size), s);
+    }
 
     mod render_collection {
         use super::*;

src/dav/templates/collection.html.tera

@@ -32,7 +32,7 @@
             </td>
             <td class="type">{{r.kind}}</td>
             {%- if r.size is defined %}
-            <td class="size">{{r.size}}</td>
+            <td class="size">{{r.size|formatsize}}</td>
             {%- else %}
             <td class="null">&#x2014;</td>
             {%- endif %}

src/testdata/render-collection/basic.html

@@ -51,7 +51,7 @@
                 </div>
             </td>
             <td class="type">Zarr asset</td>
-            <td class="size">1234567890</td>
+            <td class="size">1.15 GiB</td>
             <td class="created"><time>2021-01-01 01:23:45Z</time></td>
             <td class="modified"><time>2023-12-31 12:34:56Z</time></td>
         </tr>
@@ -63,7 +63,7 @@
                 </div>
             </td>
             <td class="type">Version metadata</td>
-            <td class="size">42</td>
+            <td class="size">42 B</td>
             <td class="null">&#x2014;</td>
             <td class="null">&#x2014;</td>
         </tr>
@@ -77,7 +77,7 @@
                 </div>
             </td>
             <td class="type">Blob asset</td>
-            <td class="size">0</td>
+            <td class="size">0 B</td>
             <td class="created"><time>2024-02-15 03:13:22Z</time></td>
             <td class="modified"><time>2024-02-15 03:13:35Z</time></td>
         </tr>
@@ -91,7 +91,7 @@
                 </div>
             </td>
             <td class="type">Blob asset</td>
-            <td class="size">123456</td>
+            <td class="size">120.56 KiB</td>
             <td class="created"><time>2021-02-03 06:47:50Z</time></td>
             <td class="modified"><time>2022-03-10 12:03:29Z</time></td>
         </tr>