Skip to content

Commit 4aceb9c

Browse files
SukiiuSukiiu
authored
feat(ui): adds social likes to compare page (#940)
1 parent 6fb61d4 commit 4aceb9c

File tree

9 files changed

+96
-52
lines changed

9 files changed

+96
-52
lines changed

‎app/composables/useFacetSelection.ts‎

Lines changed: 56 additions & 50 deletions
Original file line numberDiff line numberDiff line change
@@ -23,56 +23,62 @@ export interface FacetInfoWithLabels extends Omit<FacetInfo, 'id'> {
2323
export function useFacetSelection(queryParam = 'facets') {
2424
const { t } = useI18n()
2525

26-
const facetLabels = computed(() => ({
27-
downloads: {
28-
label: t(`compare.facets.items.downloads.label`),
29-
description: t(`compare.facets.items.downloads.description`),
30-
},
31-
packageSize: {
32-
label: t(`compare.facets.items.packageSize.label`),
33-
description: t(`compare.facets.items.packageSize.description`),
34-
},
35-
installSize: {
36-
label: t(`compare.facets.items.installSize.label`),
37-
description: t(`compare.facets.items.installSize.description`),
38-
},
39-
moduleFormat: {
40-
label: t(`compare.facets.items.moduleFormat.label`),
41-
description: t(`compare.facets.items.moduleFormat.description`),
42-
},
43-
types: {
44-
label: t(`compare.facets.items.types.label`),
45-
description: t(`compare.facets.items.types.description`),
46-
},
47-
engines: {
48-
label: t(`compare.facets.items.engines.label`),
49-
description: t(`compare.facets.items.engines.description`),
50-
},
51-
vulnerabilities: {
52-
label: t(`compare.facets.items.vulnerabilities.label`),
53-
description: t(`compare.facets.items.vulnerabilities.description`),
54-
},
55-
lastUpdated: {
56-
label: t(`compare.facets.items.lastUpdated.label`),
57-
description: t(`compare.facets.items.lastUpdated.description`),
58-
},
59-
license: {
60-
label: t(`compare.facets.items.license.label`),
61-
description: t(`compare.facets.items.license.description`),
62-
},
63-
dependencies: {
64-
label: t(`compare.facets.items.dependencies.label`),
65-
description: t(`compare.facets.items.dependencies.description`),
66-
},
67-
totalDependencies: {
68-
label: t(`compare.facets.items.totalDependencies.label`),
69-
description: t(`compare.facets.items.totalDependencies.description`),
70-
},
71-
deprecated: {
72-
label: t(`compare.facets.items.deprecated.label`),
73-
description: t(`compare.facets.items.deprecated.description`),
74-
},
75-
}))
26+
const facetLabels = computed(
27+
(): Record<ComparisonFacet, { label: string; description: string }> => ({
28+
downloads: {
29+
label: t(`compare.facets.items.downloads.label`),
30+
description: t(`compare.facets.items.downloads.description`),
31+
},
32+
totalLikes: {
33+
label: t(`compare.facets.items.totalLikes.label`),
34+
description: t(`compare.facets.items.totalLikes.description`),
35+
},
36+
packageSize: {
37+
label: t(`compare.facets.items.packageSize.label`),
38+
description: t(`compare.facets.items.packageSize.description`),
39+
},
40+
installSize: {
41+
label: t(`compare.facets.items.installSize.label`),
42+
description: t(`compare.facets.items.installSize.description`),
43+
},
44+
moduleFormat: {
45+
label: t(`compare.facets.items.moduleFormat.label`),
46+
description: t(`compare.facets.items.moduleFormat.description`),
47+
},
48+
types: {
49+
label: t(`compare.facets.items.types.label`),
50+
description: t(`compare.facets.items.types.description`),
51+
},
52+
engines: {
53+
label: t(`compare.facets.items.engines.label`),
54+
description: t(`compare.facets.items.engines.description`),
55+
},
56+
vulnerabilities: {
57+
label: t(`compare.facets.items.vulnerabilities.label`),
58+
description: t(`compare.facets.items.vulnerabilities.description`),
59+
},
60+
lastUpdated: {
61+
label: t(`compare.facets.items.lastUpdated.label`),
62+
description: t(`compare.facets.items.lastUpdated.description`),
63+
},
64+
license: {
65+
label: t(`compare.facets.items.license.label`),
66+
description: t(`compare.facets.items.license.description`),
67+
},
68+
dependencies: {
69+
label: t(`compare.facets.items.dependencies.label`),
70+
description: t(`compare.facets.items.dependencies.description`),
71+
},
72+
totalDependencies: {
73+
label: t(`compare.facets.items.totalDependencies.label`),
74+
description: t(`compare.facets.items.totalDependencies.description`),
75+
},
76+
deprecated: {
77+
label: t(`compare.facets.items.deprecated.label`),
78+
description: t(`compare.facets.items.deprecated.description`),
79+
},
80+
}),
81+
)
7682

7783
// Helper to build facet info with i18n labels
7884
function buildFacetInfo(facet: ComparisonFacet): FacetInfoWithLabels {

‎app/composables/usePackageComparison.ts‎

Lines changed: 15 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import type {
55
Packument,
66
VulnerabilityTreeResult,
77
} from '#shared/types'
8+
import type { PackageLikes } from '#shared/types/social'
89
import { encodePackageName } from '#shared/utils/npm'
910
import type { PackageAnalysisResponse } from './usePackageAnalysis'
1011
import { isBinaryOnlyPackage } from '#shared/utils/binary-detection'
@@ -28,6 +29,8 @@ export const NoDependencyDisplay = {
2829
export interface PackageComparisonData {
2930
package: ComparisonPackage
3031
downloads?: number
32+
/** Total likes from atproto */
33+
totalLikes?: number
3134
/** Package's own unpacked size (from dist.unpackedSize) */
3235
packageSize?: number
3336
/** Number of direct dependencies */
@@ -127,7 +130,7 @@ export function usePackageComparison(packageNames: MaybeRefOrGetter<string[]>) {
127130
if (!latestVersion) return null
128131

129132
// Fetch fast additional data in parallel (optional - failures are ok)
130-
const [downloads, analysis, vulns] = await Promise.all([
133+
const [downloads, analysis, vulns, likes] = await Promise.all([
131134
$fetch<{ downloads: number }>(
132135
`https://api.npmjs.org/downloads/point/last-week/${encodePackageName(name)}`,
133136
).catch(() => null),
@@ -137,8 +140,8 @@ export function usePackageComparison(packageNames: MaybeRefOrGetter<string[]>) {
137140
$fetch<VulnerabilityTreeResult>(
138141
`/api/registry/vulnerabilities/${encodePackageName(name)}`,
139142
).catch(() => null),
143+
$fetch<PackageLikes>(`/api/social/likes/${name}`).catch(() => null),
140144
])
141-
142145
const versionData = pkgData.versions[latestVersion]
143146
const packageSize = versionData?.dist?.unpackedSize
144147

@@ -188,6 +191,7 @@ export function usePackageComparison(packageNames: MaybeRefOrGetter<string[]>) {
188191
deprecated: versionData?.deprecated,
189192
},
190193
isBinaryOnly: isBinary,
194+
totalLikes: likes?.totalLikes,
191195
}
192196
} catch {
193197
return null
@@ -299,6 +303,7 @@ function createNoDependencyData(): PackageComparisonData {
299303
},
300304
isNoDependency: true,
301305
downloads: undefined,
306+
totalLikes: undefined,
302307
packageSize: 0,
303308
directDeps: 0,
304309
installSize: {
@@ -353,6 +358,14 @@ function computeFacetValue(
353358
status: 'neutral',
354359
}
355360
}
361+
case 'totalLikes': {
362+
if (data.totalLikes === undefined) return null
363+
return {
364+
raw: data.totalLikes,
365+
display: formatCompactNumber(data.totalLikes),
366+
status: 'neutral',
367+
}
368+
}
356369
case 'packageSize': {
357370
// A size of zero is valid
358371
if (data.packageSize == null) return null

‎i18n/locales/en.json‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -931,6 +931,10 @@
931931
"label": "Downloads/wk",
932932
"description": "Weekly download count"
933933
},
934+
"totalLikes": {
935+
"label": "Likes",
936+
"description": "Number of likes"
937+
},
934938
"lastUpdated": {
935939
"label": "Published",
936940
"description": "When this version was published"

‎i18n/locales/fr-FR.json‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -903,6 +903,10 @@
903903
"label": "Téléch./semaine",
904904
"description": "Nombre de téléchargements par semaine"
905905
},
906+
"totalLikes": {
907+
"label": "Likes",
908+
"description": "Nombre de likes"
909+
},
906910
"lastUpdated": {
907911
"label": "Publié",
908912
"description": "Quand cette version a été publiée"

‎lunaria/files/en-GB.json‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -931,6 +931,10 @@
931931
"label": "Downloads/wk",
932932
"description": "Weekly download count"
933933
},
934+
"totalLikes": {
935+
"label": "Likes",
936+
"description": "Number of likes"
937+
},
934938
"lastUpdated": {
935939
"label": "Published",
936940
"description": "When this version was published"

‎lunaria/files/en-US.json‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -931,6 +931,10 @@
931931
"label": "Downloads/wk",
932932
"description": "Weekly download count"
933933
},
934+
"totalLikes": {
935+
"label": "Likes",
936+
"description": "Number of likes"
937+
},
934938
"lastUpdated": {
935939
"label": "Published",
936940
"description": "When this version was published"

‎lunaria/files/fr-FR.json‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -903,6 +903,10 @@
903903
"label": "Téléch./semaine",
904904
"description": "Nombre de téléchargements par semaine"
905905
},
906+
"totalLikes": {
907+
"label": "Likes",
908+
"description": "Nombre de likes"
909+
},
906910
"lastUpdated": {
907911
"label": "Publié",
908912
"description": "Quand cette version a été publiée"

‎shared/types/comparison.ts‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@ export type ComparisonFacet =
1616
| 'dependencies'
1717
| 'totalDependencies'
1818
| 'deprecated'
19+
| 'totalLikes'
1920

2021
/** Facet metadata for UI display */
2122
export interface FacetInfo {
@@ -46,6 +47,9 @@ export const FACET_INFO: Record<ComparisonFacet, Omit<FacetInfo, 'id'>> = {
4647
downloads: {
4748
category: 'health',
4849
},
50+
totalLikes: {
51+
category: 'health',
52+
},
4953
lastUpdated: {
5054
category: 'health',
5155
},

‎test/nuxt/components/compare/FacetSelector.spec.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -31,6 +31,7 @@ const facetLabels: Record<ComparisonFacet, { label: string; description: string
3131
description: 'Total number of dependencies including transitive',
3232
},
3333
deprecated: { label: 'Deprecated?', description: 'Whether the package is deprecated' },
34+
totalLikes: { label: 'Likes', description: 'Number of likes' },
3435
}
3536

3637
const categoryLabels: Record<string, string> = {

0 commit comments

Comments
 (0)