Skip to content

Commit e99811c

Browse files
ardatanardatan
committed
Sort languages and small fixes
1 parent 99a7ff9 commit e99811c

File tree

5 files changed

+91
-48
lines changed

5 files changed

+91
-48
lines changed

‎data/code.json

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -723,12 +723,14 @@
723723
},
724724
{
725725
"name": "Prisma",
726-
"description": "([github](https://github.com/prisma)) A BaaS (Backend as a Service) providing a GraphQL backend for your applications with a powerful web ui for managing your database and stored data.",
726+
"description": "A BaaS (Backend as a Service) providing a GraphQL backend for your applications with a powerful web ui for managing your database and stored data.",
727+
"github": "https://github.com/prisma",
727728
"url": "https://www.prisma.io"
728729
},
729730
{
730731
"name": "Tipe",
731-
"description": "([github](https://github.com/tipeio)) A SaaS (Software as a Service) content management system that allows you to create your content with powerful editing tools and access it from anywhere with a GraphQL or REST API.",
732+
"description": "A SaaS (Software as a Service) content management system that allows you to create your content with powerful editing tools and access it from anywhere with a GraphQL or REST API.",
733+
"github": "https://github.com/tipeio",
732734
"url": "https://tipe.io"
733735
},
734736
{

‎gatsby-node.js

Lines changed: 26 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -11,24 +11,46 @@ exports.onCreatePage = async ({ page, actions }) => {
1111
}
1212
if (page.path === "/code" || page.path === "/code/") {
1313
const codeData = JSON.parse(readFileSync("./data/code.json", "utf8"));
14+
const languageList = [];
15+
let sortedTools = [];
1416
await Promise.all([
1517
Promise.all(Object.keys(codeData.Libraries).map(async languageName => {
1618
const libraryCategoryMap = codeData.Libraries[languageName];
19+
let languageTotalStars = 0;
1720
await Promise.all(
1821
Object.keys(libraryCategoryMap).map(async libraryCategoryName => {
1922
const libraries = libraryCategoryMap[libraryCategoryName]
20-
libraryCategoryMap[libraryCategoryName] = await sortLibs(libraries)
23+
const { sortedLibs, totalStars } = await sortLibs(libraries)
24+
libraryCategoryMap[libraryCategoryName] = sortedLibs;
25+
languageTotalStars += totalStars || 0
2126
})
2227
)
28+
languageList.push({
29+
name: languageName,
30+
totalStars: languageTotalStars,
31+
categoryMap: libraryCategoryMap,
32+
})
2333
})),
24-
sortLibs(codeData.Tools).then(sortedTools => {
25-
codeData.Tools = sortedTools;
34+
sortLibs(codeData.Tools).then(({ sortedLibs }) => {
35+
sortedTools = sortedLibs
2636
}),
2737
])
2838

2939
context = {
3040
...context,
31-
codeData,
41+
otherLibraries: {
42+
Services: codeData.Services,
43+
Tools: sortedTools,
44+
'More Stuff': codeData['More Stuff']
45+
},
46+
languageList: languageList.sort((a, b) => {
47+
if (a.totalStars > b.totalStars) {
48+
return -1
49+
} else if (a.totalStars < b.totalStars) {
50+
return 1
51+
}
52+
return 0
53+
}),
3254
}
3355
}
3456
createPage({

‎scripts/sort-libraries.js

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -126,9 +126,7 @@ const getGemStats = async packageName => {
126126
}
127127

128128
const sortLibs = async libs => {
129-
if (libs.length === 1) {
130-
return libs
131-
}
129+
let totalStars = 0;
132130
const libsWithScores = await Promise.all(
133131
libs.map(async lib => {
134132
const [
@@ -140,15 +138,17 @@ const sortLibs = async libs => {
140138
lib.gem && getGemStats(lib.gem),
141139
lib.github && getGitHubStats(lib.github),
142140
])
143-
return {
141+
const result = {
144142
...lib,
145143
...npmStats,
146144
...gemStars,
147145
...githubStats,
148146
}
147+
totalStars += result.stars || 0;
148+
return result;
149149
})
150150
)
151-
return libsWithScores.sort((a, b) => {
151+
const sortedLibs = libsWithScores.sort((a, b) => {
152152
let aScore = 0,
153153
bScore = 0
154154
if ("downloadCount" in a && 'downloadCount' in b) {
@@ -178,6 +178,7 @@ const sortLibs = async libs => {
178178
}
179179
return 0
180180
})
181+
return { sortedLibs, totalStars }
181182
}
182183

183184
module.exports = sortLibs

‎src/assets/css/_css/code.less

Lines changed: 13 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -95,21 +95,23 @@
9595
.inner-content {
9696
max-width: 100%;
9797
}
98+
.language-content {
99+
padding-top: 72px;
100+
}
98101
.languages-title {
99102
font-size: 24px;
100103
font-weight: bold;
101-
margin-top: 94px;
102104
font-family: "Rubik", "Helvetica Neue", Helvetica, Arial, sans-serif;
103105
}
104106
.language-boxes {
105107
.language-box {
106108
margin-right: 30px;
107109
border: 1px solid #979797;
108-
width: 120px;
110+
min-width: 142px;
109111
height: 120px;
110112
display: flex;
111-
flex-direction: row;
112-
align-items: flex-end;
113+
flex-direction: row;
114+
align-items: flex-end;
113115
.article_title {
114116
text-align: left;
115117
font-size: 24px;
@@ -124,8 +126,6 @@
124126
display: flex;
125127
flex-direction: row;
126128
justify-content: space-between;
127-
margin-top: 65px;
128-
margin-bottom: 45px;
129129
.language-title {
130130
margin: 0;
131131
font-size: 48px;
@@ -141,8 +141,11 @@
141141
}
142142
}
143143
}
144+
.library-category {
145+
padding-top: 50px;
146+
}
144147
.library-category-title {
145-
margin-top: 57px;
148+
margin: 0;
146149
font-size: 24px;
147150
color: #a6a6a6;
148151
font-weight: bold;
@@ -183,9 +186,9 @@
183186
}
184187
.library-howto {
185188
width: 60%;
186-
max-height: 550px;
187-
overflow-y: auto;
188-
overflow-x: hidden;
189+
// max-height: 550px;
190+
// overflow-y: auto;
191+
// overflow-x: hidden;
189192
}
190193
}
191194
}

‎src/pages/code.tsx

Lines changed: 42 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -6,8 +6,8 @@ import { toSlug } from "../utils/slug"
66
export function buildLanguagesMenu(pageContext: any) {
77
let lastRow: string[]
88
const rows: string[][] = []
9-
Object.keys(pageContext.codeData.Libraries).forEach((languageName, index) => {
10-
if (index % 7 === 0) {
9+
pageContext.languageList.forEach(({ name: languageName }: any, index: number) => {
10+
if (index % 6 === 0) {
1111
lastRow = [languageName]
1212
rows.push(lastRow)
1313
} else {
@@ -43,29 +43,38 @@ export function buildLibraryList(libraries: any[], pageContext: any) {
4343
{libraries.map(library => (
4444
<div className="library-info">
4545
<div className="library-details">
46-
<a className="library-name" href={library.url}>
46+
<a className="library-name" href={library.url} target="_blank">
4747
<p>{library.name}</p>
4848
</a>
4949
{library.github && (
5050
<div className="library-detail">
5151
<b>GitHub</b>
52-
<a href={`https://github.com/${library.github}`}>
52+
<a
53+
href={`https://github.com/${library.github}`}
54+
target="_blank"
55+
>
5356
{library.github}
5457
</a>
5558
</div>
5659
)}
5760
{library.npm && (
5861
<div className="library-detail">
5962
<b>npm</b>
60-
<a href={`https://www.npmjs.com/package/${library.npm}`}>
63+
<a
64+
href={`https://www.npmjs.com/package/${library.npm}`}
65+
target="_blank"
66+
>
6167
{library.npm}
6268
</a>
6369
</div>
6470
)}
6571
{library.gem && (
6672
<div className="library-detail">
6773
<b>gem</b>
68-
<a href={`https://rubygems.org/gems/${library.gem}`}>
74+
<a
75+
href={`https://rubygems.org/gems/${library.gem}`}
76+
target="_blank"
77+
>
6978
{library.gem}
7079
</a>
7180
</div>
@@ -88,10 +97,12 @@ export function buildLibraryList(libraries: any[], pageContext: any) {
8897
<span>{library.license}</span>
8998
</div>
9099
)}
91-
{library.howto && (
100+
{library.howto ? (
92101
<div className="library-description">
93102
<Marked pageContext={pageContext}>{library.description}</Marked>
94103
</div>
104+
) : (
105+
<br />
95106
)}
96107
</div>
97108
<div className="library-howto">
@@ -131,8 +142,9 @@ const categorySlugMap = [
131142

132143
export function buildLanguagesContent(pageContext: any) {
133144
const elements = []
134-
for (const languageName in pageContext.codeData.Libraries) {
135-
const libraryCategories = pageContext.codeData.Libraries[languageName]
145+
for (const languageObj of pageContext.languageList) {
146+
const languageName = languageObj.name;
147+
const libraryCategories = languageObj.categoryMap;
136148
const filteredCategorySlugMap = categorySlugMap.filter(
137149
([libraryCategoryName]) =>
138150
libraryCategories[libraryCategoryName as any]?.length
@@ -215,29 +227,32 @@ export default ({ pageContext }: any) => {
215227
{buildLanguagesMenu(pageContext)}
216228
{buildLanguagesContent(pageContext)}
217229
<h2>
218-
<a className="anchor" id="generic-tools" name="generic-tools"></a>
230+
<a className="anchor" id="generic-tools"></a>
219231
Tools
220232
<a className="hash-link" href="#generic-tools">
221233
#
222234
</a>
223235
</h2>
224-
{/* <Marked pageContext={pageContext}>
225-
{`
226-
${buildLibraryListMarkdown(pageContext.codeData.Tools)}
227-
`}
228-
</Marked>
229-
<Marked pageContext={pageContext}>
230-
{`
231-
## Services
232-
${buildLibraryListMarkdown(pageContext.codeData.Services)}
233-
`}
234-
</Marked>
235-
<Marked pageContext={pageContext}>
236-
{`
237-
## More Stuff
238-
${buildLibraryListMarkdown(pageContext.codeData["More Stuff"])}
239-
`}
240-
</Marked> */}
236+
{buildLibraryList(pageContext.otherLibraries.Tools, pageContext)}
237+
<h2>
238+
<a className="anchor" id="services"></a>
239+
Services
240+
<a className="hash-link" href="#services">
241+
#
242+
</a>
243+
</h2>
244+
{buildLibraryList(pageContext.otherLibraries.Services, pageContext)}
245+
<h2>
246+
<a className="anchor" id="more-stuff"></a>
247+
More Stuff
248+
<a className="hash-link" href="#more-stuff">
249+
#
250+
</a>
251+
</h2>
252+
{buildLibraryList(
253+
pageContext.otherLibraries["More Stuff"],
254+
pageContext
255+
)}
241256
</div>
242257
</div>
243258
</section>

0 commit comments

Comments
 (0)