On-Ramps Resource Catalog implementation start

access-ci-org · Sep 18, 2024 · df79c21 · df79c21
1 parent 3b231b0
commit df79c21
Show file tree

Hide file tree

Showing 22 changed files with 10,617 additions and 2,430 deletions.
diff --git a/README.md b/README.md
@@ -32,6 +32,7 @@ This component provides a user interface to browse available Resources and their
 | `allowedFilters`     | A list of filters you want users to see. Ex: `["GPU Compute"]`                                                         | **False** |
 | `excludedCategories` | A list of filter **categories** that you want hidden from users. Ex: `["Specialized Support", "Specialized Hardware"]` | **False** |
 | `excludedFilters`    | A list of filters that you want hidden from users. Ex: `["ACCESS Allocated", "ACCESS OnDemand"]`                       | **False** |
+| `excludedResources` | A list of Resources that you want hidden from users. Ex: `["ACCESS Credits"]`  | **False** |
 | `target`             | The DOM element where the component will be rendered.                                                                  | **True**  |
 
 Note: Avoid combining `allowedCategories` and `excludedCategories`, or `allowedFilters` and `excludedFilters`. If an invalid combination is found, it will default to what is specified in the `allowed*` options

diff --git a/index.html b/index.html
@@ -4,23 +4,24 @@
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>XRAS User Interface Components</title>
-    <link
+    <!-- <link
       href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
       rel="stylesheet"
       integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN"
       crossorigin="anonymous"
     />
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.min.css"> -->
   </head>
   <body>
-    <div class="container">
-      <div id="projects-react"></div>
-    </div>
+
+    <div id="resource-catalog-react"></div>
+
     <script type="module">
-      import { projects } from "/src/main.jsx";
-      projects(
-        { target: document.getElementById("projects-react") },
-        "testuser1"
-      );
+      import { resourceCatalog, shadowTarget } from "http://localhost:3000/xras-ui.js";
+      resourceCatalog({
+        target: shadowTarget(document.getElementById("resource-catalog-react"), {accessStyles: true}),
+        onRamps: true,
+      });
     </script>
   </body>
 </html>