mirror of
https://github.com/uetchy/namae.git
synced 2025-03-16 20:20:38 +09:00
feat: sectioned cards
This commit is contained in:
parent
218ee2889b
commit
c05ee42473
@ -28,7 +28,7 @@ export default async function handler(
|
|||||||
|
|
||||||
const term = encodeURIComponent(query);
|
const term = encodeURIComponent(query);
|
||||||
const countryCode = country || 'us';
|
const countryCode = country || 'us';
|
||||||
const limit = 10;
|
const limit = 5;
|
||||||
|
|
||||||
try {
|
try {
|
||||||
const response = await fetch(
|
const response = await fetch(
|
||||||
|
@ -27,7 +27,7 @@ export default async function handler(
|
|||||||
description: item[6],
|
description: item[6],
|
||||||
url: item[37],
|
url: item[37],
|
||||||
}));
|
}));
|
||||||
send(res, { result: items.slice(0, 10) });
|
send(res, { result: items.slice(0, 5) });
|
||||||
} catch (err: any) {
|
} catch (err: any) {
|
||||||
sendError(res, err);
|
sendError(res, err);
|
||||||
}
|
}
|
||||||
|
@ -30,7 +30,7 @@ export default async function handler(
|
|||||||
author: item.authors[0].name,
|
author: item.authors[0].name,
|
||||||
};
|
};
|
||||||
});
|
});
|
||||||
send(res, { result: items.slice(0, 10) });
|
send(res, { result: items.slice(0, 5) });
|
||||||
} catch (err: any) {
|
} catch (err: any) {
|
||||||
sendError(res, err);
|
sendError(res, err);
|
||||||
}
|
}
|
||||||
|
@ -90,7 +90,7 @@ export default async function handler(
|
|||||||
phoneticName: entry.phoneticName,
|
phoneticName: entry.phoneticName,
|
||||||
englishName: entry.englishName,
|
englishName: entry.englishName,
|
||||||
}))
|
}))
|
||||||
.slice(0, 10) || [],
|
.slice(0, 5) || [],
|
||||||
});
|
});
|
||||||
} catch (err: any) {
|
} catch (err: any) {
|
||||||
sendError(res, err);
|
sendError(res, err);
|
||||||
|
@ -33,7 +33,7 @@ export default async function handler(
|
|||||||
author: entry[4][0][0][0],
|
author: entry[4][0][0][0],
|
||||||
url: 'https://play.google.com' + entry[9][4][2],
|
url: 'https://play.google.com' + entry[9][4][2],
|
||||||
}));
|
}));
|
||||||
send(res, { result: apps.slice(0, 10) });
|
send(res, { result: apps.slice(0, 5) });
|
||||||
} catch (err: any) {
|
} catch (err: any) {
|
||||||
sendError(res, err);
|
sendError(res, err);
|
||||||
}
|
}
|
||||||
|
@ -19,7 +19,7 @@
|
|||||||
"archlinux": "Arch Linux",
|
"archlinux": "Arch Linux",
|
||||||
"ubuntu": "Ubuntu",
|
"ubuntu": "Ubuntu",
|
||||||
"debian": "Debian",
|
"debian": "Debian",
|
||||||
"domains": "Domains",
|
"domains": "Domain",
|
||||||
"firebase": "Firebase",
|
"firebase": "Firebase",
|
||||||
"github": "GitHub Organization",
|
"github": "GitHub Organization",
|
||||||
"githubSearch": "GitHub Repository",
|
"githubSearch": "GitHub Repository",
|
||||||
@ -34,7 +34,7 @@
|
|||||||
"netlify": "Netlify",
|
"netlify": "Netlify",
|
||||||
"now": "Vercel",
|
"now": "Vercel",
|
||||||
"npm": "npm",
|
"npm": "npm",
|
||||||
"nta": "Company (JP)",
|
"nta": "Company (Japan)",
|
||||||
"ocaml": "OCaml",
|
"ocaml": "OCaml",
|
||||||
"playStore": "Google Play Store",
|
"playStore": "Google Play Store",
|
||||||
"pypi": "PyPI",
|
"pypi": "PyPI",
|
||||||
@ -62,5 +62,12 @@
|
|||||||
"low": "Common",
|
"low": "Common",
|
||||||
"moderate": "Rare"
|
"moderate": "Rare"
|
||||||
},
|
},
|
||||||
"join-us": "Send <1>a pull request</1> and become a contributor!"
|
"join-us": "Send <1>a pull request</1> and become a contributor!",
|
||||||
|
"section": {
|
||||||
|
"starter": "Starter",
|
||||||
|
"social": "Social Network",
|
||||||
|
"package": "Package",
|
||||||
|
"web": "Web Platform",
|
||||||
|
"app": "App & Extension"
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
@ -30,7 +30,7 @@
|
|||||||
"netlify": "Netlify",
|
"netlify": "Netlify",
|
||||||
"now": "Vercel",
|
"now": "Vercel",
|
||||||
"npm": "npm",
|
"npm": "npm",
|
||||||
"nta": "法人",
|
"nta": "法人 (日本)",
|
||||||
"ocaml": "OCaml",
|
"ocaml": "OCaml",
|
||||||
"pypi": "PyPI",
|
"pypi": "PyPI",
|
||||||
"rubygems": "RubyGems",
|
"rubygems": "RubyGems",
|
||||||
@ -51,5 +51,12 @@
|
|||||||
"low": "普通",
|
"low": "普通",
|
||||||
"moderate": "そこそこユニーク"
|
"moderate": "そこそこユニーク"
|
||||||
},
|
},
|
||||||
"join-us": "<1>プルリクエスト</1>を送ってコントリビューターになりましょう!"
|
"join-us": "<1>プルリクエスト</1>を送ってコントリビューターになりましょう!",
|
||||||
|
"section": {
|
||||||
|
"starter": "基本",
|
||||||
|
"social": "SNS",
|
||||||
|
"package": "パッケージ",
|
||||||
|
"web": "Web",
|
||||||
|
"app": "アプリとエクステンション"
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
@ -301,7 +301,7 @@ const ErrorHandler: React.FC = ({ children }) => (
|
|||||||
);
|
);
|
||||||
|
|
||||||
const CardContainer = styled.div`
|
const CardContainer = styled.div`
|
||||||
padding: 40px;
|
padding: 30px 50px;
|
||||||
font-size: 1rem;
|
font-size: 1rem;
|
||||||
line-height: 1rem;
|
line-height: 1rem;
|
||||||
|
|
||||||
|
@ -9,21 +9,22 @@ import CratesioCard from './providers/Cratesio';
|
|||||||
import DomainCard from './providers/Domains';
|
import DomainCard from './providers/Domains';
|
||||||
import FirebaseCard from './providers/Firebase';
|
import FirebaseCard from './providers/Firebase';
|
||||||
import FirefoxAddonsCard from './providers/FirefoxAddons';
|
import FirefoxAddonsCard from './providers/FirefoxAddons';
|
||||||
|
import FlyIoCard from './providers/FlyIo';
|
||||||
import GithubCard from './providers/GitHubOrganization';
|
import GithubCard from './providers/GitHubOrganization';
|
||||||
import GithubSearchCard from './providers/GitHubSearch';
|
import GithubSearchCard from './providers/GitHubSearch';
|
||||||
import GitLabCard from './providers/GitLab';
|
import GitLabCard from './providers/GitLab';
|
||||||
import HerokuCard from './providers/Heroku';
|
import HerokuCard from './providers/Heroku';
|
||||||
import HexPmCard from './providers/HexPm';
|
import HexPmCard from './providers/HexPm';
|
||||||
import HomebrewCard from './providers/Homebrew';
|
import HomebrewCard from './providers/Homebrew';
|
||||||
// import InstagramCard from './providers/Instagram';
|
|
||||||
import JsOrgCard from './providers/JsOrg';
|
import JsOrgCard from './providers/JsOrg';
|
||||||
import ModLandCard from './providers/ModLand';
|
|
||||||
import LinuxCard from './providers/Linux';
|
import LinuxCard from './providers/Linux';
|
||||||
|
import ModLandCard from './providers/ModLand';
|
||||||
import NetlifyCard from './providers/Netlify';
|
import NetlifyCard from './providers/Netlify';
|
||||||
import NpmCard from './providers/Npm';
|
import NpmCard from './providers/Npm';
|
||||||
import NtaCard from './providers/Nta';
|
import NtaCard from './providers/Nta';
|
||||||
import OcamlCard from './providers/Ocaml';
|
import OcamlCard from './providers/Ocaml';
|
||||||
import PlayStoreCard from './providers/PlayStore';
|
import PlayStoreCard from './providers/PlayStore';
|
||||||
|
import ProductHuntCard from './providers/ProductHunt';
|
||||||
import PypiCard from './providers/PyPI';
|
import PypiCard from './providers/PyPI';
|
||||||
import RubyGemsCard from './providers/RubyGems';
|
import RubyGemsCard from './providers/RubyGems';
|
||||||
import S3Card from './providers/S3';
|
import S3Card from './providers/S3';
|
||||||
@ -32,65 +33,105 @@ import SubredditCard from './providers/Subreddit';
|
|||||||
import TwitterCard from './providers/Twitter';
|
import TwitterCard from './providers/Twitter';
|
||||||
import VercelCard from './providers/Vercel';
|
import VercelCard from './providers/Vercel';
|
||||||
import YouTubeCard from './providers/YouTube';
|
import YouTubeCard from './providers/YouTube';
|
||||||
import FlyIoCard from './providers/FlyIo';
|
// import InstagramCard from './providers/Instagram';
|
||||||
import ProductHuntCard from './providers/ProductHunt';
|
|
||||||
|
|
||||||
const Index: React.FC<{ query: string }> = ({ query }) => {
|
const Index: React.FC<{ query: string }> = ({ query }) => {
|
||||||
const {
|
const { t } = useTranslation();
|
||||||
i18n: { language },
|
|
||||||
} = useTranslation();
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<Cards>
|
<Section>
|
||||||
<DomainCard query={query} />
|
{/* <Title>{t('section.starter')}</Title> */}
|
||||||
<GithubCard query={query} />
|
<Cards>
|
||||||
<TwitterCard query={query} />
|
<DomainCard query={query} />
|
||||||
<YouTubeCard query={query} />
|
<GithubCard query={query} />
|
||||||
<NpmCard query={query} />
|
<GitLabCard query={query} />
|
||||||
<HomebrewCard query={query} />
|
<SlackCard query={query} />
|
||||||
<GitLabCard query={query} />
|
<ProductHuntCard query={query} />
|
||||||
<PypiCard query={query} />
|
<GithubSearchCard query={query} />
|
||||||
<CratesioCard query={query} />
|
<NtaCard query={query} />
|
||||||
<RubyGemsCard query={query} />
|
</Cards>
|
||||||
<HexPmCard query={query} />
|
</Section>
|
||||||
<LinuxCard query={query} />
|
<Section>
|
||||||
<OcamlCard query={query} />
|
<Title>{t('section.social')}</Title>
|
||||||
<FlyIoCard query={query} />
|
<Cards>
|
||||||
<VercelCard query={query} />
|
<TwitterCard query={query} />
|
||||||
<HerokuCard query={query} />
|
<SubredditCard query={query} />
|
||||||
<NetlifyCard query={query} />
|
<YouTubeCard query={query} />
|
||||||
<CloudflareCard query={query} />
|
{/* <InstagramCard query={query} /> */}
|
||||||
<JsOrgCard query={query} />
|
</Cards>
|
||||||
<ModLandCard query={query} />
|
</Section>
|
||||||
<SlackCard query={query} />
|
<Section>
|
||||||
{/* <InstagramCard query={query} /> */}
|
<Title>{t('section.package')}</Title>
|
||||||
<SubredditCard query={query} />
|
<Cards>
|
||||||
<S3Card query={query} />
|
<HomebrewCard query={query} />
|
||||||
<FirebaseCard query={query} />
|
<LinuxCard query={query} />
|
||||||
</Cards>
|
<NpmCard query={query} />
|
||||||
<Cards>
|
<PypiCard query={query} />
|
||||||
<ProductHuntCard query={query} />
|
<CratesioCard query={query} />
|
||||||
<GithubSearchCard query={query} />
|
<RubyGemsCard query={query} />
|
||||||
<AppStoreCard query={query} />
|
<HexPmCard query={query} />
|
||||||
<PlayStoreCard query={query} />
|
<OcamlCard query={query} />
|
||||||
<FirefoxAddonsCard query={query} />
|
</Cards>
|
||||||
<ChromeWebStoreCard query={query} />
|
</Section>
|
||||||
{language === 'ja' ? <NtaCard query={query} /> : null}
|
<Section>
|
||||||
</Cards>
|
<Title>{t('section.web')}</Title>
|
||||||
|
<Cards>
|
||||||
|
<FlyIoCard query={query} />
|
||||||
|
<VercelCard query={query} />
|
||||||
|
<HerokuCard query={query} />
|
||||||
|
<NetlifyCard query={query} />
|
||||||
|
<CloudflareCard query={query} />
|
||||||
|
<S3Card query={query} />
|
||||||
|
<FirebaseCard query={query} />
|
||||||
|
<JsOrgCard query={query} />
|
||||||
|
<ModLandCard query={query} />
|
||||||
|
</Cards>
|
||||||
|
</Section>
|
||||||
|
<Section>
|
||||||
|
<Title>{t('section.app')}</Title>
|
||||||
|
<Cards>
|
||||||
|
<AppStoreCard query={query} />
|
||||||
|
<PlayStoreCard query={query} />
|
||||||
|
<FirefoxAddonsCard query={query} />
|
||||||
|
<ChromeWebStoreCard query={query} />
|
||||||
|
</Cards>
|
||||||
|
</Section>
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
export default Index;
|
export default Index;
|
||||||
|
|
||||||
|
const Section = styled.div`
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
margin: 0 0 40px;
|
||||||
|
`;
|
||||||
|
|
||||||
|
const Title = styled.h1`
|
||||||
|
margin: 20px 0 10px;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 3rem;
|
||||||
|
|
||||||
|
${mobile} {
|
||||||
|
margin: 0;
|
||||||
|
text-align: left;
|
||||||
|
font-size: 2rem;
|
||||||
|
padding: 0 20px;
|
||||||
|
}
|
||||||
|
`;
|
||||||
|
|
||||||
const Cards = styled.div`
|
const Cards = styled.div`
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
|
margin-top: 20px;
|
||||||
|
|
||||||
${mobile} {
|
${mobile} {
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
margin-top: 40px;
|
||||||
}
|
}
|
||||||
`;
|
`;
|
||||||
|
@ -13,7 +13,7 @@ const CloudflareCard: React.FC<{ query: string }> = ({ query }) => {
|
|||||||
});
|
});
|
||||||
const lowerCase = normalizedQuery.toLowerCase();
|
const lowerCase = normalizedQuery.toLowerCase();
|
||||||
|
|
||||||
const names = [normalizedQuery];
|
const names = [lowerCase];
|
||||||
const moreNames = [
|
const moreNames = [
|
||||||
`${lowerCase}-web`,
|
`${lowerCase}-web`,
|
||||||
`${lowerCase}-webapp`,
|
`${lowerCase}-webapp`,
|
||||||
@ -26,7 +26,7 @@ const CloudflareCard: React.FC<{ query: string }> = ({ query }) => {
|
|||||||
{(name) => (
|
{(name) => (
|
||||||
<DedicatedAvailability
|
<DedicatedAvailability
|
||||||
name={`${name}.pages.dev`}
|
name={`${name}.pages.dev`}
|
||||||
service="existence"
|
service="dns"
|
||||||
message={`Go to ${name}.pages.dev`}
|
message={`Go to ${name}.pages.dev`}
|
||||||
link={`https://${name}.pages.dev`}
|
link={`https://${name}.pages.dev`}
|
||||||
icon={<FaCloudflare />}
|
icon={<FaCloudflare />}
|
||||||
|
@ -8,7 +8,7 @@ import { Card, Result } from '../core';
|
|||||||
const Search: React.FC<{ query: string }> = ({ query }) => {
|
const Search: React.FC<{ query: string }> = ({ query }) => {
|
||||||
const { t } = useTranslation();
|
const { t } = useTranslation();
|
||||||
const searchQuery = `${query} in:name`;
|
const searchQuery = `${query} in:name`;
|
||||||
const limit = 10;
|
const limit = 5;
|
||||||
const response = useFetch(
|
const response = useFetch(
|
||||||
`https://api.github.com/search/repositories?q=${encodeURIComponent(
|
`https://api.github.com/search/repositories?q=${encodeURIComponent(
|
||||||
searchQuery
|
searchQuery
|
||||||
|
@ -12,7 +12,13 @@ const GitLabCard: React.FC<{ query: string }> = ({ query }) => {
|
|||||||
});
|
});
|
||||||
const lowerCase = normalizedQuery.toLowerCase();
|
const lowerCase = normalizedQuery.toLowerCase();
|
||||||
|
|
||||||
const names = [lowerCase];
|
const names = [
|
||||||
|
normalizedQuery,
|
||||||
|
`${lowerCase}-dev`,
|
||||||
|
`${lowerCase}-org`,
|
||||||
|
`${lowerCase}-team`,
|
||||||
|
`${lowerCase}hq`,
|
||||||
|
];
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Card title={t('providers.gitlab')}>
|
<Card title={t('providers.gitlab')}>
|
||||||
|
@ -24,7 +24,7 @@ const Search: React.FC<{ query: string }> = ({ query }) => {
|
|||||||
<>
|
<>
|
||||||
{hits.length > 0 ? (
|
{hits.length > 0 ? (
|
||||||
hits
|
hits
|
||||||
.slice(0, 10)
|
.slice(0, 5)
|
||||||
.map((hit) => (
|
.map((hit) => (
|
||||||
<Result
|
<Result
|
||||||
title={hit.name}
|
title={hit.name}
|
||||||
|
@ -14,13 +14,13 @@ const TwitterCard: React.FC<{ query: string }> = ({ query }) => {
|
|||||||
|
|
||||||
const names = [
|
const names = [
|
||||||
normalizedQuery,
|
normalizedQuery,
|
||||||
|
`${lowerCase}hq`,
|
||||||
`${capitalCase}App`,
|
`${capitalCase}App`,
|
||||||
`${lowerCase}_team`,
|
`${lowerCase}_team`,
|
||||||
`${capitalCase}HQ`,
|
`${lowerCase}_support`,
|
||||||
`hey${lowerCase}`,
|
|
||||||
];
|
];
|
||||||
const moreNames = [
|
const moreNames = [
|
||||||
`${lowerCase}_support`,
|
`hey${lowerCase}`,
|
||||||
`${lowerCase}_org`,
|
`${lowerCase}_org`,
|
||||||
`${lowerCase}_app`,
|
`${lowerCase}_app`,
|
||||||
`${capitalCase}JS`,
|
`${capitalCase}JS`,
|
||||||
|
@ -5,7 +5,7 @@ import XHR from 'i18next-xhr-backend';
|
|||||||
import LanguageDetector from 'i18next-browser-languagedetector';
|
import LanguageDetector from 'i18next-browser-languagedetector';
|
||||||
import { initReactI18next } from 'react-i18next';
|
import { initReactI18next } from 'react-i18next';
|
||||||
|
|
||||||
const TRANSLATION_VERSION = '18';
|
const TRANSLATION_VERSION = '19';
|
||||||
|
|
||||||
i18n
|
i18n
|
||||||
.use(Backend)
|
.use(Backend)
|
||||||
|
Loading…
x
Reference in New Issue
Block a user