ABC-Center · NetZissou · Jun 11, 2026 · Jun 16, 2026 · Jul 7, 2026 · Jul 8, 2026
diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml
@@ -2,7 +2,9 @@ name: Run tests
 
 on:
   pull_request:
-    branches: [main]
+    branches:
+        - 'main'
+        - 'dev'
 
 jobs:
   test:

diff --git a/.zenodo.json b/.zenodo.json
@@ -6,12 +6,13 @@
           "affiliation": "The Ohio State University"
       }
     ],
-    "description": "<p>Catalog app for ABC Center code, data, models, and spaces hosted on GitHub and Hugging Face. Centralized resource to search ABC Center-affiliated products, the content is updated in real-time through calls to the GitHub and Hugging Face APIs. This repository was generated from the Imageomics Catalog Template.</p>\n<p>Catalog website: <a href=\"https://ABC-Center.github.io/catalog/\">ABC-Center.github.io/catalog/</a>.</p>\n<p>.</p>",
+    "description": "<p>Catalog app for ABC Center code, data, models, and demos hosted on GitHub and Hugging Face. Centralized resource to search ABC Center-affiliated products, the content is updated in real-time through calls to the GitHub and Hugging Face APIs. This repository was generated from the Imageomics Catalog Template.</p>\n<p>Catalog website: <a href=\"https://ABC-Center.github.io/catalog/\">ABC-Center.github.io/catalog/</a>.</p>\n<p>.</p>",
     "keywords": [
       "code",
       "data",
       "models",
       "spaces",
+      "demos",
       "GitHub",
       "Hugging Face",
       "APIs",

diff --git a/CITATION.cff b/CITATION.cff
@@ -1,4 +1,4 @@
-abstract: "Catalog app for ABC Center code, data, models, and spaces hosted on GitHub and Hugging Face. Centralized resource to search ABC Center-affiliated products, the content is updated in real-time through calls to the GitHub and Hugging Face APIs. This repository was generated from the Imageomics Catalog Template."
+abstract: "Catalog app for ABC Center code, data, models, and demos hosted on GitHub and Hugging Face. Centralized resource to search ABC Center-affiliated products, the content is updated in real-time through calls to the GitHub and Hugging Face APIs. This repository was generated from the Imageomics Catalog Template."
 authors:
 - family-names: "Campolongo"
   given-names: "Elizabeth G."
@@ -18,6 +18,7 @@ keywords:
   - data
   - models
   - spaces
+  - demos
   - "GitHub"
   - "Hugging Face"
   - APIs

diff --git a/README.md b/README.md
@@ -1,20 +1,20 @@
 # AI & Biodiversity Change Global Center Catalog
 
-Repository for web-based ABC Center code, data, model, and spaces catalog. This catalog is designed to use the GitHub API for searching all code repositories created under the [ABC GitHub Organization](https://github.com/ABC-Center) and the Hugging Face API for searching all dataset, model, and spaces repositories created under the [ABC Hugging Face Organization](https://huggingface.co/ABC-Center). Non-ABC Org GitHub and Hugging Face repositories can be manually included through the `ADDITIONAL_REPOS` and `ADDITIONAL_HF_REPOS` parameters, respectively, in the [config file](public/config.yaml). 
+Repository for web-based catalog of ABC Center code, data, model, and demos. This catalog is designed to use the GitHub API for searching all code repositories created under the [ABC GitHub Organization](https://github.com/ABC-Center) and the Hugging Face API for searching all dataset, model, and spaces repositories created under the [ABC Hugging Face Organization](https://huggingface.co/ABC-Center). Non-ABC Org GitHub and Hugging Face repositories can be manually included through the `ADDITIONAL_REPOS` and `ADDITIONAL_HF_REPOS` parameters, respectively, in the [config file](public/config.yaml). 
 
 This repository was generated and personalized from the [Imageomics Catalog](https://github.com/Imageomics/catalog). The following sections are pulled from the source repo.
 
 ## Features
 
 The website is styled using the [tailwindcss](https://tailwindcss.com/) package.
 
-* **Real-time Data Fetching:** Displays all public ABC Center repositories, fetched through the GitHub and Hugging Face APIs. Includes semantically meaningful virtual markers:
+* **Real-time Data Fetching:** Displays all public ABC Center repositories, fetched through the code platform (GitHub) and Hugging Face APIs. Includes semantically meaningful virtual markers:
     * "New" badge highlights products created within the last 30 days;
-    * "🚀 version-tag" badge indicates a new release within the last 2 weeks for GitHub repos, and links to that release;
-    * Star (⭐️) or like (❤️) counts displayed for GitHub or Hugging Face repos, respectively;
-    * Archived badge flags GitHub repos no longer under active development (read-only).
+    * "🚀 version-tag" badge indicates a new release within the last 2 weeks for code repos, and links to that release;
+    * Star (⭐️) or like (❤️) counts displayed for code platform or Hugging Face repos, respectively;
+    * Archived badge flags code repos no longer under active development (read-only).
 * **Search Functionality:** Quickly find items by keyword.
-* **Filtering:** Filter by repository type (Code, Datasets, Models, Spaces) and tags. Optionally include archived GitHub repos.
+* **Filtering:** Filter by repository type (Code, Datasets, Models, Spaces) and tags. Optionally include archived code repos.
 * **Sorting:** Sort items by last updated, date created, stars/likes ascending or descending, or alphabetically.
 * **URL Parameter Support:** Persist and share search states via URL hash (`#type=datasets&q=fish`) or query parameters (`?type=datasets`). Supports `type`, `q` (search query), `sort`, and `tag` parameters.
 * **Responsive Design:** The layout is optimized for use on computers and mobile devices.
@@ -28,12 +28,17 @@ The site runs based on four primary files:
 * `public/config.yaml`: Contains all customizable settings including organization names, colors, branding, and API settings. This is the main file to edit for personalization. Placed in `public/` so Vite copies it to `dist/` without bundling, keeping it editable after deployment.
 * `index.html`: The main HTML file that provides the structure of the webpage and links to the CSS and JavaScript files. Config values are applied dynamically from `config.yaml`.
 * `style.css`: Custom styling for the application, including color schemes, layout, and animations. Colors are set via CSS custom properties that are populated from `config.yaml`.
-* `main.js`: Handles the application's logic, including config loading, API calls, data filtering, sorting, and dynamic rendering of the catalog items. Relies on the build-time Node script `fetch-releases.js` for version-tag badge feature.
+* `main.js`: Application manager, handles config loading, event listeners, and coordinates UI updates based on API fetches for dynamic rendering of the catalog items.
+* `src/`: Modular application logic, organized by purpose:
+    * `api/`: Data fetching modules for external platforms (code and Hugging Face).
+    * `ui/`: DOM manipulation, HTML templating, and URL/State routing.
+    * `utils/`: Utility functions such as data filtering, sorting, and tag (keyword) normalization. 
 
 Two additional files support the build tooling:
 
 * `package.json`: Declares npm dependencies (`vite`, `tailwindcss`, `@tailwindcss/vite`) and defines the `dev`, `build`, and `preview` scripts.
 * `vite.config.js`: Vite configuration that registers the Tailwind CSS plugin.
+* `scripts/fetch-releases.js`: Build-time Node script to fetch GitHub repo release data for version-tag badge feature.
 
 ### Formatting Standard
 

diff --git a/docs/personalization.md b/docs/personalization.md
@@ -4,12 +4,13 @@ Welcome to your new catalog repo! The primary way to personalize this catalog is
 
 ## Primary Configuration File
 
-[**`public/config.yaml`**](../public/config.yaml): This is the main file to edit. It contains all configuration options (e.g., organization names, colors, branding, and API settings) with inline comments explaining each setting. Replace Imageomics-specific values with those appropriate for your organzation and catalog repository.
+[**`public/config.yaml`**](../public/config.yaml): This is the main file to edit. It contains all configuration options (e.g., organization names, colors, branding, and API settings) with inline comments explaining each setting. Replace Imageomics-specific values with those appropriate for your organization and catalog repository.
 
 ### Organization & Repository Settings
 
-  * `ORGANIZATION_NAME`: Your GitHub/Hugging Face organization name (lowercase for API calls)
-  * `ORG_NAME`: Display name for your organization (can differ from API name); used as fallback site title if `CATALOG_TITLE` is not set
+  * `ORGANIZATION_NAME`: Your code platform (e.g., GitHub) organization name (for API calls)
+  * `HF_ORGANIZATION_NAME`: Your Hugging Face organization name (**case-sensitive**, for API calls)
+  * `ORG_NAME`: Display name for your organization (can differ from API name); used for logo alt-text and as fallback site title if `CATALOG_TITLE` is not set
   * `CATALOG_REPO_NAME`: Repository name for the catalog itself (used for stats badge)
 
 ### Branding
@@ -31,7 +32,7 @@ Welcome to your new catalog repo! The primary way to personalize this catalog is
 
 ### API & Behavior Settings
 
-  * `PLATFORM`: Coding platform used (default: 'github', Codeberg and GitLab support in development)
+  * `PLATFORM`: Coding platform used: 'github', 'codeberg', or 'gitlab' (default: 'github'). Please see [notes on platform setup](#non-github-code-repository-platform-setup) if using for non-GitHub code repositories
   * `API_BASE_URL`: Hugging Face API base URL (default: `"https://huggingface.co/api/"`)
   * `REFRESH_INTERVAL_DAYS`: Number of days to consider an item "new" (default: `30`)
   * `ADDITIONAL_REPOS`: Array of forked or non-org GitHub repositories to include, formatted `<owner>/<repo-name>` (non-forks are included by default). Use `[]` if there are none you wish to include
@@ -87,3 +88,122 @@ When first setting up your catalog, run the export script to generate a full lis
 > **Required token**: The weekly tag scan workflow requires a fine-grained access token with **Pull requests: Read and write** permission on the catalog repo. Follow the instructions in [App Authentication](app-authentication.md) to create and install a private Catalog Automation App for token generation.
 
 See **[tag-grouping-process.md](tag-grouping-process.md)** for full setup instructions, conventions, and guidance on using AI assistance for the initial grouping pass.
+
+## Non-GitHub Code Repository Platform Setup
+
+The default code repository platform for this catalog is GitHub. If you wish to use another supported platform (Codeberg or GitLab), please note that the workflows will require token and potentially other platform-specific updates if running from a non-GitHub repository. Otherwise, this app is set up to be able to run from Codeberg or GitLab to fetch and display repositories from the respective platform.
+
+Example configs, as used in testing the Catalog template for non-GitHub code platforms, are provided below.
+
+### Sample Codeberg Config
+
+```yaml
+# Configuration file for Catalog Template
+# Customize these values to personalize the catalog for your organization
+
+# Organization & Repository Settings
+ORGANIZATION_NAME: forgejo          # Codebase platform organization name (for API calls)
+HF_ORGANIZATION_NAME: imageomics    # Hugging Face organization name (case-sensitive, for API calls)
+ORG_NAME: Forgejo                   # Display name for Codebase platform organization (can differ from API name)
+CATALOG_REPO_NAME: forgejo          # Repository name for the catalog itself (used for stats badge)
+
+# Branding
+CATALOG_TITLE: Fake Forgejo Catalog
+CATALOG_DESCRIPTION: "Explore and discover public code, datasets, models, and spaces."
+LOGO_URL: "https://github.com/Imageomics/Imageomics-guide/raw/3478acc0068a87a5604069d04a29bdb0795c2045/docs/logos/Imageomics_logo_butterfly.png"
+FAVICON_URL: "https://github.com/Imageomics/Imageomics-guide/raw/3478acc0068a87a5604069d04a29bdb0795c2045/docs/logos/Imageomics_logo_butterfly.png"
+
+# Colors (CSS custom properties)
+COLORS:
+  primary: "#92991c"      # Primary brand color (Imageomics Green)
+  secondary: "#5d8095"    # Secondary brand color (Imageomics Blue)
+  accent: "#0097b2"       # Accent color (Dark Teal)
+  accentDark: "#4fd1eb"   # Dark mode accent color (Light Cyan)
+  tag: "#9bcb5e"          # Tag background color (Light Green)
+
+# API & Behavior Settings
+# Codebase platform for API calls and link generation. Supported values: "github", "codeberg", or "gitlab".
+PLATFORM: codeberg
+# Dataset, model, and space (demo) default: Hugging Face, other platforms would require a custom module
+API_BASE_URL: "https://huggingface.co/api/"
+# Define "new" repository criteria
+REFRESH_INTERVAL_DAYS: 30
+
+# Array of "owner/repo" strings to include in addition to non-forked org repos.
+# Use this for forked repos within the org and repos outside the org entirely.
+ADDITIONAL_REPOS: []
+
+# Array of Hugging Face repos from outside the org to include.
+# Each entry must specify "repo" (owner/name) and "type" (datasets, models, or spaces).
+# ADDITIONAL_HF_REPOS:
+#   - repo: "user/dataset-name"
+#     type: "datasets"
+#   - repo: "user/model-name"
+#     type: "models"
+#   - repo: "user/space-name"
+#     type: "spaces"
+ADDITIONAL_HF_REPOS:
+  - repo: "yoohj0416/predictbeetle"
+    type: "models"
+
+# Typography
+FONT_FAMILY: Inter    # Font family for the site
+```
+
+### Sample GitLab Config
+
+```yaml
+# Configuration file for Catalog Template
+# Customize these values to personalize the catalog for your organization
+
+# Organization & Repository Settings
+ORGANIZATION_NAME: GitLab-com       # Codebase platform organization name (for API calls)
+HF_ORGANIZATION_NAME: imageomics    # Hugging Face organization name (case-sensitive, for API calls)
+ORG_NAME: Imageomics                # Display name for Codebase platform organization (can differ from API name)
+CATALOG_REPO_NAME: www-gitlab-com          # Repository name for the catalog itself (used for stats badge)
+
+# Branding
+CATALOG_TITLE: Fake GitLab.com Catalog
+CATALOG_DESCRIPTION: "Explore and discover public code, datasets, models, and demos."
+LOGO_URL: "https://github.com/Imageomics/Imageomics-guide/raw/3478acc0068a87a5604069d04a29bdb0795c2045/docs/logos/Imageomics_logo_butterfly.png"
+FAVICON_URL: "https://github.com/Imageomics/Imageomics-guide/raw/3478acc0068a87a5604069d04a29bdb0795c2045/docs/logos/Imageomics_logo_butterfly.png"
+
+# Colors (CSS custom properties)
+COLORS:
+  primary: "#92991c"      # Primary brand color (Imageomics Green)
+  secondary: "#5d8095"    # Secondary brand color (Imageomics Blue)
+  accent: "#0097b2"       # Accent color (Dark Teal)
+  accentDark: "#4fd1eb"   # Dark mode accent color (Light Cyan)
+  tag: "#9bcb5e"          # Tag background color (Light Green)
+
+# API & Behavior Settings
+# Codebase platform for API calls and link generation. Supported values: "github", "codeberg", or "gitlab".
+PLATFORM: gitlab
+# Dataset, model, and demo default: Hugging Face, other platforms would require a custom module
+API_BASE_URL: "https://huggingface.co/api/"
+# Define "new" repository criteria
+REFRESH_INTERVAL_DAYS: 30
+
+# Array of "owner/repo" strings to include in addition to non-forked org repos.
+# Use this for forked repos within the org and repos outside the org entirely.
+ADDITIONAL_REPOS:
+  - "spectrelonewolf/proyectoprofesionalcore1" # ex: https://gitlab.com/spectrelonewolf/proyectoprofesionalcore1
+
+# Array of Hugging Face repos from outside the org to include.
+# Each entry must specify "repo" (owner/name) and "type" (datasets, models, or spaces/demos).
+# Organization names are case-sensitive in the Hugging Face API.
+# ADDITIONAL_HF_REPOS:
+#   - repo: "user/dataset-name"
+#     type: "datasets"
+#   - repo: "user/model-name"
+#     type: "models"
+#   - repo: "user/space-name"
+#     type: "spaces"
+ADDITIONAL_HF_REPOS:
+  - repo: "yoohj0416/predictbeetle"
+    type: "models"
+
+# Typography
+FONT_FAMILY: Inter    # Font family for the site
+
+```
diff --git a/docs/tag-grouping-process.md b/docs/tag-grouping-process.md
@@ -2,11 +2,16 @@
 
 ## What Are Tag Groups?
 
-Tags on GitHub repos (topics) and Hugging Face repos (card metadata) are free-form text, so
+Tags on code platform[^1] repos (topics) and Hugging Face repos (card metadata) are free-form text, so
 the same concept often appears under multiple spellings: `computer-vision`, `computer vision`,
 `cv`. Tag groups normalize this noise so the catalog filter dropdown shows one clean canonical
 tag instead of a dozen near-duplicates.
 
+> [!NOTE]
+> This workflow has only been run on GitHub. It may need platform-based adjustments to function as expected on other code platforms, such as Codeberg or GitLab.
+
+[^1]: GitHub, Codeberg, and GitLab.
+
 Tag groups live in **`public/tag-groups.js`** as a plain JavaScript object:
 
 ```js
@@ -19,8 +24,7 @@ const TAG_GROUPS = {
 - The **key** (`"canonical tag"`) is the display tag shown in the UI filter dropdown.
 - The **value array** lists every raw API tag that should be normalized to that key.
 - Raw tags not present in any array pass through unchanged and appear as-is in the UI.
-- Raw tags that contain a colon (e.g. `license:mit`, `format:parquet`) are automatically
-  filtered out as Hugging Face system metadata so they never reach the UI. This can be changed in [src/normalizeTag.js](../src/normalizeTag.js), by removing the marked option line.
+- Raw tags that contain a colon (e.g. `license:mit`, `format:parquet`) are automatically filtered out as Hugging Face system metadata so they never reach the UI. This can be changed in [src/normalizeTag.js](../src/normalizeTag.js), by removing the marked option lines in `normalizeTag` and `filterDisplayTags`.
 - Raw tags are maintained and matched-against for keyword searching and do appear in repo cards.
 
 ---
-Original file line number
+Diff line change
@@ Expand Up / @@ -2,7 +2,9 @@ name: Run tests @@
     on:
       pull_request:
-        branches: [main]
+        branches:
+            - 'main'
+            - 'dev'
     jobs:
       test:
@@ Expand Down @@