Merge branch 'main' into fix/org

Author: Adebesin-Cell

.storybook/handlers.ts

@@ -57,3 +57,37 @@ export const contributorsHandler = http.get('/api/contributors', () => {
     },
   ])
 })
+
+export const pdsUsersHandler = http.get('/api/atproto/pds-users', () => {
+  return HttpResponse.json([
+    {
+      did: 'did:plc:mock0001',
+      handle: 'patak.dog',
+      displayName: 'Patak Dog',
+      avatar:
+        'https://cdn.bsky.app/img/avatar/plain/did:plc:zjfptjaegvgc7r2axkkyyzqn/bafkreihrcqhp575f6dph4uztbeyxfrmfnbv7x2gvovrgu4idgdsdw7wety',
+    },
+    {
+      did: 'did:plc:mock0002',
+      handle: 'patakllama.mockpmx.social',
+      displayName: 'Patak Llama',
+      avatar: 'https://api.dicebear.com/9.x/initials/svg?seed=llama',
+    },
+    {
+      did: 'did:plc:mock0003',
+      handle: 'patak.horse',
+      displayName: 'Patak Horse',
+      avatar:
+        'https://cdn.bsky.app/img/avatar/plain/did:plc:vqh7id7sddkrfkhgt7tstlpd/bafkreifodkgqszgpt2qnoyljnbafokr6eujqwztj2kxo473adv5b57hjse',
+    },
+    {
+      did: 'did:plc:mock0004',
+      handle: 'patakcatapiller.mockpmx.social',
+    },
+    {
+      did: 'did:plc:mock0005',
+      handle: 'patakgoat.mockpmx.social',
+      displayName: 'Patak Goat',
+    },
+  ])
+})

app/components/Chart/SplitSparkline.vue

