From 6839901fa365a462619dfbd9fe0070b46e4cbd9d Mon Sep 17 00:00:00 2001
From: Mykola Skrynnyk <45297092+mykolaskrynnyk@users.noreply.github.com>
Date: Sat, 21 Sep 2024 21:06:19 +0200
Subject: [PATCH]  Refactor(breadcrumbs)!: expect a mapping from names to URLs

---
 pages/custom.py                   | 12 +++++++-----
 st_undp/components.py             |  9 ++++++---
 st_undp/templates/breadcrumb.html | 12 +++++++-----
 3 files changed, 20 insertions(+), 13 deletions(-)

diff --git a/pages/custom.py b/pages/custom.py
index d5a6fb0..f08efa3 100644
--- a/pages/custom.py
+++ b/pages/custom.py
@@ -61,11 +61,13 @@
 
 with tab4:
     code = """
-        st_undp.breadcrumb([
-            {'Home': '/'},
-            {'Custom components': '/custom'},
-            {'Breadcrumb': None}
-        ])
+        st_undp.breadcrumb(
+            {
+                "Home": "/",
+                "Custom components": "/custom",
+                "Breadcrumb": None,
+            }
+        )
     """
     eval(code.strip())
     with st.expander("Show Code"):
diff --git a/st_undp/components.py b/st_undp/components.py
index efc0bb8..bb90f86 100644
--- a/st_undp/components.py
+++ b/st_undp/components.py
@@ -342,14 +342,17 @@ def image_card(src: str, summary: str, href: str, width: int = 12) -> None:
     st.html(body)
 
 
-def breadcrumb(items: list[dict[str, str]]) -> None:
+def breadcrumb(items: dict[str, str]) -> None:
     """
     [Breadcrumbs](https://design.undp.org/?path=/docs/components-navigation-components-breadcrumbs--docs) component.
 
+    The breadcrumbs are arranged in the same order as dictionary keys. Last item's value is ignored and can be
+    set to None.
+
     Parameters
     ----------
-    items : list[dict[str, str]
-        List of items where each item maps a title to a URL.
+    items : dict[str, str]
+        Mapping from names to URLs.
 
     Returns
     -------
diff --git a/st_undp/templates/breadcrumb.html b/st_undp/templates/breadcrumb.html
index d8a2d92..fd3ecf0 100644
--- a/st_undp/templates/breadcrumb.html
+++ b/st_undp/templates/breadcrumb.html
@@ -1,9 +1,11 @@
 <nav class="breadcrumb">
     <ul>
-        {% for item in items %} {% for label, url in item.items() %} {% if url %}
-          <li><a href="{{ url }}" aria-label="{{label}}">{{ label }}</a></li>
-        {% else %}
-          <li aria-current="{{label}}">{{ label }}</li>
-        {% endif %} {% endfor %} {% endfor %}
+        {% for label, url in items.items() %}
+            {% if not loop.last %}
+                <li><a href="{{ url }}" aria-label="{{label}}">{{ label }}</a></li>
+            {% else %}
+                <li aria-current="{{label}}">{{ label }}</li>
+            {% endif %}
+        {% endfor %}
     </ul>
 </nav>