apps.html

---
permalink: /apps
layout: article
title: "Solid Applications"
description: "Solid returns the web to its original vision of empowering individuals and enabling collaboration. You choose which applications to use with your data rather than being locked into specific platforms."
image: "/assets/img/graphics/store-anything-medium.svg"
breadcrumbs:
- title: "Solid Applications"
---

<div datatype="rdf:HTML" property="description">
  <p>Solid returns the web to its original vision of empowering individuals and enabling collaboration. You choose which applications to use with your data rather than being locked into specific platforms.</p>
  <p>You can now use the app launcher to discover and launch Solid applications.</p>
  <p>Before you use any of the Solid apps, you need to <a href="/get_a_pod">get a Solid personal online data store</a> (Pod) first.</p>
</div>

<section resource="#app_launcher" inlist="" rel="hasPart" class="article-section">
  <h2 id="app_launcher" property="name">App Launcher</h2>
  <div datatype="rdf:HTML" property="description">
    <div class="sort-controls">
      <div class="control-group">
        <label for="sort-select">Sort by:</label>
        <select id="sort-select">
          <option value="">Default Order</option>
          <option value="name-asc">Name (A-Z)</option>
          <option value="name-desc">Name (Z-A)</option>
          <option value="category-asc">Category (A-Z)</option>
          <option value="category-desc">Category (Z-A)</option>
        </select>
      </div>
      <div class="control-group">
        <label for="category-filter">Filter by category:</label>
        <select id="category-filter">
          <option value="all">All Categories</option>
          <option value="Chat">Chat</option>
          <option value="Cooking">Cooking</option>
          <option value="Health">Health</option>
          <option value="Location">Location</option>
          <option value="Movies">Movies</option>
          <option value="Content, Notes, Blogging and Publishing">Content, Notes, Blogging and Publishing</option>
          <option value="Productivity">Productivity</option>
          <option value="Pod Management">Pod Management</option>
          <option value="Scheduling">Scheduling</option>
          <option value="Security">Security</option>
          <option value="TODO List">TODO List</option>
        </select>
      </div>
      <div class="control-group">
        <label class="checkbox-label">
          <input type="checkbox" id="top-apps-only">
          <span class="checkmark"></span>
          Show only first time user apps
        </label>
      </div>
    </div>
    <style>
      /* Keep inline links inside app descriptions on the same line */
      #apps-list li p a {
        display: inline !important;
        vertical-align: baseline;
      }
      /* Source-code paragraph rendered below the primary tile link so
         its anchor is not nested inside the outer tile <a>. */
      #apps-list li .app-source {
        margin: 0 1.5rem 1.5rem 1.5rem;
        font-size: 0.9em;
      }
      /* Reset the tile-level "a is a big flex block" rules (see
         .tiles.tile-links a in base.css) for the source-code anchor so
         it renders as a normal inline link. */
      #apps-list li .app-source a {
        display: inline !important;
        padding: 0;
        width: auto;
        height: auto;
        flex-grow: 0;
        color: var(--link-color, #1a73e8);
        text-decoration: underline;
      }
      #apps-list li .app-source a:focus-visible {
        outline: 2px solid #1a73e8;
        outline-offset: 2px;
      }
    </style>
    <ul class="tiles tile-links" id="apps-list">
      <li data-name="The ODI Solid File Manager" data-category="Pod Management">
        <a href="https://solid-file-manager.theodi.org/">
          <div class="tile-header">
            <div style="width:100px; height:56px; display:flex; align-items:center; justify-content:center;">
              <img alt="Solid file manager logo" src="/assets/img/logo/file-manager-logo.svg" style="width:100%; height:100%; object-fit:contain;"/>
            </div>
            <h3>The ODI Solid File Manager<span class="top-app-tag">★</span></h3>
          </div>
          <p>This application provides a user-friendly interface for managing files and folders in Solid Pods.</p>
        </a>
        <p class="app-source">Source code on <a href="https://github.com/solid/solid-file-manager" class="external-link" rel="noopener noreferrer">GitHub (solid/solid-file-manager)</a>.</p>
      </li>
      <li data-name="Media Kraken" data-category="Movies">
        <a href="https://noeldemartin.github.io/media-kraken/">
          <div class="tile-header">
            <img alt="Media Kraken Logo - an Octopus" src="/assets/img/logo/media-kraken.svg"/>
            <h3>Media Kraken<span class="top-app-tag">★</span></h3>
          </div>
          <p>An app that helps you keep track of movies and create your own collections.</p>
        </a>
      </li>
      <li data-name="Penny" data-category="Pod Management">
        <a href="https://penny.vincenttunru.com/">
          <div class="tile-header">
            <img alt="Solid logo - an uppercase S on a violet hexagon" src="/assets/img/solid-emblem.svg"/>
            <h3>Penny<span class="top-app-tag">★</span></h3>
          </div>
          <p>A general Pod Browser by Vincent Tunru.</p>
        </a>
      </li>
      <li data-name="Umai" data-category="Cooking">
        <a href="https://umai.noeldemartin.com">
          <div class="tile-header">
            <img alt="Umai logo - a large Udon bowl" src="/assets/img/logo/umai.png"/>
            <h3>Umai</h3>
          </div>
          <p>An offline-first Recipes Manager by Noel De Martin.</p>
        </a>
      </li>
      <li data-name="0data Hello with Solid" data-category="TODO List">
        <a href="https://hello.0data.app/solid/">
          <div class="tile-header">
            <img alt="0 data app logo" src="/assets/img/logo/0dataapp.png"/>
            <h3>0data Hello with Solid</h3>
          </div>
          <p>Implements simple CRUD operations with the REST API and solid-file-client, writing to 'tasks'.</p>
        </a>
      </li>
      <li data-name="Booklice" data-category="Content, Notes, Blogging and Publishing">
        <a href="https://scenaristeur.github.io/booklice/">
          <div class="tile-header">
            <img alt="Booklice logo" src="/assets/img/logo/booklice.png"/>
            <h3>Booklice</h3>
          </div>
          <p>A bookmarking app with community sharing features.</p>
        </a>
      </li>
      <li data-name="dokieli" data-category="Content, Notes, Blogging and Publishing">
        <a href="https://dokie.li/">
          <div class="tile-header">
            <img alt="dokieli logo - a lowercase d" src="/assets/img/logo/dokieli.png"/>
            <h3>dokieli</h3>
          </div>
          <p>A clientside editor for decentralised article publishing, annotations, and social interactions by Sarven Capadisli.</p>
        </a>
      </li>
      <li data-name="Pod Pro" data-category="Pod Management">
        <a href="https://podpro.dev/">
          <div class="tile-header">
            <img alt="Solid logo - an uppercase S on a violet hexagon" src="/assets/img/solid-emblem.svg"/>
            <h3>Pod Pro</h3>
          </div>
          <p>An IDE for editing Solid Pods by Jasmine Leonard.</p>
        </a>
      </li>
      <li data-name="PodOS Browser" data-category="Pod Management">
        <a href="https://browser.pod-os.org/">
          <div class="tile-header">
            <img alt="PodOS browser logo - a Pod inside a house" src="/assets/img/logo/podos-browser.svg"/>
            <h3>PodOS Browser</h3>
          </div>
          <p>A Solid app for browsing and managing the resources in your Pod.</p>
        </a>
      </li>
      <li data-name="Solid File Manager" data-category="Pod Management">
        <a href="https://otto-aa.github.io/solid-filemanager/">
          <div class="tile-header">
            <img alt="Solid File Manager logo" src="/assets/img/logo/solid-filemanager.ico"/>
            <h3>Solid File Manager</h3>
          </div>
          <p>A Solid app that helps you manage the files in your Pod by Otto AA.</p>
        </a>
      </li>
      <li data-name="Solidflix" data-category="Movies">
        <a href="https://oxfordhcc.github.io/solid-media/">
          <div class="tile-header">
            <img alt="Solid Flix logo - SOLIDFLIX capitalized" src="/assets/img/logo/solidflix.png"/>
            <h3>Solidflix</h3>
          </div>
          <p>A movie tracking and sharing app with personalised recommendations by Oxford Human Centred Computing Group.</p>
        </a>
      </li>
      <li data-name="NotePod" data-category="Productivity">
        <a href="https://notepod.solidcommunity.au">
          <div class="tile-header">
            <img alt="NotePod logo" src="/assets/img/logo/notepod.png"/>
            <h3>NotePod</h3>
          </div>
          <p>Private and shareable note taking app with encryption. Built by the Software Innovation Institute, ANU.</p>
        </a>
        <p class="app-source">Desktop build on <a href="https://github.com/anusii/notepod" class="external-link" rel="noopener noreferrer">GitHub (anusii/notepod)</a>.</p>
      </li>
      <li data-name="HealthPod" data-category="Health">
        <a href="https://healthpod.solidcommunity.au">
          <div class="tile-header">
            <img alt="HealthPod logo" src="/assets/img/logo/healthpod.svg"/>
            <h3>HealthPod</h3>
          </div>
          <p>Manage your health data, with support for encrypted data. Built by the Software Innovation Institute, ANU.</p>
        </a>
        <p class="app-source">Desktop build on <a href="https://github.com/anusii/healthpod" class="external-link" rel="noopener noreferrer">GitHub (anusii/healthpod)</a>.</p>
      </li>
      <li data-name="MovieStar" data-category="Movies">
        <a href="https://moviestar.solidcommunity.au">
          <div class="tile-header">
            <img alt="MovieStar logo" src="/assets/img/logo/moviestar.png"/>
            <h3>MovieStar</h3>
          </div>
          <p>Track your movie and TV watching and ranking, share with others, and receive recommendations, with support for encrypted data. Built by the Software Innovation Institute, ANU.</p>
        </a>
        <p class="app-source">Desktop build on <a href="https://github.com/anusii/moviestar" class="external-link" rel="noopener noreferrer">GitHub (anusii/moviestar)</a>.</p>
      </li>
      <li data-name="SolidFocus" data-category="Browser">
        <a href="https://focus.noeldemartin.com/">
          <div class="tile-header">
            <img alt="SolidFocus logo" src="/assets/img/logo/solidfocus.png"/>
            <h3>SolidFocus</h3>
          </div>
          <p>Manage your tasks and notes seamlessly across workspaces and lists, with offline access, Markdown support, and data stored securely in your Solid POD. Built by Noel de Martin.</p>
        </a>
      </li>
      <li data-name="Portable LibreChat" data-category="Chat">
        <a href="https://chat.solidproject.org/">
          <div class="tile-header">
            <img alt="LibreChat logo" src="/assets/img/logo/librechat.svg"/>
            <h3>Portable LibreChat</h3>
          </div>
          <p>A build of LibreChat — an open-source AI chat platform that unifies conversations across providers like Anthropic, OpenAI, and Azure — with Solid integrated so that your chat history is stored in your Solid Pod, making your AI conversations portable across compatible clients.</p>
        </a>
        <p class="app-source">Upstream project: <a href="https://www.librechat.ai/" class="external-link" rel="noopener noreferrer">librechat.ai</a>. Source code on <a href="https://github.com/solid/LibreChat" class="external-link" rel="noopener noreferrer">GitHub (solid/LibreChat)</a>.</p>
      </li>
      <li data-name="TiredBike" data-category="Travel">
        <a href="https://tired.bike/">
          <div class="tile-header">
            <img alt="TiredBike logo" src="/assets/img/logo/tiredbike.png"/>
            <h3>Tired Bike</h3>
          </div>
          <p>A Decentralised platform for a community of bicycle touring travellers and those who want to host them. Built by Open Hospitality Network.</p>
        </a>
      </li>
      <li data-name="PodCal" data-category="Scheduling">
        <a href="https://podcal.eu">
          <div class="tile-header">
            <img alt="PodCal logo - a shield with a calendar and check mark" src="/assets/img/logo/podcal.svg"/>
            <h3>PodCal</h3>
          </div>
          <p>A Calendly-style scheduling app built on Solid Pods, with public booking pages, CalDAV sync, and team scheduling — works with any Solid OIDC provider.</p>
        </a>
      </li>
      <li data-name="SolidOS Databrowser" data-category="Pod Management">
        <a href="https://solidos.github.io/mashlib/dist/browse.html">
          <div class="tile-header">
            <img alt="Solid logo - an uppercase S on a violet hexagon" src="/assets/img/solid-emblem.svg"/>
            <h3>SolidOS Databrowser</h3>
          </div>
          <p>The classic Solid Data Browser (Mashlib) — a generic Linked Data browser and editor for any Solid Pod, maintained by the SolidOS team.</p>
        </a>
        <p class="app-source">Source code on <a href="https://github.com/SolidOS/mashlib" class="external-link" rel="noopener noreferrer">GitHub (SolidOS/mashlib)</a>.</p>
      </li>
      <li data-name="Synara AI" data-category="Productivity">
        <a href="https://ai.privatedatapod.com/">
          <div class="tile-header">
            <img alt="Synara AI logo" src="/assets/img/logo/synara-ai.svg"/>
            <h3>Synara AI</h3>
          </div>
          <p>A privacy-first AI assistant that builds a searchable log of your conversations in your own Solid Pod. Built by the PrivateDataPod team.</p>
        </a>
      </li>
      <li data-name="Pod Drive" data-category="Pod Management">
        <a href="https://drive.privatedatapod.com/">
          <div class="tile-header">
            <img alt="Pod Drive logo" src="/assets/img/logo/pod-drive.svg"/>
            <h3>Pod Drive</h3>
          </div>
          <p>A Google-Drive-style file manager for your Solid Pod. Built by the PrivateDataPod team.</p>
        </a>
      </li>
      <li data-name="Pod Resume" data-category="Productivity">
        <a href="https://resume.privatedatapod.com/">
          <div class="tile-header">
            <img alt="Solid logo - an uppercase S on a violet hexagon" src="/assets/img/solid-emblem.svg"/>
            <h3>Pod Resume</h3>
          </div>
          <p>An AI-powered résumé builder that stores your CV and work history in your Solid Pod. Built by the PrivateDataPod team.</p>
        </a>
      </li>
      <li data-name="HomeVault" data-category="Productivity">
        <a href="https://homevault.apps.privatedatapod.com/">
          <div class="tile-header">
            <img alt="HomeVault logo" src="/assets/img/logo/homevault.svg"/>
            <h3>HomeVault</h3>
          </div>
          <p>A home inventory app for insurance and household records, with all data stored in your own Solid Pod.</p>
        </a>
      </li>
      <li data-name="VitalStats" data-category="Health">
        <a href="https://vitalstats.apps.privatedatapod.com/">
          <div class="tile-header">
            <img alt="VitalStats logo" src="/assets/img/logo/vitalstats.svg"/>
            <h3>VitalStats</h3>
          </div>
          <p>Log blood pressure, weight, and other vitals privately to your own Solid Pod.</p>
        </a>
      </li>
      <li data-name="InnerPod" data-category="Health">
        <a href="https://innerpod.solidcommunity.au">
          <div class="tile-header">
            <img alt="InnerPod logo" src="/assets/img/logo/innerpod.png"/>
            <h3>InnerPod</h3>
          </div>
          <p>A guided meditation timer that records each session to your Solid Pod with optional encryption. Built by the Software Innovation Institute, ANU.</p>
        </a>
        <p class="app-source">Source code on <a href="https://github.com/gjwgit/innerpod" class="external-link" rel="noopener noreferrer">GitHub (gjwgit/innerpod)</a>.</p>
      </li>
      <li data-name="MSFatigue" data-category="Health">
        <a href="https://msfatigue.solidcommunity.au">
          <div class="tile-header">
            <img alt="MSFatigue logo" src="/assets/img/logo/msfatigue.png"/>
            <h3>MSFatigue</h3>
          </div>
          <p>A survey/questionnaire app for multiple-sclerosis fatigue research; responses are saved encrypted to the participant's own Pod, with opt-in sharing to researchers. Built by the Software Innovation Institute, ANU.</p>
        </a>
        <p class="app-source">Source code on <a href="https://github.com/anusii/msfatigue" class="external-link" rel="noopener noreferrer">GitHub (anusii/msfatigue)</a>.</p>
      </li>
      <li data-name="FilePod" data-category="Pod Management">
        <a href="https://filepod.solidcommunity.au">
          <div class="tile-header">
            <img alt="FilePod logo" src="/assets/img/logo/filepod.png"/>
            <h3>FilePod</h3>
          </div>
          <p>A Flutter-based Solid file browser — browse, upload, and download files on your Pod from any platform. Built by the Software Innovation Institute, ANU.</p>
        </a>
        <p class="app-source">Source code on <a href="https://github.com/anusii/filepod" class="external-link" rel="noopener noreferrer">GitHub (anusii/filepod)</a>.</p>
      </li>
      <li data-name="KeyPod" data-category="Security">
        <a href="https://keypod.solidcommunity.au">
          <div class="tile-header">
            <img alt="KeyPod logo" src="/assets/img/logo/keypod.png"/>
            <h3>KeyPod</h3>
          </div>
          <p>An encrypted key-value store usable as a password manager; also serves as a Flutter template for building Solid apps. Built by the Software Innovation Institute, ANU.</p>
        </a>
        <p class="app-source">Source code on <a href="https://github.com/anusii/keypod" class="external-link" rel="noopener noreferrer">GitHub (anusii/keypod)</a>.</p>
      </li>
      <li data-name="GeoPod" data-category="Location">
        <a href="https://geopod.solidcommunity.au">
          <div class="tile-header">
            <img alt="GeoPod logo" src="/assets/img/logo/geopod.png"/>
            <h3>GeoPod</h3>
          </div>
          <p>A map-based app for storing points of interest and tracks in your own encrypted Solid Pod. Built by the Software Innovation Institute, ANU.</p>
        </a>
        <p class="app-source">Source code on <a href="https://github.com/gjwgit/geopod" class="external-link" rel="noopener noreferrer">GitHub (gjwgit/geopod)</a>.</p>
      </li>
      <li data-name="SecureDialog" data-category="Health">
        <a href="https://securedialog.solidcommunity.au">
          <div class="tile-header">
            <img alt="SecureDialog logo" src="/assets/img/logo/securedialog.png"/>
            <h3>SecureDialog</h3>
          </div>
          <p>A diabetes-logging app that stores entries encrypted in your Solid Pod. Built by the Software Innovation Institute, ANU.</p>
        </a>
      </li>
      <li data-name="TodoPod" data-category="Productivity">
        <a href="https://todopod.solidcommunity.au">
          <div class="tile-header">
            <img alt="TodoPod logo" src="/assets/img/logo/todopod.png"/>
            <h3>TodoPod</h3>
          </div>
          <p>An app to manage your tasks with all data securely and privately stored encrypted on your own personal online data store (Pod) hosted on a Solid Server.</p>
        </a>
        <p class="app-source">Built by <a href="https://togaware.com" class="external-link" rel="noopener noreferrer">Togaware</a>. Source code on <a href="https://github.com/gjwgit/todopod" class="external-link" rel="noopener noreferrer">GitHub (gjwgit/todopod)</a>.</p>
      </li>
      <li data-name="RoloPod" data-category="Productivity">
        <a href="https://rolopod.solidcommunity.au">
          <div class="tile-header">
            <img alt="RoloPod logo" src="/assets/img/logo/rolopod.png"/>
            <h3>RoloPod</h3>
          </div>
          <p>A tool to collect your contacts into an address book in one secure and private place. You can selectively share any parts of your address book with others, or make phone calls on your mobile device (for the Android and iOS versions).</p>
        </a>
        <p class="app-source">Built by <a href="https://togaware.com" class="external-link" rel="noopener noreferrer">Togaware</a>. Source code on <a href="https://github.com/gjwgit/rolopod" class="external-link" rel="noopener noreferrer">GitHub (gjwgit/rolopod)</a>.</p>
      </li>
      <li data-name="KonaPod" data-category="Productivity">
        <a href="https://konapod.solidcommunity.au">
          <div class="tile-header">
            <img alt="KonaPod logo" src="/assets/img/logo/konapod.png"/>
            <h3>KonaPod</h3>
          </div>
          <p>Collect your Hyundai vehicle data in one secure and private place. You can selectively share any parts of your data with others. The app presents the data and analyses of the data.</p>
        </a>
        <p class="app-source">Built by <a href="https://togaware.com" class="external-link" rel="noopener noreferrer">Togaware</a>. Source code on <a href="https://github.com/gjwgit/konapod" class="external-link" rel="noopener noreferrer">GitHub (gjwgit/konapod)</a>.</p>
      </li>
      <li data-name="BilliPod" data-category="Productivity">
        <a href="https://billipod.solidcommunity.au">
          <div class="tile-header">
            <img alt="BilliPod logo" src="/assets/img/logo/billipod.png"/>
            <h3>BilliPod</h3>
          </div>
          <p>Manage your bills, upcoming, scheduled, and past. The app analyses your bill history to generate reminders to avoid missing the all important bill payments.</p>
        </a>
        <p class="app-source">Built by <a href="https://togaware.com" class="external-link" rel="noopener noreferrer">Togaware</a>. Source code on <a href="https://github.com/gjwgit/billipod" class="external-link" rel="noopener noreferrer">GitHub (gjwgit/billipod)</a>.</p>
      </li>
    </ul>

    <details class="details-box">
      <summary>App inclusion and exclusion criteria</summary>
      <p>The criteria for an app to be Solid-compatible are:</p>
      <ul>
        <li>If identifying users is necessary, they must be able to log in using their WebID and pointing to the Identity Provider of their choice</li>
        <li>Data consumed by the app should be fetched from Solid Pods if possible</li>
        <li>Data generated by the app should be stored in Solid Pods</li>
        <li>The interaction between the app, pods, and Identity Provider(s) must be compliant with the <a href="/TR/">Solid specification(s)</a></li>
      </ul>
      <p>Please note that apps falling into the following categories will not be listed on this page, even if they match the criteria above:</p>
      <ul>
        <li>Apps intentionally or indirectly causing harm to anyone</li>
        <li>Apps with a purpose that could be widely considered unethical</li>
        <li>Apps designed to enable the generation and/or dissemination of hate speech</li>
        <li>Apps encouraging stereotypes or violent behaviours towards any person or group</li>
        <li>Apps having malicious intent, such as data theft</li>
        <li>Apps designed to fulfill illegal purposes, such as drug traffic, stolen information exchange, extorsion…</li>
        <li>Apps sharing user information with any third-party without user consent</li>
        <li>Apps that have been reported to have important technical or security issues that compromise its users’ Pods</li>
      </ul>
      <p>Want to add an eligible Solid-compatible app to this list? Contact the <a href="https://theodi.org/insights/projects/odi-and-solid-building-a-future-where-data-works-for-everyone/">Open Data Institute</a> via <a href="mailto:solid+info@theodi.org">solid+info@theodi.org</a>.</p>
      <p>Disclaimer: The list above does not represent an endorsement by the Solid Project. The apps on the list do not undergo any testing at this time, and there is no guarantee of security or quality implied by their inclusion on this list. The goal of the list is to showcase the vibrancy of the Solid community and encourage early app builders to collaborate and learn from each other. If you believe one of the apps above is insecure or non-functional and should be removed from the list, please <a href="https://service.theodi.org/help/1476250723">raise an issue here</a>.</p>
    </details>

    <script>
      // App tiles sorting and filtering functionality
      document.addEventListener('DOMContentLoaded', function () {
        const sortSelect = document.getElementById('sort-select');
        const categoryFilter = document.getElementById('category-filter');
        const topAppsOnlyCheckbox = document.getElementById('top-apps-only');
        const appsList = document.getElementById('apps-list');
        const appTiles = Array.from(appsList.querySelectorAll('li'));
        // Store current state
        let currentSort = 'name-asc';
        let currentFilter = 'all';
        let showTopAppsOnly = false;
        // Function to sort app tiles
        function sortAppTiles(sortValue) {
          currentSort = sortValue;
          const tiles = Array.from(appsList.querySelectorAll('li:not(.hidden)'));
          if (!sortValue) {
            // Return to default order - restore original order based on data attributes
            const defaultOrder = [
              'Media Kraken',
              'Penny',
              'Umai',
              '0data Hello with Solid',
              'Booklice',
              'dokieli',
              'Pod Pro',
              'PodOS Browser',
              'Solid File Manager',
              'Solidflix'
            ];
            tiles.sort((a, b) => {
              const aName = a.getAttribute('data-name');
              const bName = b.getAttribute('data-name');
              const aIndex = defaultOrder.indexOf(aName);
              const bIndex = defaultOrder.indexOf(bName);
              return aIndex - bIndex;
            });
          } else {
            // Apply sorting based on sortValue
            tiles.sort((a, b) => {
              let aValue, bValue;
              if (sortValue.startsWith('name')) {
                aValue = a.getAttribute('data-name').toLowerCase();
                bValue = b.getAttribute('data-name').toLowerCase();
              } else if (sortValue.startsWith('category')) {
                aValue = a.getAttribute('data-category').toLowerCase();
                bValue = b.getAttribute('data-category').toLowerCase();
              } else {
                return 0;
              }
              let comparison = 0;
              if (aValue < bValue) comparison = -1;
              if (aValue > bValue) comparison = 1;
              return sortValue.endsWith('desc') ? -comparison : comparison;
            });
          }
          // Reorder tiles in the list
          tiles.forEach(tile => appsList.appendChild(tile));
        }
        // Function to filter app tiles
        function filterAppTiles(category, topAppsOnly = false) {
          if (!category) return;
          currentFilter = category;
          showTopAppsOnly = topAppsOnly;
          let visibleCount = 0;
          appTiles.forEach(tile => {
            const tileCategory = tile.getAttribute('data-category');
            const isTopApp = tile.querySelector('.top-app-tag') !== null;
            let shouldShow = false;
            if (topAppsOnly) {
              // Only show top apps that match the category filter
              shouldShow = isTopApp && (category === 'all' || tileCategory === category);
            } else {
              // Show all apps that match the category filter
              shouldShow = category === 'all' || tileCategory === category;
            }
            if (shouldShow) {
              tile.classList.remove('hidden');
              visibleCount++;
            } else {
              tile.classList.add('hidden');
            }
          });
          // Show message if no apps match the filter
          let noResultsMessage = appsList.querySelector('.no-results-message');
          if (visibleCount === 0) {
            if (!noResultsMessage) {
              noResultsMessage = document.createElement('div');
              noResultsMessage.className = 'no-results-message';
              noResultsMessage.innerHTML = '<p>No apps found matching your criteria.</p>';
              appsList.appendChild(noResultsMessage);
            }
          } else if (noResultsMessage) {
            noResultsMessage.remove();
          }
        }
        // Function to apply both filter and sort
        function applyFilterAndSort() {
          filterAppTiles(currentFilter, showTopAppsOnly);
          sortAppTiles(currentSort);
        }
        // Event listeners for sort and filter controls
        if (sortSelect) {
          sortSelect.addEventListener('change', function () {
            currentSort = this.value;
            applyFilterAndSort();
          });
        }
        if (categoryFilter) {
          categoryFilter.addEventListener('change', function () {
            currentFilter = this.value;
            applyFilterAndSort();
          });
        }
        if (topAppsOnlyCheckbox) {
          topAppsOnlyCheckbox.addEventListener('change', function () {
            showTopAppsOnly = this.checked;
            applyFilterAndSort();
          });
        }
        // Initialize without default sorting to maintain current order
        if (sortSelect) {
          sortSelect.value = '';
        }
        // Only apply filter, not sorting
        filterAppTiles(currentFilter, showTopAppsOnly);
      });
    </script>
  </div>
</section>