@@ -31,6 +31,9 @@ const props = defineProps<{
 
 const { locale } = useI18n()
 const colorMode = useColorMode()
+const numberFormatter = useNumberFormatter({
+  maximumFractionDigits: 0,
+})
 const resolvedMode = shallowRef<'light' | 'dark'>('light')
 const rootEl = shallowRef<HTMLElement | null>(null)
 const palette = getPalette('')
@@ -153,6 +156,9 @@ const configs = computed(() => {
           fontSize: 24,
           bold: false,
           color: colors.value.fg,
+          formatter: ({ value }) => {
+            return numberFormatter.value.format(value)
+          },
           datetimeFormatter: {
             enable: true,
             locale: locale.value,

app/components/Package/WeeklyDownloadStats.vue

@@ -60,6 +60,9 @@ function handleModalTransitioned() {
 }
 
 const { fetchPackageDownloadEvolution } = useCharts()
+const numberFormatter = useNumberFormatter({
+  maximumFractionDigits: 0,
+})
 
 const { accentColors, selectedAccentColor } = useAccentColor()
 
@@ -359,6 +362,9 @@ const config = computed<VueUiSparklineConfig>(() => {
         fontSize: 28,
         bold: false,
         color: colors.value.fg,
+        formatter: ({ value }) => {
+          return numberFormatter.value.format(value)
+        },
       },
       line: {
         color: colors.value.borderHover,

app/components/Readme.vue

@@ -89,6 +89,7 @@ function handleClick(event: MouseEvent) {
   min-width: 0;
   /* Contain all children z-index values inside this container */
   isolation: isolate;
+  contain: layout paint;
 }
 
 /* README headings - styled by visual level (data-level), not semantic level */

app/components/Tab/Panel.vue

@@ -21,7 +21,7 @@ const resolvedTabId = computed(() => getTabId(props.value))
 
 <template>
   <div
-    v-show="isSelected"
+    v-if="isSelected"
     :id="resolvedPanelId"
     role="tabpanel"
     :aria-labelledby="resolvedTabId"

app/composables/npm/useAlgoliaSearch.ts

@@ -161,8 +161,8 @@ export function useAlgoliaSearch() {
     }
   }
 
-  /** Fetch all packages for an owner using `owner.name` filter with pagination. */
-  async function searchByOwner(
+  /** Fetch all packages for a maintainer using `owners.name` filter with pagination. */
+  async function searchByMaintainer(
     ownerName: string,
     options: { maxResults?: number } = {},
   ): Promise<NpmSearchResponse> {
@@ -185,7 +185,7 @@ export function useAlgoliaSearch() {
             query: '',
             offset,
             length,
-            filters: `owner.name:${ownerName}`,
+            filters: `owners.name:${ownerName}`,
             analyticsTags: ['npmx.dev'],
             attributesToRetrieve: ATTRIBUTES_TO_RETRIEVE,
             attributesToHighlight: [],
@@ -314,7 +314,7 @@ export function useAlgoliaSearch() {
       requests.push({
         indexName,
         query: '',
-        filters: `owner.name:${checks.name}`,
+        filters: `owners.name:${checks.name}`,
         length: 1,
         analyticsTags: ['npmx.dev'],
         attributesToRetrieve: EXISTENCE_CHECK_ATTRS,
@@ -375,7 +375,7 @@ export function useAlgoliaSearch() {
   return {
     search,
     searchWithSuggestions,
-    searchByOwner,
+    searchByMaintainer,
     getPackagesByName,
   }
 }

app/composables/npm/useUserPackages.ts

@@ -28,7 +28,7 @@ export function useUserPackages(username: MaybeRefOrGetter<string>) {
   })
   // this is only used in npm path, but we need to extract it when the composable runs
   const { $npmRegistry } = useNuxtApp()
-  const { searchByOwner } = useAlgoliaSearch()
+  const { searchByMaintainer } = useAlgoliaSearch()
 
   // --- Incremental loading state (npm path) ---
   const currentPage = shallowRef(1)
@@ -58,7 +58,7 @@ export function useUserPackages(username: MaybeRefOrGetter<string>) {
       // --- Algolia: fetch all at once ---
       if (provider === 'algolia') {
         try {
-          const response = await searchByOwner(user)
+          const response = await searchByMaintainer(user)
 
           // Guard against stale response (user/provider changed during await)
           if (user !== toValue(username) || provider !== searchProviderValue.value) {

app/composables/useSelectedPackageManager.ts

@@ -12,6 +12,10 @@ export const useSelectedPackageManager = createSharedComposable(
 
     // Sync to data-pm attribute on the client
     if (import.meta.client) {
+      const queryPM = new URLSearchParams(window.location.search).get('pm')
+      if (queryPM && packageManagers.some(pm => pm.id === queryPM)) {
+        pm.value = queryPM as PackageManagerId
+      }
       // Watch for changes and update the attribute
       watch(
         pm,

app/composables/useSettings.ts

@@ -73,7 +73,7 @@ const DEFAULT_SETTINGS: AppSettings = {
   },
   chartFilter: {
     averageWindow: 0,
-    smoothingTau: 1,
+    smoothingTau: 0,
     anomaliesFixed: true,
     predictionPoints: 4,
   },

app/pages/pds.stories.ts

@@ -0,0 +1,30 @@
+import Pds from './pds.vue'
+import type { Meta, StoryObj } from '@storybook-vue/nuxt'
+import { pageDecorator } from '../../.storybook/decorators'
+import { pdsUsersHandler } from '../../.storybook/handlers'
+
+const meta = {
+  component: Pds,
+  parameters: {
+    layout: 'fullscreen',
+    msw: {
+      handlers: [pdsUsersHandler],
+    },
+  },
+  decorators: [pageDecorator],
+} satisfies Meta<typeof Pds>
+
+export default meta
+type Story = StoryObj<typeof meta>
+
+/** `/api/atproto/pds-users` is intercepted by MSW so the community section displays both avatar images and text-only entries. */
+export const Default: Story = {}
+
+/** Community section shows an empty/loading state with no API response. */
+export const WithoutUsers: Story = {
+  parameters: {
+    msw: {
+      handlers: [],
+    },
+  },
+}