From 3ea9c678603ddb7071d73f33029e5ba90ceabc64 Mon Sep 17 00:00:00 2001
From: Andre Wanlin <awanlin@spotify.com>
Date: Mon, 16 Feb 2026 17:56:54 -0600
Subject: [PATCH] Update plugin directory to account for new state

Signed-off-by: Andre Wanlin <awanlin@spotify.com>
---
 microsite/src/pages/plugins/_pluginCard.tsx |  1 +
 microsite/src/pages/plugins/index.tsx       | 34 ++++++++++++++++++++-
 2 files changed, 34 insertions(+), 1 deletion(-)

diff --git a/microsite/src/pages/plugins/_pluginCard.tsx b/microsite/src/pages/plugins/_pluginCard.tsx
index ba7864f9aa..af5fd13202 100644
--- a/microsite/src/pages/plugins/_pluginCard.tsx
+++ b/microsite/src/pages/plugins/_pluginCard.tsx
@@ -14,6 +14,7 @@ export interface IPluginData {
   addedDate: string;
   isNew: boolean;
   order?: number;
+  status?: 'active' | 'inactive';
 }
 
 const defaultIconUrl = '/img/logo-gradient-on-dark.svg';
diff --git a/microsite/src/pages/plugins/index.tsx b/microsite/src/pages/plugins/index.tsx
index 1a87f9c0af..0eb6f2849e 100644
--- a/microsite/src/pages/plugins/index.tsx
+++ b/microsite/src/pages/plugins/index.tsx
@@ -123,6 +123,14 @@ const Plugins = () => {
 
   const otherPlugins = useMemo(() => {
     return plugins.otherPlugins
+      .filter(pluginData => pluginData.status !== 'inactive')
+      .filter(pluginData => matchesCategory(pluginData, selectedCategories))
+      .filter(pluginData => matchesSearch(pluginData, searchTerm));
+  }, [selectedCategories, searchTerm]);
+
+  const inactivePlugins = useMemo(() => {
+    return plugins.otherPlugins
+      .filter(pluginData => pluginData.status === 'inactive')
       .filter(pluginData => matchesCategory(pluginData, selectedCategories))
       .filter(pluginData => matchesSearch(pluginData, searchTerm));
   }, [selectedCategories, searchTerm]);
@@ -162,7 +170,7 @@ const Plugins = () => {
           />
         </div>
 
-        {corePlugins.length === 0 && otherPlugins.length === 0 && (
+        {corePlugins.length === 0 && otherPlugins.length === 0 && inactivePlugins.length === 0 && (
           <div className="margin-vert--lg">
             <h3>No plugins found</h3>
             <p>
@@ -199,6 +207,30 @@ const Plugins = () => {
             </div>
           </div>
         )}
+
+        {showOtherPlugins && otherPlugins.length === 0 && inactivePlugins.length > 0 && (
+          <div>
+            <h2>Active Plugins (0)</h2>
+            <p>
+              We couldn't find any active plugins matching your criteria.
+            </p>
+          </div>
+        )}
+
+        {inactivePlugins.length > 0 && (
+          <div>
+            <h2>Inactive Plugins ({inactivePlugins.length})</h2>
+            <p>
+              These plugins are no longer actively maintained as their NPM package has not seen an update in more than 365 days. They are kept here for reference but may not work with
+              current versions of Backstage.
+            </p>
+            <div className="pluginsContainer margin-bottom--lg">
+              {inactivePlugins.map(pluginData => (
+                <PluginCard key={pluginData.title} {...pluginData}></PluginCard>
+              ))}
+            </div>
+          </div>
+        )}
       </div>
     </Layout>
   );