1
0
mirror of https://github.com/uetchy/namae.git synced 2025-03-17 20:40:32 +09:00

chore: even more alternatives

This commit is contained in:
uetchy 2019-07-31 04:25:24 +09:00
parent 410b9dc059
commit b81f19f289
9 changed files with 72 additions and 32 deletions

View File

@ -43,13 +43,13 @@ export default function App() {
<CardHolder> <CardHolder>
<GithubCard name={query} /> <GithubCard name={query} />
<DomainCard name={query} /> <DomainCard name={query} />
<HomebrewCard name={query} />
<TwitterCard name={query} /> <TwitterCard name={query} />
<SlackCard name={query} /> <HomebrewCard name={query} />
<NpmCard name={query} /> <NpmCard name={query} />
<JsOrgCard name={query} />
<PypiCard name={query} /> <PypiCard name={query} />
<CratesioCard name={query} /> <CratesioCard name={query} />
<JsOrgCard name={query} />
<SlackCard name={query} />
<S3Card name={query} /> <S3Card name={query} />
</CardHolder> </CardHolder>
</Result> </Result>

View File

@ -115,7 +115,14 @@ export function Alternatives({ nameList, children }) {
{show ? ( {show ? (
nameList.map((name) => ( nameList.map((name) => (
<ErrorBoundary> <ErrorBoundary>
<Suspense fallback={<BarLoader />}>{children(name)}</Suspense> <Suspense
fallback={
<ItemContainer>
<BarLoader />
</ItemContainer>
}>
{children(name)}
</Suspense>
</ErrorBoundary> </ErrorBoundary>
)) ))
) : ( ) : (

View File

@ -3,13 +3,15 @@ import { DiRust } from 'react-icons/di'
import { Card, CardTitle, DedicatedAvailability } from './Card' import { Card, CardTitle, DedicatedAvailability } from './Card'
export default function CratesioCard({ name }) { export default function CratesioCard({ name }) {
const lowerCase = name.toLowerCase()
return ( return (
<Card key={name}> <Card key={lowerCase}>
<CardTitle>crates.io (Rust)</CardTitle> <CardTitle>crates.io (Rust)</CardTitle>
<DedicatedAvailability <DedicatedAvailability
name={name} name={lowerCase}
provider="cratesio" provider="cratesio"
url={`https://crates.io/crates/${name}`} url={`https://crates.io/crates/${lowerCase}`}
icon={<DiRust />} icon={<DiRust />}
/> />
</Card> </Card>

View File

@ -1,29 +1,46 @@
import React from 'react' import React from 'react'
import { Card, CardTitle, DedicatedAvailability } from './Card' import { Card, CardTitle, DedicatedAvailability, Alternatives } from './Card'
import { FaMapSigns } from 'react-icons/fa' import { FaMapSigns } from 'react-icons/fa'
export default function DomainCard({ name }) { export default function DomainCard({ name }) {
const lowerCase = name.toLowerCase()
return ( return (
<Card key={name}> <Card key={lowerCase}>
<CardTitle>Domain</CardTitle> <CardTitle>Domain</CardTitle>
<DedicatedAvailability <DedicatedAvailability
name={`${name}.app`} name={`${lowerCase}.app`}
provider="domain" provider="domain"
url={`https://domainr.com/?q=${name}.app`} url={`https://domainr.com/?q=${lowerCase}.app`}
icon={<FaMapSigns />} icon={<FaMapSigns />}
/> />
<DedicatedAvailability <DedicatedAvailability
name={`${name}.dev`} name={`${lowerCase}.dev`}
provider="domain" provider="domain"
url={`https://domainr.com/?q=${name}.dev`} url={`https://domainr.com/?q=${lowerCase}.dev`}
icon={<FaMapSigns />} icon={<FaMapSigns />}
/> />
<DedicatedAvailability <DedicatedAvailability
name={`${name}.org`} name={`${lowerCase}.org`}
provider="domain" provider="domain"
url={`https://domainr.com/?q=${name}.org`} url={`https://domainr.com/?q=${lowerCase}.org`}
icon={<FaMapSigns />} icon={<FaMapSigns />}
/> />
<Alternatives
nameList={[
`${lowerCase}app.com`,
`${lowerCase}.build`,
`${lowerCase}.ai`,
]}>
{(name) => (
<DedicatedAvailability
name={name}
provider="domain"
url={`https://domainr.com/?q=${name}.org`}
icon={<FaMapSigns />}
/>
)}
</Alternatives>
</Card> </Card>
) )
} }

View File

@ -1,6 +1,7 @@
import React from 'react' import React from 'react'
import { FaGithub } from 'react-icons/fa' import { FaGithub } from 'react-icons/fa'
import { Card, CardTitle, DedicatedAvailability, Alternatives } from './Card' import { Card, CardTitle, DedicatedAvailability, Alternatives } from './Card'
import { capitalize } from '../util/text'
export default function GithubCard({ name }) { export default function GithubCard({ name }) {
return ( return (
@ -14,7 +15,12 @@ export default function GithubCard({ name }) {
icon={<FaGithub />} icon={<FaGithub />}
/> />
<Alternatives <Alternatives
nameList={[`${name.toLowerCase()}hq`, `${name.toLowerCase()}-team`]}> nameList={[
`${name.toLowerCase()}hq`,
`${name.toLowerCase()}-team`,
`${capitalize(name)}Team`,
`${name.toLowerCase()}-org`,
]}>
{(name) => ( {(name) => (
<DedicatedAvailability <DedicatedAvailability
name={name} name={name}

View File

@ -3,19 +3,21 @@ import { Card, CardTitle, ExistenceAvailability } from './Card'
import { IoIosBeer } from 'react-icons/io' import { IoIosBeer } from 'react-icons/io'
export default function HomebrewCard({ name }) { export default function HomebrewCard({ name }) {
const lowerCase = name.toLowerCase()
return ( return (
<Card key={name}> <Card key={lowerCase}>
<CardTitle>Homebrew</CardTitle> <CardTitle>Homebrew</CardTitle>
<ExistenceAvailability <ExistenceAvailability
name={name} name={lowerCase}
target={`https://formulae.brew.sh/api/formula/${name}.json`} target={`https://formulae.brew.sh/api/formula/${lowerCase}.json`}
url={`https://formulae.brew.sh/formula/${name}`} url={`https://formulae.brew.sh/formula/${lowerCase}`}
icon={<IoIosBeer />} icon={<IoIosBeer />}
/> />
<ExistenceAvailability <ExistenceAvailability
name={name} name={lowerCase}
target={`https://formulae.brew.sh/api/cask/${name}.json`} target={`https://formulae.brew.sh/api/cask/${lowerCase}.json`}
url={`https://formulae.brew.sh/cask/${name}`} url={`https://formulae.brew.sh/cask/${lowerCase}`}
suffix=" (Cask)" suffix=" (Cask)"
icon={<IoIosBeer />} icon={<IoIosBeer />}
/> />

View File

@ -3,13 +3,15 @@ import { FaJsSquare } from 'react-icons/fa'
import { Card, CardTitle, DedicatedAvailability } from './Card' import { Card, CardTitle, DedicatedAvailability } from './Card'
export default function JsOrgCard({ name }) { export default function JsOrgCard({ name }) {
const lowerCase = name.toLowerCase()
return ( return (
<Card key={name}> <Card key={lowerCase}>
<CardTitle>js.org</CardTitle> <CardTitle>js.org</CardTitle>
<DedicatedAvailability <DedicatedAvailability
name={`${name}.js.org`} name={`${lowerCase}.js.org`}
provider="dns" provider="dns"
url={`https://${name}.js.org`} url={`https://${lowerCase}.js.org`}
icon={<FaJsSquare />} icon={<FaJsSquare />}
/> />
</Card> </Card>

View File

@ -3,13 +3,15 @@ import { Card, CardTitle, DedicatedAvailability } from './Card'
import { FaAws } from 'react-icons/fa' import { FaAws } from 'react-icons/fa'
export default function S3Card({ name }) { export default function S3Card({ name }) {
const lowerCase = name.toLowerCase()
return ( return (
<Card key={name}> <Card key={lowerCase}>
<CardTitle>AWS S3</CardTitle> <CardTitle>AWS S3</CardTitle>
<DedicatedAvailability <DedicatedAvailability
name={name} name={lowerCase}
provider="s3" provider="s3"
url={`https://${name}.s3.amazonaws.com`} url={`https://${lowerCase}.s3.amazonaws.com`}
suffix=".s3.amazonaws.com" suffix=".s3.amazonaws.com"
icon={<FaAws />} icon={<FaAws />}
/> />

View File

@ -3,13 +3,15 @@ import { Card, CardTitle, DedicatedAvailability } from './Card'
import { FaSlack } from 'react-icons/fa' import { FaSlack } from 'react-icons/fa'
export default function SlackCard({ name }) { export default function SlackCard({ name }) {
const lowerCase = name.toLowerCase()
return ( return (
<Card key={name}> <Card key={lowerCase}>
<CardTitle>Slack</CardTitle> <CardTitle>Slack</CardTitle>
<DedicatedAvailability <DedicatedAvailability
name={name} name={lowerCase}
provider="slack" provider="slack"
url={`https://${name}.slack.com`} url={`https://${lowerCase}.slack.com`}
suffix=".slack.com" suffix=".slack.com"
icon={<FaSlack />} icon={<FaSlack />}
/> />