From f0bec2a9588af89296b79e27e4010d1c75a36024 Mon Sep 17 00:00:00 2001
From: Bartosz Kaszubowski <gosimek@gmail.com>
Date: Sun, 22 Mar 2026 19:13:23 +0100
Subject: [PATCH] small tweaks and fixes

---
 components/Package/PackageHeader.tsx |  5 +++--
 components/SearchTag.tsx             |  2 +-
 pages/index.tsx                      |  4 ++--
 scenes/PackageOverviewScene.tsx      | 15 +++++++++++----
 4 files changed, 17 insertions(+), 9 deletions(-)

diff --git a/components/Package/PackageHeader.tsx b/components/Package/PackageHeader.tsx
index f97595c88..77cdcb8ee 100644
--- a/components/Package/PackageHeader.tsx
+++ b/components/Package/PackageHeader.tsx
@@ -1,3 +1,4 @@
+import { startCase } from 'es-toolkit';
 import { type ReactNode } from 'react';
 import { View } from 'react-native';
 
@@ -39,10 +40,10 @@ export default function PackageHeader({ library, registryData, rightSlot }: Prop
               <UserAvatar
                 src={`https://github.com/${ghUsername}.png`}
                 style={tw`size-6 rounded-md border border-solid border-palette-gray2 dark:border-default`}
-                alt={`${ghUsername} avatar`}
+                alt={`${startCase(ghUsername)} avatar`}
               />
             }>
-            {ghUsername}
+            {startCase(ghUsername)}
           </Tooltip>
           <P style={tw`-mt-0.5 text-xl font-semibold leading-[26px]`}>{library.npmPkg}</P>
           {registryData && (
diff --git a/components/SearchTag.tsx b/components/SearchTag.tsx
index 78c06051e..9623497c7 100644
--- a/components/SearchTag.tsx
+++ b/components/SearchTag.tsx
@@ -22,7 +22,7 @@ export default function SearchTag({ title, value }: Props) {
       <Tooltip
         trigger={
           <HoverEffect>
-            <A href="/" style={tw`flex flex-row items-center gap-1.5 pl-2 no-underline`}>
+            <A href="/packages" style={tw`flex flex-row items-center gap-1.5 pl-2 no-underline`}>
               {startCase(value)}
               <XIcon style={tw`w-2.5 text-error`} />
             </A>
diff --git a/pages/index.tsx b/pages/index.tsx
index 42fffd933..71af2f8bf 100644
--- a/pages/index.tsx
+++ b/pages/index.tsx
@@ -33,12 +33,12 @@ Index.getInitialProps = async (ctx: NextPageContext) => {
   );
   const recentlyAddedResponse = await ssrFetch(
     '/libraries',
-    { order: 'added', limit: LIMIT.toString() },
+    { order: 'added', limit: LIMIT.toString(), isMaintained: 'true' },
     ctx
   );
   const recentlyUpdatedResponse = await ssrFetch(
     '/libraries',
-    { order: 'updated', limit: LIMIT.toString() },
+    { order: 'updated', limit: LIMIT.toString(), isMaintained: 'true' },
     ctx
   );
   const popularResponse = await ssrFetch(
diff --git a/scenes/PackageOverviewScene.tsx b/scenes/PackageOverviewScene.tsx
index e48e82c72..8f5318b7f 100644
--- a/scenes/PackageOverviewScene.tsx
+++ b/scenes/PackageOverviewScene.tsx
@@ -138,16 +138,16 @@ export default function PackageOverviewScene({
                   style={tw`pl-4.5 m-0 gap-1.5 text-[13px] text-palette-gray4 dark:text-palette-gray5`}>
                   <li>
                     <A
-                      href={`https://bundlephobia.com/package/${library.npmPkg}`}
+                      href={`https://node-modules.dev/grid/depth#install=${library.npmPkg}`}
                       style={tw`text-[12px] font-light`}>
-                      Bundlephobia
+                      Node Modules Inspector
                     </A>
                   </li>
                   <li>
                     <A
-                      href={`https://npmgraph.js.org/?q=${library.npmPkg}`}
+                      href={`https://bundlephobia.com/package/${library.npmPkg}`}
                       style={tw`text-[12px] font-light`}>
-                      npmgraph
+                      Bundlephobia
                     </A>
                   </li>
                   <li>
@@ -157,6 +157,13 @@ export default function PackageOverviewScene({
                       pkg-size.dev
                     </A>
                   </li>
+                  <li>
+                    <A
+                      href={`https://npmgraph.js.org/?q=${library.npmPkg}`}
+                      style={tw`text-[12px] font-light`}>
+                      npmgraph
+                    </A>
+                  </li>
                   <li>
                     <A
                       href={`https://snyk.io/advisor/npm-package/${library.npmPkg}`}