Add link to online docs

ml_peg/app/base_app.py

@@ -26,6 +26,8 @@ class BaseApp(ABC):
         Path to json file containing Dash table data for application metrics.
     extra_components
         List of other Dash components to add to app.
+    docs_url
+        URL for online documentation. Default is None.
     """
 
     def __init__(
@@ -34,6 +36,7 @@ def __init__(
         description: str,
         table_path: Path,
         extra_components: list[Component],
+        docs_url: str | None = None,
     ):
         """
         Initiaise class.
@@ -48,11 +51,14 @@ def __init__(
             Path to json file containing Dash table data for application metrics.
         extra_components
             List of other Dash components to add to app.
+        docs_url
+            URL to online documentation. Default is None.
         """
         self.name = name
         self.description = description
         self.table_path = table_path
         self.extra_components = extra_components
+        self.docs_url = docs_url
 
         self.table_id = f"{self.name}-table"
         self.table = rebuild_table(self.table_path, id=self.table_id)
@@ -71,6 +77,7 @@ def build_layout(self) -> Div:
         return build_test_layout(
             name=self.name,
             description=self.description,
+            docs_url=self.docs_url,
             table=self.table,
             extra_components=self.extra_components,
         )

ml_peg/app/nebs/li_diffusion/app_li_diffusion.py

@@ -15,6 +15,7 @@
 from ml_peg.calcs.models.models import MODELS
 
 BENCHMARK_NAME = "Li diffusion"
+DOCS_URL = "https://ddmms.github.io/ml-peg/user_guide/benchmarks/nebs.html#li-diffusion"
 DATA_PATH = APP_ROOT / "data" / "nebs" / "li_diffusion"
 
 
@@ -75,6 +76,7 @@ def get_app() -> LiDiffusionApp:
     return LiDiffusionApp(
         name=BENCHMARK_NAME,
         description=("Performance in predicting energy barriers for Li diffision."),
+        docs_url=DOCS_URL,
         table_path=DATA_PATH / "li_diffusion_metrics_table.json",
         extra_components=[
             Div(id=f"{BENCHMARK_NAME}-figure-placeholder"),

ml_peg/app/surfaces/OC157/app_OC157.py

@@ -16,6 +16,7 @@
 from ml_peg.calcs.models.models import MODELS
 
 BENCHMARK_NAME = "OC157"
+DOCS_URL = "https://ddmms.github.io/ml-peg/user_guide/benchmarks/surfaces.html#oc157"
 DATA_PATH = APP_ROOT / "data" / "surfaces" / "OC157"
 
 
@@ -70,6 +71,7 @@ def get_app() -> OC157App:
             "Performance in predicting relative energies between 3 structures for 157 "
             "molecule-surface combinations."
         ),
+        docs_url=DOCS_URL,
         table_path=DATA_PATH / "oc157_metrics_table.json",
         extra_components=[
             Div(id=f"{BENCHMARK_NAME}-figure-placeholder"),

ml_peg/app/surfaces/S24/app_S24.py

@@ -15,6 +15,7 @@
 from ml_peg.calcs.models.models import MODELS
 
 BENCHMARK_NAME = "S24"
+DOCS_URL = "https://ddmms.github.io/ml-peg/user_guide/benchmarks/surfaces.html#s24"
 DATA_PATH = APP_ROOT / "data" / "surfaces" / "S24"
 
 
@@ -65,6 +66,7 @@ def get_app() -> S24App:
             "Performance in predicting adsorption energies for 24 "
             "molecule-surface combinations."
         ),
+        docs_url=DOCS_URL,
         table_path=DATA_PATH / "s24_metrics_table.json",
         extra_components=[
             Div(id=f"{BENCHMARK_NAME}-figure-placeholder"),

ml_peg/app/surfaces/elemental_slab_oxygen_adsorption/app_elemental_slab_oxygen_adsorption.py

@@ -15,6 +15,7 @@
 from ml_peg.calcs.models.models import MODELS
 
 BENCHMARK_NAME = "Elemental Slab Oxygen Adsorption"
+DOCS_URL = "https://ddmms.github.io/ml-peg/user_guide/benchmarks/surfaces.html#elemental-slab-oxygen-adsorption"
 DATA_PATH = APP_ROOT / "data" / "surfaces" / "elemental_slab_oxygen_adsorption"
 
 
@@ -65,6 +66,7 @@ def get_app() -> ElementalSlabOxygenAdsorptionApp:
             "Performance in predicting adsorption energies of oxygen "
             "on elemental slabs."
         ),
+        docs_url=DOCS_URL,
         table_path=DATA_PATH / "elemental_slab_oxygen_adsorption_metrics_table.json",
         extra_components=[
             Div(id=f"{BENCHMARK_NAME}-figure-placeholder"),

ml_peg/app/utils/build_components.py

@@ -2,11 +2,12 @@
 
 from __future__ import annotations
 
+from dash import html
 from dash.dash_table import DataTable
 from dash.dcc import Input as DCC_Input
 from dash.dcc import Slider, Store
 from dash.development.base_component import Component
-from dash.html import H2, H3, Br, Button, Div, Label
+from dash.html import H2, H3, Br, Button, Details, Div, Label, Summary
 
 from ml_peg.app.utils.register_callbacks import (
     register_summary_table_callbacks,
@@ -139,6 +140,7 @@ def build_test_layout(
     description: str,
     table: DataTable,
     extra_components: list[Component] | None = None,
+    docs_url: str | None = None,
 ) -> Div:
     """
     Build app layout for a test.
@@ -153,6 +155,8 @@ def build_test_layout(
         Dash Table with metric results.
     extra_components
         List of Dash Components to include after the metrics table.
+    docs_url
+        URL to online documentation. Default is None.
 
     Returns
     -------
@@ -162,9 +166,34 @@ def build_test_layout(
     layout_contents = [
         H2(name, style={"color": "black"}),
         H3(description),
-        Div(table),
     ]
 
+    layout_contents.extend(
+        [
+            Details(
+                [
+                    Summary(
+                        "Click for more information",
+                        style={
+                            "cursor": "pointer",
+                            "fontWeight": "bold",
+                            "padding": "5px",
+                        },
+                    ),
+                    Label([html.A("Online documentation", href=docs_url)]),
+                ],
+                style={
+                    # "border": "1px solid #ddd",
+                    "padding": "10px",
+                    # "borderRadius": "5px",
+                },
+            ),
+            Br(),
+        ]
+    )
+
+    layout_contents.append(Div(table))
+
     layout_contents.append(
         Store(
             id="summary-table-scores-store",