docs: update webapp for repo-review 0.12.1

Signed-off-by: Henry Schreiner <[email protected]>

Author: henryiii

docs/_includes/interactive_repo_review.html

@@ -20,9 +20,9 @@
     <App
       header={false}
       deps={[
-        "repo-review~=0.11.3",
+        "repo-review~=0.12.1",
         "sp-repo-review==2025.01.22",
-        "validate-pyproject-schema-store==2025.01.20",
+        "validate-pyproject-schema-store==2025.02.03",
         "validate-pyproject[all]~=0.22.0",
       ]}
     />,

docs/assets/js/webapp.js

@@ -33,7 +33,6 @@ function IfUrlLink({ name, url, color }) {
     return (
       <MaterialUI.Typography
         sx={{ display: "inline" }}
-        component="span"
         variant="body2"
         color={color}
         component="a"
@@ -94,7 +93,7 @@ function Results(props) {
           variant="body2"
           color="text.disabled"
         >
-          {" [skipped]"}
+          {` [skipped] ${result.skip_reason}`}
         </MaterialUI.Typography>
       );
       const msg = (
@@ -192,14 +191,16 @@ function MyThemeProvider(props) {
 class App extends React.Component {
   constructor(props) {
     super(props);
-    const deps_str = props.deps.join(" ");
+    const inner_deps_str = props.deps.join("\n");
+    const deps_str = `<pre><code>${inner_deps_str}</code></pre>`;
     this.state = {
       results: [],
       repo: urlParams.get("repo") || "",
       branch: urlParams.get("branch") || "",
-      msg: `${DEFAULT_MSG} Packages: ${deps_str}`,
+      msg: `<p>${DEFAULT_MSG}</p><h4>Packages:</h4> ${deps_str}`,
       progress: false,
       err_msg: "",
+      skip_reason: "",
       url: "",
     };
     this.pyodide_promise = prepare_pyodide(props.deps);
@@ -229,20 +230,19 @@ class App extends React.Component {
       var families_checks;
       try {
         families_checks = pyodide.runPython(`
-          from pyodide.http import open_url
           from repo_review.processor import process, md_as_html
           from repo_review.ghpath import GHPath
-
-          GHPath.open_url = staticmethod(open_url)
+          from dataclasses import replace
 
           package = GHPath(repo="${state.repo}", branch="${state.branch}")
-          result = process(package)
+          families, checks = process(package)
 
-          for v in result[0].values():
+          for v in families.values():
               if v.get("description"):
                   v["description"] = md_as_html(v["description"])
+          checks = [res.md_as_html() for res in checks]
 
-          result
+          (families, checks)
           `);
       } catch (e) {
         if (e.message.includes("KeyError: 'tree'")) {
@@ -279,8 +279,9 @@ class App extends React.Component {
           name: val.name.toString(),
           description: val.description.toString(),
           state: val.result,
-          err_msg: val.err_as_html().toString(),
+          err_msg: val.err_msg.toString(),
           url: val.url.toString(),
+          skip_reason: val.skip_reason.toString(),
         });
       }
 
@@ -366,7 +367,7 @@ class App extends React.Component {
           <MaterialUI.Paper elevation={3}>
             <MaterialUI.Box sx={{ p: 2 }}>
               <MaterialUI.Typography variant="body1" component="div">
-                {this.state.msg}
+                <span dangerouslySetInnerHTML={{ __html: this.state.msg }} />
               </MaterialUI.Typography>
               {this.state.progress && <MaterialUI.LinearProgress />}
               {this.state.err_msg && (