Updating Meta Tags

vizro-core/examples/default/app.py

@@ -24,6 +24,7 @@ def create_variable_analysis():
     """Function returns a page with gapminder data to do variable analysis."""
     page_variable = vm.Page(
         title="Variable Analysis",
+        description="Analyzing population, GDP per capita and life expectancy on country and continent level",
         layout=vm.Layout(
             grid=[
                 # fmt: off
@@ -194,6 +195,7 @@ def create_relation_analysis():
     """Function returns a page to perform relation analysis."""
     page_relation_analysis = vm.Page(
         title="Relationship Analysis",
+        description="Investigating the interconnection between population, GDP per capita and life expectancy",
         layout=vm.Layout(
             grid=[[0, 0, 0, 0, 1]] + [[2, 2, 3, 3, 3]] * 4 + [[4, 4, 4, 4, 4]] * 5,
             row_min_height="100px",
@@ -323,6 +325,7 @@ def create_continent_summary():
     """Function returns a page with markdown including images."""
     page_summary = vm.Page(
         title="Continent Summary",
+        description="Summarizing the main findings for each continent",
         layout=vm.Layout(grid=[[i] for i in range(5)], row_min_height="190px", row_gap="25px"),
         components=[
             vm.Card(
@@ -415,6 +418,7 @@ def create_benchmark_analysis():
 
     page_country = vm.Page(
         title="Benchmark Analysis",
+        description="Discovering how the metrics differ for each country and export data for further investigation",
         layout=vm.Layout(grid=[[0, 1]] * 5 + [[2, -1]], col_gap="32px", row_gap="60px"),
         components=[
             vm.Table(
@@ -496,6 +500,7 @@ def create_home_page():
     """Function returns the homepage."""
     page_home = vm.Page(
         title="Homepage",
+        description="Welcome to the Vizro demo app",
         layout=vm.Layout(grid=[[0, 1], [2, 3]], row_gap="16px", col_gap="24px"),
         components=[
             vm.Card(

vizro-core/src/vizro/models/_dashboard.py

@@ -2,6 +2,7 @@
 
 import logging
 from functools import partial
+from pathlib import Path
 from typing import TYPE_CHECKING, List, Literal
 
 import dash
@@ -63,13 +64,25 @@ def set_navigation_pages(cls, navigation, values):
 
     @_log_call
     def pre_build(self):
+        meta_image = (
+            self._infer_image("app")
+            or self._infer_image("logo")
+            or get_relative_path(f"/{STATIC_URL_PREFIX}/images/app.svg")
+        )
+
         # Setting order here ensures that the pages in dash.page_registry preserves the order of the List[Page].
         # For now the homepage (path /) corresponds to self.pages[0].
         # Note redirect_from=["/"] doesn't work and so the / route must be defined separately.
         for order, page in enumerate(self.pages):
             path = page.path if order else "/"
             dash.register_page(
-                module=page.id, name=page.title, path=path, order=order, layout=partial(self._make_page_layout, page)
+                module=page.id,
+                name=page.title,
+                path=path,
+                order=order,
+                layout=partial(self._make_page_layout, page),
+                description=page.description,
+                image=meta_image,
             )
         dash.register_page(module=MODULE_PAGE_404, layout=self._make_page_404_layout())
 
@@ -152,3 +165,11 @@ def _make_page_404_layout():
             ],
             className="page_error_container",
         )
+
+    def _infer_image(self, basename: str):
+        valid_extensions = [".apng", ".avif", ".gif", ".jpeg", ".jpg", ".png", ".svg", ".webp"]
+        assets_folder = Path(dash.get_app().config.assets_folder)
+        if assets_folder.is_dir():
+            for path in Path(assets_folder).rglob(f"{basename}.*"):
+                if path.suffix in valid_extensions:
+                    return str(path.relative_to(assets_folder))

vizro-core/src/vizro/models/_page.py

@@ -1,6 +1,6 @@
 from __future__ import annotations
 
-from typing import List, TypedDict
+from typing import List, Optional, TypedDict
 
 from dash import Input, Output, Patch, callback, dcc, html
 
@@ -35,6 +35,7 @@ class Page(VizroBaseModel):
         components (List[ComponentType]): See [ComponentType][vizro.models.types.ComponentType]. At least one component
             has to be provided.
         title (str): Title to be displayed.
+        description (str): Description for meta tags.
         layout (Layout): Layout to place components in. Defaults to `None`.
         controls (List[ControlType]): See [ControlType][vizro.models.types.ControlType]. Defaults to `[]`.
         path (str): Path to navigate to page. Defaults to `""`.
@@ -45,6 +46,7 @@ class Page(VizroBaseModel):
 
     components: List[ComponentType]
     title: str = Field(..., description="Title to be displayed.")
+    description: str = Field("", description="Page description for meta tags.")
     layout: Layout = None  # type: ignore[assignment]
     controls: List[ControlType] = []
     path: str = Field("", description="Path to navigate to page.")