Skip to content

Commit 95f89fa

Browse files
committed
add basic native code detection with filter, tweaks
1 parent e69825a commit 95f89fa

16 files changed

Lines changed: 17412 additions & 12213 deletions

File tree

assets/data.json

Lines changed: 17270 additions & 12165 deletions
Large diffs are not rendered by default.

common/styleguide.tsx

Lines changed: 16 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import * as HtmlElements from '@expo/html-elements';
22
import { TextProps } from '@expo/html-elements/build/primitives/Text';
33
import Link from 'next/link';
44
import { ComponentType, PropsWithChildren, useContext, useState } from 'react';
5-
import { StyleSheet, TextStyle, View, useWindowDimensions } from 'react-native';
5+
import { StyleSheet, TextStyle, View, useWindowDimensions, ViewStyle } from 'react-native';
66

77
import CustomAppearanceContext from '../context/CustomAppearanceContext';
88

@@ -122,9 +122,18 @@ type AProps = PropsWithChildren<{
122122
target?: string;
123123
href: string;
124124
hoverStyle?: TextStyles;
125+
containerStyle?: ViewStyle;
125126
}>;
126127

127-
export const A = ({ href, target, children, style, hoverStyle, ...rest }: AProps) => {
128+
export const A = ({
129+
href,
130+
target,
131+
children,
132+
style,
133+
hoverStyle,
134+
containerStyle,
135+
...rest
136+
}: AProps) => {
128137
const { isDark } = useContext(CustomAppearanceContext);
129138
const [isHovered, setIsHovered] = useState(false);
130139

@@ -148,10 +157,14 @@ export const A = ({ href, target, children, style, hoverStyle, ...rest }: AProps
148157
}
149158

150159
return (
151-
<View onPointerEnter={() => setIsHovered(true)} onPointerLeave={() => setIsHovered(false)}>
160+
<View
161+
onPointerEnter={() => setIsHovered(true)}
162+
onPointerLeave={() => setIsHovered(false)}
163+
style={containerStyle}>
152164
<HtmlElements.A
153165
{...rest}
154166
href={href}
167+
numberOfLines={containerStyle ? 1 : undefined}
155168
target={target ?? '_blank'}
156169
hrefAttrs={{ target: target ?? '_blank' }}
157170
style={[linkStyles, isHovered && linkHoverStyles, style, isHovered && hoverStyle]}>

components/Filters/helpers.ts

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -45,6 +45,10 @@ export const FILTER_STATUS = [
4545
param: 'newArchitecture',
4646
title: 'Supports New Architecture',
4747
},
48+
{
49+
param: 'hasNativeCode',
50+
title: 'Uses native code',
51+
},
4852
{
4953
param: 'hasExample',
5054
title: 'Has example',

components/Icons/index.tsx

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -444,3 +444,14 @@ export function Info({ width = 18, height = 18, fill = colors.black }: IconProps
444444
</Svg>
445445
);
446446
}
447+
448+
export function NativeCode({ width = 18, height = 22, fill = colors.black }: IconProps) {
449+
return (
450+
<Svg width={width} height={height} viewBox="0 0 18 22" fill="none">
451+
<Path
452+
fill={fill}
453+
d="M0 0H12.414L18 5.586V22H0V0ZM2 2V20H16V8H10V2H2ZM12 2.414V6H15.586L12 2.414ZM8.207 11.207L6.414 13L8.207 14.793L6.793 16.207L3.586 13L6.793 9.793L8.207 11.207ZM11.207 9.793L14.414 13L11.207 16.207L9.793 14.793L11.586 13L9.793 11.207L11.207 9.793Z"
454+
/>
455+
</Svg>
456+
);
457+
}

components/Library/MetaData.tsx

Lines changed: 34 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,23 @@
11
import { useContext } from 'react';
2-
import { StyleSheet, View } from 'react-native';
2+
import { Platform, StyleSheet, View } from 'react-native';
33

44
import { colors, A, P, Caption, darkColors } from '~/common/styleguide';
55
import CustomAppearanceContext from '~/context/CustomAppearanceContext';
66
import { Library as LibraryType } from '~/types';
77

88
import { DirectoryScore } from './DirectoryScore';
9-
import { Star, Download, Eye, Issue, Web, License, Fork, Code, TypeScript } from '../Icons';
9+
import {
10+
Star,
11+
Download,
12+
Eye,
13+
Issue,
14+
Web,
15+
License,
16+
Fork,
17+
Code,
18+
TypeScript,
19+
NativeCode,
20+
} from '../Icons';
1021

1122
type Props = {
1223
library: LibraryType;
@@ -34,7 +45,10 @@ function generateData({ github, score, npm, npmPkg }: LibraryType, isDark: boole
3445
id: 'downloads',
3546
icon: <Download fill={iconColor} width={16} height={18} />,
3647
content: (
37-
<A href={`https://www.npmjs.com/package/${npmPkg}`} style={styles.link}>
48+
<A
49+
href={`https://www.npmjs.com/package/${npmPkg}`}
50+
style={styles.link}
51+
containerStyle={styles.linkContainer}>
3852
{`${npm.downloads.toLocaleString()}`} monthly downloads
3953
</A>
4054
),
@@ -120,6 +134,13 @@ function generateSecondaryData({ github, examples }: LibraryType, isDark: boolea
120134
),
121135
}
122136
: null,
137+
github.hasNativeCode
138+
? {
139+
id: 'nativeCode',
140+
icon: <NativeCode fill={iconColor} width={16} height={16} />,
141+
content: <P style={paragraphStyles}>Native code</P>,
142+
}
143+
: null,
123144
github.hasTypes
124145
? {
125146
id: 'types',
@@ -178,6 +199,7 @@ const styles = StyleSheet.create({
178199
datumContainer: {
179200
marginBottom: 8,
180201
minHeight: 22,
202+
overflow: 'hidden',
181203
},
182204
displayHorizontal: {
183205
flexDirection: 'row',
@@ -188,6 +210,14 @@ const styles = StyleSheet.create({
188210
width: 20,
189211
alignItems: 'center',
190212
},
213+
linkContainer: {
214+
display: 'contents',
215+
...Platform.select({
216+
web: {
217+
textOverflow: 'ellipsis',
218+
},
219+
}),
220+
},
191221
link: {
192222
fontSize: 15,
193223
fontWeight: 300,
@@ -200,7 +230,7 @@ const styles = StyleSheet.create({
200230
fontWeight: 300,
201231
},
202232
secondaryContainer: {
203-
marginBottom: 6,
233+
marginBottom: 0,
204234
marginRight: 16,
205235
},
206236
secondaryIconContainer: {

components/Library/index.tsx

Lines changed: 11 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -46,7 +46,7 @@ const Library = ({ library, skipMetadata, showTrendingMark }: Props) => {
4646
skipMetadata && (isSmallScreen || isBelowMaxWidth) && styles.noMetaColumnContainer,
4747
library.unmaintained && styles.unmaintained,
4848
]}>
49-
<View style={styles.columnOne}>
49+
<View style={[styles.columnOne, styles.columnDesktop]}>
5050
{library.unmaintained && (
5151
<View
5252
style={
@@ -112,14 +112,11 @@ const Library = ({ library, skipMetadata, showTrendingMark }: Props) => {
112112
</View>
113113
) : null}
114114
{hasSecondaryMetadata ? (
115-
<>
116-
{isSmallScreen ? null : <View style={styles.filler} />}
117-
<View style={[styles.bottomBar, isSmallScreen ? styles.bottomBarSmall : {}]}>
118-
<View style={[styles.displayHorizontal, styles.secondaryStats]}>
119-
<MetaData library={library} secondary />
120-
</View>
115+
<View style={[styles.bottomBar, isSmallScreen ? styles.bottomBarSmall : {}]}>
116+
<View style={[styles.displayHorizontal, styles.secondaryStats]}>
117+
<MetaData library={library} secondary />
121118
</View>
122-
</>
119+
</View>
123120
) : null}
124121
</View>
125122
{skipMetadata ? null : (
@@ -154,6 +151,9 @@ const styles = StyleSheet.create({
154151
containerColumn: {
155152
flexDirection: 'column',
156153
},
154+
columnDesktop: {
155+
paddingBottom: 14,
156+
},
157157
columnOne: {
158158
...Platform.select({
159159
web: {
@@ -186,6 +186,7 @@ const styles = StyleSheet.create({
186186
displayHorizontal: {
187187
flexDirection: 'row',
188188
alignItems: 'center',
189+
rowGap: 2,
189190
},
190191
exampleLink: {
191192
marginRight: 6,
@@ -217,7 +218,7 @@ const styles = StyleSheet.create({
217218
marginTop: 8,
218219
},
219220
secondaryStats: {
220-
marginTop: 6,
221+
marginTop: 12,
221222
flexWrap: 'wrap',
222223
},
223224
secondaryText: {
@@ -226,12 +227,7 @@ const styles = StyleSheet.create({
226227
},
227228
bottomBar: {
228229
width: '100%',
229-
position: 'absolute',
230-
bottom: 0,
231-
left: 0,
232-
minHeight: 42,
233-
paddingLeft: 20,
234-
paddingRight: 16,
230+
marginTop: 'auto',
235231
},
236232
bottomBarSmall: {
237233
position: 'relative',

pages/api/libraries/index.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -72,6 +72,7 @@ export default function handler(req: NextApiRequest, res: NextApiResponse) {
7272
hasExample: req.query.hasExample,
7373
hasImage: req.query.hasImage,
7474
hasTypes: req.query.hasTypes,
75+
hasNativeCode: req.query.hasNativeCode,
7576
isMaintained: req.query.isMaintained,
7677
isPopular: req.query.isPopular,
7778
isRecommended: req.query.isRecommended,

react-native-libraries.json

Lines changed: 2 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -4608,12 +4608,6 @@
46084608
"npmPkg": "@mapbox/react-native-mapbox-gl",
46094609
"unmaintained": true
46104610
},
4611-
{
4612-
"githubUrl": "https://github.com/yamill/react-native-orientation",
4613-
"ios": true,
4614-
"android": true,
4615-
"unmaintained": true
4616-
},
46174611
{
46184612
"githubUrl": "https://github.com/aksonov/react-native-tableview",
46194613
"ios": true
@@ -6136,9 +6130,9 @@
61366130
"expoGo": true
61376131
},
61386132
{
6139-
"githubUrl": "https://github.com/dooboolab/react-native-audio-recorder-player",
6133+
"githubUrl": "https://github.com/hyochan/react-native-nitro-sound",
61406134
"examples": [
6141-
"https://github.com/dooboolab/react-native-audio-recorder-player/tree/master/Example"
6135+
"https://github.com/hyochan/react-native-nitro-sound/tree/main/example"
61426136
],
61436137
"ios": true,
61446138
"android": true

scripts/calculate-score.ts

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
/**
22
* Directory Score
33
*/
4-
import { Library } from '~/types';
4+
import { type Library } from '~/types';
55

66
// This is an array of modifier objects. Each modifier has a name, value, and condition.
77
// The data is passed to condition function, and if it returns true, the value is added to the
@@ -68,7 +68,7 @@ const maxScore = MODIFIERS.reduce((currentMax, modifier) => {
6868
return modifier.value > 0 ? currentMax + modifier.value : currentMax;
6969
}, 0);
7070

71-
export const calculateDirectoryScore = data => {
71+
export function calculateDirectoryScore(data: Library) {
7272
// Filter the modifiers to the ones which conditions pass with the data
7373
const matchingModifiers = MODIFIERS.filter(modifier => modifier.condition(data));
7474

@@ -89,21 +89,21 @@ export const calculateDirectoryScore = data => {
8989
score,
9090
matchingScoreModifiers: matchingModifierNames,
9191
};
92-
};
92+
}
9393

94-
const getCombinedPopularity = data => {
94+
function getCombinedPopularity(data: Library) {
9595
const { subscribers, forks, stars } = data.github.stats;
9696
const { downloads } = data.npm;
9797
return subscribers * 50 + forks * 25 + stars * 10 + downloads / 100;
98-
};
98+
}
9999

100-
const getUpdatedDaysAgo = data => {
100+
function getUpdatedDaysAgo(data: Library) {
101101
const { updatedAt } = data.github.stats;
102102
const updateDate = new Date(updatedAt).getTime();
103103
const currentDate = new Date().getTime();
104104

105105
return (currentDate - updateDate) / DAY_IN_MS;
106-
};
106+
}
107107

108108
/**
109109
* Trending Score

scripts/fetch-github-data.ts

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
11
import { config } from 'dotenv';
22

3+
import hasNativeCode from '~/util/hasNativeCode';
4+
35
import {
46
processTopics,
57
sleep,
@@ -71,6 +73,7 @@ export const fetchGithubData = async (data, retries = 2) => {
7173
repoOwner,
7274
repoName,
7375
packagePath,
76+
packageFilesPath: packagePath === '.' ? 'HEAD:' : `HEAD:${packagePath}`,
7477
packageJsonPath: `HEAD:${packagePath === '.' ? '' : `${packagePath}/`}package.json`,
7578
});
7679

@@ -101,6 +104,7 @@ export const fetchGithubData = async (data, retries = 2) => {
101104
}
102105

103106
const github = createRepoDataWithResponse(result.data.repository, isMonorepo);
107+
104108
return {
105109
...data,
106110
github,
@@ -198,5 +202,6 @@ const createRepoDataWithResponse = (json, monorepo) => {
198202
hasTypes: json.types ?? false,
199203
newArchitecture: json.newArchitecture,
200204
isArchived: json.isArchived,
205+
hasNativeCode: hasNativeCode(json.files),
201206
};
202207
};

0 commit comments

Comments
 (0)