uetchy/namae
1
0
Fork 0
mirror of https://github.com/uetchy/namae.git synced 2025-08-21 10:18:12 +09:00
Code Issues Releases Activity

style: prettier

Browse Source
This commit is contained in:
uetchy
2020-08-20 00:57:33 +09:00
parent a31c13e725
commit c7bbe707a9
71 changed files with 1074 additions and 1089 deletions
Download Patch File Download Diff File Expand all files Collapse all files

192
src/components/cards/core.tsx
View File

@@ -1,21 +1,21 @@
import useFetch from 'fetch-suspense';
import Tooltip from 'rc-tooltip';
import React, { Suspense, useEffect, useState } from 'react';
import { OutboundLink } from 'react-ga';
import { useTranslation } from 'react-i18next';
import { GoInfo } from 'react-icons/go';
import { IoIosFlash } from 'react-icons/io';
import BarLoader from 'react-spinners/BarLoader';
import styled from 'styled-components';
import { useStoreActions } from '../../store';
import { sendError, sendExpandEvent } from '../../util/analytics';
import { mobile } from '../../util/css';
import useFetch from 'fetch-suspense'
import Tooltip from 'rc-tooltip'
import React, { Suspense, useEffect, useState } from 'react'
import { OutboundLink } from 'react-ga'
import { useTranslation } from 'react-i18next'
import { GoInfo } from 'react-icons/go'
import { IoIosFlash } from 'react-icons/io'
import BarLoader from 'react-spinners/BarLoader'
import styled from 'styled-components'
import { useStoreActions } from '../../store'
import { sendError, sendExpandEvent } from '../../util/analytics'
import { mobile } from '../../util/css'
export const COLORS = {
available: '#6e00ff',
unavailable: 'darkgrey',
error: '#ff388b',
};
}
export const Card: React.FC<{ title: string }> = ({ title, children }) => {
return (
@@ -25,25 +25,25 @@ export const Card: React.FC<{ title: string }> = ({ title, children }) => {
<ErrorHandler>{children}</ErrorHandler>
</CardContent>
</CardContainer>
);
};
)
}
export const Repeater: React.FC<{
items: string[];
moreItems?: string[];
children: (name: string) => React.ReactNode;
items: string[]
moreItems?: string[]
children: (name: string) => React.ReactNode
}> = ({ items = [], moreItems = [], children }) => {
const [revealAlternatives, setRevealAlternatives] = useState(false);
const { t } = useTranslation();
const [revealAlternatives, setRevealAlternatives] = useState(false)
const { t } = useTranslation()
function onClick() {
sendExpandEvent();
setRevealAlternatives(true);
sendExpandEvent()
setRevealAlternatives(true)
}
useEffect(() => {
setRevealAlternatives(false);
}, [items, moreItems]);
setRevealAlternatives(false)
}, [items, moreItems])
return (
<>
@@ -60,38 +60,38 @@ export const Repeater: React.FC<{
<Button onClick={onClick}>{t('showMore')}</Button>
) : null}
</>
);
};
)
}
interface Response {
error?: string;
availability: boolean;
error?: string
availability: boolean
}
class APIError extends Error {
constructor(message?: string) {
super(message);
Object.setPrototypeOf(this, APIError.prototype);
super(message)
Object.setPrototypeOf(this, APIError.prototype)
}
}
class NotFoundError extends Error {
constructor(message?: string) {
super(message);
Object.setPrototypeOf(this, NotFoundError.prototype);
super(message)
Object.setPrototypeOf(this, NotFoundError.prototype)
}
}
export const DedicatedAvailability: React.FC<{
name: string;
query?: string;
message?: string;
messageIfTaken?: string;
service: string;
link: string;
linkIfTaken?: string;
prefix?: string;
suffix?: string;
icon: React.ReactNode;
name: string
query?: string
message?: string
messageIfTaken?: string
service: string
link: string
linkIfTaken?: string
prefix?: string
suffix?: string
icon: React.ReactNode
}> = ({
name,
query = undefined,
@@ -104,19 +104,19 @@ export const DedicatedAvailability: React.FC<{
suffix = '',
icon,
}) => {
const increaseCounter = useStoreActions((actions) => actions.stats.add);
const increaseCounter = useStoreActions((actions) => actions.stats.add)
const response = useFetch(
`/api/services/${service}/${encodeURIComponent(query || name)}`,
) as Response;
`/api/services/${service}/${encodeURIComponent(query || name)}`
) as Response
if (response.error) {
throw new APIError(`${service}: ${response.error}`);
throw new APIError(`${service}: ${response.error}`)
}
useEffect(() => {
increaseCounter(response.availability);
increaseCounter(response.availability)
// eslint-disable-next-line
}, []);
}, [])
return (
<Result
@@ -128,19 +128,19 @@ export const DedicatedAvailability: React.FC<{
suffix={suffix}
availability={response.availability}
/>
);
};
)
}
export const ExistentialAvailability: React.FC<{
name: string;
target: string;
message?: string;
messageIfTaken?: string;
link: string;
linkIfTaken?: string;
prefix?: string;
suffix?: string;
icon: React.ReactNode;
name: string
target: string
message?: string
messageIfTaken?: string
link: string
linkIfTaken?: string
prefix?: string
suffix?: string
icon: React.ReactNode
}> = ({
name,
message = '',
@@ -152,19 +152,19 @@ export const ExistentialAvailability: React.FC<{
suffix = '',
icon,
}) => {
const increaseCounter = useStoreActions((actions) => actions.stats.add);
const response = useFetch(target, undefined, { metadata: true });
const increaseCounter = useStoreActions((actions) => actions.stats.add)
const response = useFetch(target, undefined, { metadata: true })
if (response.status !== 404 && response.status !== 200) {
throw new NotFoundError(`${name}: ${response.status}`);
throw new NotFoundError(`${name}: ${response.status}`)
}
const availability = response.status === 404;
const availability = response.status === 404
useEffect(() => {
increaseCounter(availability);
increaseCounter(availability)
// eslint-disable-next-line
}, []);
}, [])
return (
<Result
@@ -176,17 +176,17 @@ export const ExistentialAvailability: React.FC<{
suffix={suffix}
availability={availability}
/>
);
};
)
}
export const Result: React.FC<{
title: string;
message?: string;
link?: string;
icon: React.ReactNode;
prefix?: string;
suffix?: string;
availability?: boolean;
title: string
message?: string
link?: string
icon: React.ReactNode
prefix?: string
suffix?: string
availability?: boolean
}> = ({
title,
message = '',
@@ -202,13 +202,13 @@ export const Result: React.FC<{
{title}
{suffix}
</>
);
)
const itemColor =
availability === undefined
? 'inherit'
: availability
? COLORS.available
: COLORS.unavailable;
: COLORS.unavailable
return (
<ResultContainer>
<Tooltip overlay={message} placement="top" trigger={['hover']}>
@@ -235,8 +235,8 @@ export const Result: React.FC<{
</ResultItem>
</Tooltip>
</ResultContainer>
);
};
)
}
// 1. getDerivedStateFromError
// 2. render()
@@ -247,23 +247,23 @@ class ErrorBoundary extends React.Component<
{ hasError: boolean; message: string; eventId?: string }
> {
constructor(props: {}) {
super(props);
this.state = { hasError: false, message: '', eventId: undefined };
super(props)
this.state = { hasError: false, message: '', eventId: undefined }
}
// used in SSR
static getDerivedStateFromError(error: Error) {
return { hasError: true, message: error.message };
return { hasError: true, message: error.message }
}
// eslint-disable-next-line @typescript-eslint/no-explicit-any
componentDidCatch(error: Error, errorInfo: any) {
if (error instanceof APIError || error instanceof NotFoundError) {
return;
return
}
sendError(error, errorInfo).then((eventId) => {
this.setState({ eventId });
});
this.setState({ eventId })
})
}
render() {
@@ -285,9 +285,9 @@ class ErrorBoundary extends React.Component<
</ResultItem>
</Tooltip>
</ResultContainer>
);
)
}
return this.props.children;
return this.props.children
}
}
@@ -303,7 +303,7 @@ const ErrorHandler: React.FC = ({ children }) => (
{children}
</Suspense>
</ErrorBoundary>
);
)
const CardContainer = styled.div`
padding: 40px;
@@ -314,7 +314,7 @@ const CardContainer = styled.div`
margin-bottom: 40px;
padding: 0px;
}
`;
`
const CardTitle = styled.div`
margin-bottom: 15px;
@@ -327,7 +327,7 @@ const CardTitle = styled.div`
font-size: 1.2rem;
font-weight: 600;
}
`;
`
const CardContent = styled.div`
border-radius: 2px;
@@ -339,7 +339,7 @@ const CardContent = styled.div`
border-radius: 0;
font-size: 1.2em;
}
`;
`
const Button = styled.div`
margin-top: 5px;
@@ -350,17 +350,17 @@ const Button = styled.div`
cursor: pointer;
font-family: monospace;
font-size: 0.8em;
`;
`
const ResultContainer = styled.div`
display: flex;
align-items: center;
padding: 4px 0;
`;
`
export const ResultIcon = styled.div`
width: 1em;
`;
`
export const ResultItem = styled.div`
display: flex;
@@ -368,7 +368,7 @@ export const ResultItem = styled.div`
align-items: flex-start;
word-break: break-all;
color: ${({ color }) => color};
`;
`
export const ResultName = styled.div`
margin-left: 6px;
@@ -378,7 +378,7 @@ export const ResultName = styled.div`
text-decoration: none;
color: inherit;
}
`;
`
export const AvailableIcon = styled.div`
margin-top: 2px;
@@ -388,4 +388,4 @@ export const AvailableIcon = styled.div`
text-align: center;
font-size: 13px;
height: 15px;
`;
`

64
src/components/cards/index.tsx
View File

@@ -1,35 +1,35 @@
import React from 'react';
import { useTranslation } from 'react-i18next';
import styled from 'styled-components';
import { mobile } from '../../util/css';
import AppStoreCard from './providers/AppStore';
import CratesioCard from './providers/Cratesio';
import DomainCard from './providers/Domains';
import FirebaseCard from './providers/Firebase';
import GithubCard from './providers/GitHubRepository';
import GithubSearchCard from './providers/GitHubSearch';
import GitLabCard from './providers/GitLab';
import HerokuCard from './providers/Heroku';
import HomebrewCard from './providers/Homebrew';
import InstagramCard from './providers/Instagram';
import JsOrgCard from './providers/JsOrg';
import LinuxCard from './providers/Linux';
import NetlifyCard from './providers/Netlify';
import NpmCard from './providers/Npm';
import NtaCard from './providers/Nta';
import OcamlCard from './providers/Ocaml';
import PypiCard from './providers/PyPI';
import RubyGemsCard from './providers/RubyGems';
import S3Card from './providers/S3';
import SlackCard from './providers/Slack';
import SpectrumCard from './providers/Spectrum';
import TwitterCard from './providers/Twitter';
import VercelCard from './providers/Vercel';
import React from 'react'
import { useTranslation } from 'react-i18next'
import styled from 'styled-components'
import { mobile } from '../../util/css'
import AppStoreCard from './providers/AppStore'
import CratesioCard from './providers/Cratesio'
import DomainCard from './providers/Domains'
import FirebaseCard from './providers/Firebase'
import GithubCard from './providers/GitHubRepository'
import GithubSearchCard from './providers/GitHubSearch'
import GitLabCard from './providers/GitLab'
import HerokuCard from './providers/Heroku'
import HomebrewCard from './providers/Homebrew'
import InstagramCard from './providers/Instagram'
import JsOrgCard from './providers/JsOrg'
import LinuxCard from './providers/Linux'
import NetlifyCard from './providers/Netlify'
import NpmCard from './providers/Npm'
import NtaCard from './providers/Nta'
import OcamlCard from './providers/Ocaml'
import PypiCard from './providers/PyPI'
import RubyGemsCard from './providers/RubyGems'
import S3Card from './providers/S3'
import SlackCard from './providers/Slack'
import SpectrumCard from './providers/Spectrum'
import TwitterCard from './providers/Twitter'
import VercelCard from './providers/Vercel'
const Index: React.FC<{ query: string }> = ({ query }) => {
const {
i18n: { language },
} = useTranslation();
} = useTranslation()
return (
<>
@@ -61,10 +61,10 @@ const Index: React.FC<{ query: string }> = ({ query }) => {
{language === 'ja' ? <NtaCard query={query} /> : null}
</Cards>
</>
);
};
)
}
export default Index;
export default Index
const Cards = styled.div`
display: flex;
@@ -75,4 +75,4 @@ const Cards = styled.div`
${mobile} {
flex-direction: column;
}
`;
`

34
src/components/cards/providers/AppStore.tsx
View File

@@ -1,18 +1,18 @@
import useFetch from 'fetch-suspense';
import React from 'react';
import { useTranslation } from 'react-i18next';
import { FaAppStore, FaInfoCircle } from 'react-icons/fa';
import { Card, Result } from '../core';
import useFetch from 'fetch-suspense'
import React from 'react'
import { useTranslation } from 'react-i18next'
import { FaAppStore, FaInfoCircle } from 'react-icons/fa'
import { Card, Result } from '../core'
const Search: React.FC<{ query: string }> = ({ query }) => {
const { t } = useTranslation();
const term = encodeURIComponent(query);
const { t } = useTranslation()
const term = encodeURIComponent(query)
const response = useFetch(
`/availability/appstore/${term}?country=${t('countryCode')}`,
`/availability/appstore/${term}?country=${t('countryCode')}`
) as {
result: Array<{ name: string; viewURL: string; price: number; id: string }>;
};
const apps = response.result;
result: Array<{ name: string; viewURL: string; price: number; id: string }>
}
const apps = response.result
return (
<>
@@ -30,17 +30,17 @@ const Search: React.FC<{ query: string }> = ({ query }) => {
<Result title={t('noResult')} icon={<FaInfoCircle />} />
)}
</>
);
};
)
}
const AppStoreCard: React.FC<{ query: string }> = ({ query }) => {
const { t } = useTranslation();
const { t } = useTranslation()
return (
<Card title={t('providers.appStore')}>
<Search query={query} />
</Card>
);
};
)
}
export default AppStoreCard;
export default AppStoreCard

23
src/components/cards/providers/Cratesio.tsx
View File

@@ -1,14 +1,13 @@
import React from 'react';
import {useTranslation} from 'react-i18next';
import {DiRust} from 'react-icons/di';
import React from 'react'
import { useTranslation } from 'react-i18next'
import { DiRust } from 'react-icons/di'
import { Card, DedicatedAvailability, Repeater } from '../core'
import {Card, Repeater, DedicatedAvailability} from '../core';
const CratesioCard: React.FC<{ query: string }> = ({ query }) => {
const { t } = useTranslation()
const lowerCase = query.toLowerCase()
const CratesioCard: React.FC<{query: string}> = ({query}) => {
const {t} = useTranslation();
const lowerCase = query.toLowerCase();
const names = [lowerCase];
const names = [lowerCase]
return (
<Card title={t('providers.rust')}>
@@ -25,7 +24,7 @@ const CratesioCard: React.FC<{query: string}> = ({query}) => {
)}
</Repeater>
</Card>
);
};
)
}
export default CratesioCard;
export default CratesioCard

34
src/components/cards/providers/Domains.tsx
View File

@@ -1,17 +1,15 @@
import React from 'react';
import {useTranslation} from 'react-i18next';
import {MdDomain} from 'react-icons/md';
import React from 'react'
import { useTranslation } from 'react-i18next'
import { MdDomain } from 'react-icons/md'
import {Card, Repeater, DedicatedAvailability} from '../core';
import {zones} from '../../../util/zones';
import { Card, Repeater, DedicatedAvailability } from '../core'
import { zones } from '../../../util/zones'
const DomainCard: React.FC<{query: string}> = ({query}) => {
const {t} = useTranslation();
const DomainCard: React.FC<{ query: string }> = ({ query }) => {
const { t } = useTranslation()
const sanitizedQuery = query
.replace(/[^0-9a-zA-Z_-]/g, '')
.replace(/_/g, '-');
const lowerCase = sanitizedQuery.toLowerCase();
const sanitizedQuery = query.replace(/[^0-9a-zA-Z_-]/g, '').replace(/_/g, '-')
const lowerCase = sanitizedQuery.toLowerCase()
const domainHackSuggestions = zones
.map((zone) => new RegExp(`${zone}$`).exec(lowerCase.slice(1)))
@@ -20,8 +18,8 @@ const DomainCard: React.FC<{query: string}> = ({query}) => {
(m) =>
lowerCase.substring(0, m.index + 1) +
'.' +
lowerCase.substring(m.index + 1),
);
lowerCase.substring(m.index + 1)
)
const names = [
`${lowerCase}.com`,
@@ -31,7 +29,7 @@ const DomainCard: React.FC<{query: string}> = ({query}) => {
`${lowerCase}.org`,
`${lowerCase}.io`,
...domainHackSuggestions,
];
]
const moreNames = [
`${lowerCase}.sh`,
`${lowerCase}.tools`,
@@ -44,7 +42,7 @@ const DomainCard: React.FC<{query: string}> = ({query}) => {
`${lowerCase}.info`,
`${lowerCase}.biz`,
`${lowerCase}.website`,
];
]
return (
<Card title={t('providers.domains')}>
@@ -60,7 +58,7 @@ const DomainCard: React.FC<{query: string}> = ({query}) => {
)}
</Repeater>
</Card>
);
};
)
}
export default DomainCard;
export default DomainCard

26
src/components/cards/providers/Firebase.tsx
View File

@@ -1,18 +1,16 @@
import React from 'react';
import {useTranslation} from 'react-i18next';
import {DiFirebase} from 'react-icons/di';
import React from 'react'
import { useTranslation } from 'react-i18next'
import { DiFirebase } from 'react-icons/di'
import {Card, Repeater, DedicatedAvailability} from '../core';
import { Card, Repeater, DedicatedAvailability } from '../core'
const FirebaseCard: React.FC<{query: string}> = ({query}) => {
const {t} = useTranslation();
const FirebaseCard: React.FC<{ query: string }> = ({ query }) => {
const { t } = useTranslation()
const sanitizedQuery = query
.replace(/[^0-9a-zA-Z_-]/g, '')
.replace(/_/g, '-');
const lowerCase = sanitizedQuery.toLowerCase();
const sanitizedQuery = query.replace(/[^0-9a-zA-Z_-]/g, '').replace(/_/g, '-')
const lowerCase = sanitizedQuery.toLowerCase()
const names = [lowerCase];
const names = [lowerCase]
return (
<Card title={t('providers.firebase')}>
@@ -29,7 +27,7 @@ const FirebaseCard: React.FC<{query: string}> = ({query}) => {
)}
</Repeater>
</Card>
);
};
)
}
export default FirebaseCard;
export default FirebaseCard

19
src/components/cards/providers/GitHubRepository.tsx
View File

@@ -1,12 +1,11 @@
import React from 'react';
import {useTranslation} from 'react-i18next';
import {FaGithub} from 'react-icons/fa';
import {Card, Repeater, DedicatedAvailability} from '../core';
import React from 'react'
import { useTranslation } from 'react-i18next'
import { FaGithub } from 'react-icons/fa'
import { Card, DedicatedAvailability, Repeater } from '../core'
const GithubCard: React.FC<{ query: string }> = ({ query }) => {
const {t} = useTranslation();
const lowerCase = query.toLowerCase();
const { t } = useTranslation()
const lowerCase = query.toLowerCase()
const names = [query, `${lowerCase}-dev`, `${lowerCase}-org`]
const moreNames = [
@@ -32,7 +31,7 @@ const GithubCard: React.FC<{ query: string }> = ({ query }) => {
)}
</Repeater>
</Card>
);
};
)
}
export default GithubCard;
export default GithubCard

50
src/components/cards/providers/GitHubSearch.tsx
View File

@@ -1,26 +1,26 @@
import React from 'react';
import useFetch from 'fetch-suspense';
import {useTranslation} from 'react-i18next';
import {FaGithub, FaInfoCircle} from 'react-icons/fa';
import React from 'react'
import useFetch from 'fetch-suspense'
import { useTranslation } from 'react-i18next'
import { FaGithub, FaInfoCircle } from 'react-icons/fa'
import {Card, Result} from '../core';
import { Card, Result } from '../core'
const Search: React.FC<{query: string}> = ({query}) => {
const {t} = useTranslation();
const searchQuery = encodeURIComponent(`${query} in:name`);
const limit = 10;
const Search: React.FC<{ query: string }> = ({ query }) => {
const { t } = useTranslation()
const searchQuery = encodeURIComponent(`${query} in:name`)
const limit = 10
const response = useFetch(
`https://api.github.com/search/repositories?q=${searchQuery}&per_page=${limit}`,
`https://api.github.com/search/repositories?q=${searchQuery}&per_page=${limit}`
) as {
items: Array<{
full_name: string;
description: string;
stargazers_count: number;
html_url: string;
id: string;
}>;
};
const repos = response.items || [];
full_name: string
description: string
stargazers_count: number
html_url: string
id: string
}>
}
const repos = response.items || []
return (
<>
@@ -40,17 +40,17 @@ const Search: React.FC<{query: string}> = ({query}) => {
<Result title={t('noResult')} icon={<FaInfoCircle />} />
)}
</>
);
};
)
}
const GithubSearchCard: React.FC<{query: string}> = ({query}) => {
const {t} = useTranslation();
const GithubSearchCard: React.FC<{ query: string }> = ({ query }) => {
const { t } = useTranslation()
return (
<Card title={t('providers.githubSearch')}>
<Search query={query} />
</Card>
);
};
)
}
export default GithubSearchCard;
export default GithubSearchCard

22
src/components/cards/providers/GitLab.tsx
View File

@@ -1,14 +1,14 @@
import React from 'react';
import {useTranslation} from 'react-i18next';
import {FaGitlab} from 'react-icons/fa';
import React from 'react'
import { useTranslation } from 'react-i18next'
import { FaGitlab } from 'react-icons/fa'
import {Card, Repeater, DedicatedAvailability} from '../core';
import { Card, Repeater, DedicatedAvailability } from '../core'
const GitLabCard: React.FC<{query: string}> = ({query}) => {
const {t} = useTranslation();
const lowerCase = query.toLowerCase();
const GitLabCard: React.FC<{ query: string }> = ({ query }) => {
const { t } = useTranslation()
const lowerCase = query.toLowerCase()
const names = [lowerCase];
const names = [lowerCase]
return (
<Card title={t('providers.gitlab')}>
@@ -25,7 +25,7 @@ const GitLabCard: React.FC<{query: string}> = ({query}) => {
)}
</Repeater>
</Card>
);
};
)
}
export default GitLabCard;
export default GitLabCard

26
src/components/cards/providers/Heroku.tsx
View File

@@ -1,18 +1,16 @@
import React from 'react';
import {useTranslation} from 'react-i18next';
import {DiHeroku} from 'react-icons/di';
import React from 'react'
import { useTranslation } from 'react-i18next'
import { DiHeroku } from 'react-icons/di'
import {Card, Repeater, DedicatedAvailability} from '../core';
import { Card, Repeater, DedicatedAvailability } from '../core'
const HerokuCard: React.FC<{query: string}> = ({query}) => {
const {t} = useTranslation();
const HerokuCard: React.FC<{ query: string }> = ({ query }) => {
const { t } = useTranslation()
const sanitizedQuery = query
.replace(/[^0-9a-zA-Z_-]/g, '')
.replace(/_/g, '-');
const lowerCase = sanitizedQuery.toLowerCase();
const sanitizedQuery = query.replace(/[^0-9a-zA-Z_-]/g, '').replace(/_/g, '-')
const lowerCase = sanitizedQuery.toLowerCase()
const names = [lowerCase];
const names = [lowerCase]
return (
<Card title={t('providers.heroku')}>
@@ -28,7 +26,7 @@ const HerokuCard: React.FC<{query: string}> = ({query}) => {
)}
</Repeater>
</Card>
);
};
)
}
export default HerokuCard;
export default HerokuCard

22
src/components/cards/providers/Homebrew.tsx
View File

@@ -1,14 +1,14 @@
import React from 'react';
import {useTranslation} from 'react-i18next';
import {IoIosBeer} from 'react-icons/io';
import React from 'react'
import { useTranslation } from 'react-i18next'
import { IoIosBeer } from 'react-icons/io'
import {Card, Repeater, ExistentialAvailability} from '../core';
import { Card, Repeater, ExistentialAvailability } from '../core'
const HomebrewCard: React.FC<{query: string}> = ({query}) => {
const {t} = useTranslation();
const lowerCase = query.toLowerCase();
const HomebrewCard: React.FC<{ query: string }> = ({ query }) => {
const { t } = useTranslation()
const lowerCase = query.toLowerCase()
const names = [lowerCase];
const names = [lowerCase]
return (
<Card title={t('providers.homebrew')}>
@@ -34,7 +34,7 @@ const HomebrewCard: React.FC<{query: string}> = ({query}) => {
)}
</Repeater>
</Card>
);
};
)
}
export default HomebrewCard;
export default HomebrewCard

24
src/components/cards/providers/Instagram.tsx
View File

@@ -1,15 +1,15 @@
import React from 'react';
import {useTranslation} from 'react-i18next';
import {FaInstagram} from 'react-icons/fa';
import React from 'react'
import { useTranslation } from 'react-i18next'
import { FaInstagram } from 'react-icons/fa'
import {Card, Repeater, ExistentialAvailability} from '../core';
import { Card, Repeater, ExistentialAvailability } from '../core'
const InstagramCard: React.FC<{query: string}> = ({query}) => {
const {t} = useTranslation();
const lowerCase = query.toLowerCase();
const InstagramCard: React.FC<{ query: string }> = ({ query }) => {
const { t } = useTranslation()
const lowerCase = query.toLowerCase()
const names = [query];
const moreNames = [`${lowerCase}app`, `${lowerCase}_hq`, `get.${lowerCase}`];
const names = [query]
const moreNames = [`${lowerCase}app`, `${lowerCase}_hq`, `get.${lowerCase}`]
return (
<Card title={t('providers.instagram')}>
@@ -25,7 +25,7 @@ const InstagramCard: React.FC<{query: string}> = ({query}) => {
)}
</Repeater>
</Card>
);
};
)
}
export default InstagramCard;
export default InstagramCard

26
src/components/cards/providers/JsOrg.tsx
View File

@@ -1,18 +1,16 @@
import React from 'react';
import {useTranslation} from 'react-i18next';
import {FaJsSquare} from 'react-icons/fa';
import React from 'react'
import { useTranslation } from 'react-i18next'
import { FaJsSquare } from 'react-icons/fa'
import {Card, Repeater, DedicatedAvailability} from '../core';
import { Card, Repeater, DedicatedAvailability } from '../core'
const JsOrgCard: React.FC<{query: string}> = ({query}) => {
const {t} = useTranslation();
const JsOrgCard: React.FC<{ query: string }> = ({ query }) => {
const { t } = useTranslation()
const sanitizedQuery = query
.replace(/[^0-9a-zA-Z_-]/g, '')
.replace(/_/g, '-');
const lowerCase = sanitizedQuery.toLowerCase();
const sanitizedQuery = query.replace(/[^0-9a-zA-Z_-]/g, '').replace(/_/g, '-')
const lowerCase = sanitizedQuery.toLowerCase()
const names = [lowerCase];
const names = [lowerCase]
return (
<Card title={t('providers.jsorg')}>
@@ -30,7 +28,7 @@ const JsOrgCard: React.FC<{query: string}> = ({query}) => {
)}
</Repeater>
</Card>
);
};
)
}
export default JsOrgCard;
export default JsOrgCard

24
src/components/cards/providers/Linux.tsx
View File

@@ -1,15 +1,15 @@
import React from 'react';
import {useTranslation} from 'react-i18next';
import {DiUbuntu} from 'react-icons/di';
import {DiDebian} from 'react-icons/di';
import React from 'react'
import { useTranslation } from 'react-i18next'
import { DiUbuntu } from 'react-icons/di'
import { DiDebian } from 'react-icons/di'
import {Card, Repeater, DedicatedAvailability} from '../core';
import { Card, Repeater, DedicatedAvailability } from '../core'
const LinuxCard: React.FC<{query: string}> = ({query}) => {
const {t} = useTranslation();
const lowerCase = query.toLowerCase();
const LinuxCard: React.FC<{ query: string }> = ({ query }) => {
const { t } = useTranslation()
const lowerCase = query.toLowerCase()
const names = [lowerCase];
const names = [lowerCase]
return (
<Card title={t('providers.linux')}>
@@ -34,7 +34,7 @@ const LinuxCard: React.FC<{query: string}> = ({query}) => {
)}
</Repeater>
</Card>
);
};
)
}
export default LinuxCard;
export default LinuxCard

26
src/components/cards/providers/Netlify.tsx
View File

@@ -1,18 +1,16 @@
import React from 'react';
import {useTranslation} from 'react-i18next';
import {NetlifyIcon} from '../../Icons';
import React from 'react'
import { useTranslation } from 'react-i18next'
import { NetlifyIcon } from '../../Icons'
import {Card, Repeater, DedicatedAvailability} from '../core';
import { Card, Repeater, DedicatedAvailability } from '../core'
const NetlifyCard: React.FC<{query: string}> = ({query}) => {
const {t} = useTranslation();
const NetlifyCard: React.FC<{ query: string }> = ({ query }) => {
const { t } = useTranslation()
const sanitizedQuery = query
.replace(/[^0-9a-zA-Z_-]/g, '')
.replace(/_/g, '-');
const lowerCase = sanitizedQuery.toLowerCase();
const sanitizedQuery = query.replace(/[^0-9a-zA-Z_-]/g, '').replace(/_/g, '-')
const lowerCase = sanitizedQuery.toLowerCase()
const names = [lowerCase];
const names = [lowerCase]
return (
<Card title={t('providers.netlify')}>
@@ -28,7 +26,7 @@ const NetlifyCard: React.FC<{query: string}> = ({query}) => {
)}
</Repeater>
</Card>
);
};
)
}
export default NetlifyCard;
export default NetlifyCard

24
src/components/cards/providers/Npm.tsx
View File

@@ -1,15 +1,15 @@
import React from 'react';
import {useTranslation} from 'react-i18next';
import {FaNpm} from 'react-icons/fa';
import React from 'react'
import { useTranslation } from 'react-i18next'
import { FaNpm } from 'react-icons/fa'
import {Card, Repeater, DedicatedAvailability} from '../core';
import { Card, Repeater, DedicatedAvailability } from '../core'
const NpmCard: React.FC<{query: string}> = ({query}) => {
const {t} = useTranslation();
const lowerCase = query.toLowerCase();
const NpmCard: React.FC<{ query: string }> = ({ query }) => {
const { t } = useTranslation()
const lowerCase = query.toLowerCase()
const names = [lowerCase, `${lowerCase}-js`];
const moreNames = [`${lowerCase}js`];
const names = [lowerCase, `${lowerCase}-js`]
const moreNames = [`${lowerCase}js`]
return (
<Card title={t('providers.npm')}>
@@ -40,7 +40,7 @@ const NpmCard: React.FC<{query: string}> = ({query}) => {
)}
</Repeater>
</Card>
);
};
)
}
export default NpmCard;
export default NpmCard

36
src/components/cards/providers/Nta.tsx
View File

@@ -1,18 +1,18 @@
import React from 'react';
import useFetch from 'fetch-suspense';
import {useTranslation} from 'react-i18next';
import {FaBuilding, FaInfoCircle} from 'react-icons/fa';
import React from 'react'
import useFetch from 'fetch-suspense'
import { useTranslation } from 'react-i18next'
import { FaBuilding, FaInfoCircle } from 'react-icons/fa'
import {Card, Result} from '../core';
import { Card, Result } from '../core'
const Search: React.FC<{query: string}> = ({query}) => {
const {t} = useTranslation();
const term = encodeURIComponent(query);
const Search: React.FC<{ query: string }> = ({ query }) => {
const { t } = useTranslation()
const term = encodeURIComponent(query)
const response = useFetch(`/api/services/nta/${term}`) as {
result: Array<{name: string; phoneticName: string}>;
};
result: Array<{ name: string; phoneticName: string }>
}
const apps = response.result;
const apps = response.result
return (
<>
@@ -29,17 +29,17 @@ const Search: React.FC<{query: string}> = ({query}) => {
<Result title={t('noResult')} icon={<FaInfoCircle />} />
)}
</>
);
};
)
}
const NtaCard: React.FC<{query: string}> = ({query}) => {
const {t} = useTranslation();
const NtaCard: React.FC<{ query: string }> = ({ query }) => {
const { t } = useTranslation()
return (
<Card title={t('providers.nta')}>
<Search query={query} />
</Card>
);
};
)
}
export default NtaCard;
export default NtaCard

22
src/components/cards/providers/Ocaml.tsx
View File

@@ -1,14 +1,14 @@
import React from 'react';
import {useTranslation} from 'react-i18next';
import {OcamlIcon} from '../../Icons';
import React from 'react'
import { useTranslation } from 'react-i18next'
import { OcamlIcon } from '../../Icons'
import {Card, Repeater, DedicatedAvailability} from '../core';
import { Card, Repeater, DedicatedAvailability } from '../core'
const OcamlCard: React.FC<{query: string}> = ({query}) => {
const {t} = useTranslation();
const lowerCase = query.toLowerCase();
const OcamlCard: React.FC<{ query: string }> = ({ query }) => {
const { t } = useTranslation()
const lowerCase = query.toLowerCase()
const names = [lowerCase];
const names = [lowerCase]
return (
<Card title={t('providers.ocaml')}>
@@ -25,7 +25,7 @@ const OcamlCard: React.FC<{query: string}> = ({query}) => {
)}
</Repeater>
</Card>
);
};
)
}
export default OcamlCard;
export default OcamlCard

24
src/components/cards/providers/PyPI.tsx
View File

@@ -1,15 +1,15 @@
import React from 'react';
import {useTranslation} from 'react-i18next';
import {FaPython} from 'react-icons/fa';
import React from 'react'
import { useTranslation } from 'react-i18next'
import { FaPython } from 'react-icons/fa'
import {capitalize} from '../../../util/text';
import {Card, DedicatedAvailability, Repeater} from '../core';
import { capitalize } from '../../../util/text'
import { Card, DedicatedAvailability, Repeater } from '../core'
const PypiCard: React.FC<{query: string}> = ({query}) => {
const {t} = useTranslation();
const PypiCard: React.FC<{ query: string }> = ({ query }) => {
const { t } = useTranslation()
const names = [query];
const moreNames = [`Py${capitalize(query)}`];
const names = [query]
const moreNames = [`Py${capitalize(query)}`]
return (
<Card title={t('providers.pypi')}>
@@ -28,7 +28,7 @@ const PypiCard: React.FC<{query: string}> = ({query}) => {
)}
</Repeater>
</Card>
);
};
)
}
export default PypiCard;
export default PypiCard

22
src/components/cards/providers/RubyGems.tsx
View File

@@ -1,14 +1,14 @@
import React from 'react';
import {useTranslation} from 'react-i18next';
import {FaGem} from 'react-icons/fa';
import React from 'react'
import { useTranslation } from 'react-i18next'
import { FaGem } from 'react-icons/fa'
import {Card, Repeater, DedicatedAvailability} from '../core';
import { Card, Repeater, DedicatedAvailability } from '../core'
const RubyGemsCard: React.FC<{query: string}> = ({query}) => {
const {t} = useTranslation();
const RubyGemsCard: React.FC<{ query: string }> = ({ query }) => {
const { t } = useTranslation()
const names = [query];
const moreNames = [`${query.toLowerCase()}-rb`];
const names = [query]
const moreNames = [`${query.toLowerCase()}-rb`]
return (
<Card title={t('providers.rubygems')}>
@@ -25,7 +25,7 @@ const RubyGemsCard: React.FC<{query: string}> = ({query}) => {
)}
</Repeater>
</Card>
);
};
)
}
export default RubyGemsCard;
export default RubyGemsCard

26
src/components/cards/providers/S3.tsx
View File

@@ -1,18 +1,16 @@
import React from 'react';
import {useTranslation} from 'react-i18next';
import {FaAws} from 'react-icons/fa';
import React from 'react'
import { useTranslation } from 'react-i18next'
import { FaAws } from 'react-icons/fa'
import {Card, DedicatedAvailability, Repeater} from '../core';
import { Card, DedicatedAvailability, Repeater } from '../core'
const S3Card: React.FC<{query: string}> = ({query}) => {
const {t} = useTranslation();
const S3Card: React.FC<{ query: string }> = ({ query }) => {
const { t } = useTranslation()
const sanitizedQuery = query
.replace(/[^0-9a-zA-Z_-]/g, '')
.replace(/_/g, '-');
const lowerCase = sanitizedQuery.toLowerCase();
const sanitizedQuery = query.replace(/[^0-9a-zA-Z_-]/g, '').replace(/_/g, '-')
const lowerCase = sanitizedQuery.toLowerCase()
const names = [lowerCase];
const names = [lowerCase]
return (
<Card title={t('providers.s3')}>
@@ -30,7 +28,7 @@ const S3Card: React.FC<{query: string}> = ({query}) => {
)}
</Repeater>
</Card>
);
};
)
}
export default S3Card;
export default S3Card

26
src/components/cards/providers/Slack.tsx
View File

@@ -1,18 +1,16 @@
import React from 'react';
import {useTranslation} from 'react-i18next';
import {FaSlack} from 'react-icons/fa';
import React from 'react'
import { useTranslation } from 'react-i18next'
import { FaSlack } from 'react-icons/fa'
import {Card, DedicatedAvailability, Repeater} from '../core';
import { Card, DedicatedAvailability, Repeater } from '../core'
const SlackCard: React.FC<{query: string}> = ({query}) => {
const {t} = useTranslation();
const SlackCard: React.FC<{ query: string }> = ({ query }) => {
const { t } = useTranslation()
const sanitizedQuery = query
.replace(/[^0-9a-zA-Z_-]/g, '')
.replace(/_/g, '-');
const lowerCase = sanitizedQuery.toLowerCase();
const sanitizedQuery = query.replace(/[^0-9a-zA-Z_-]/g, '').replace(/_/g, '-')
const lowerCase = sanitizedQuery.toLowerCase()
const names = [lowerCase];
const names = [lowerCase]
return (
<Card title={t('providers.slack')}>
@@ -31,7 +29,7 @@ const SlackCard: React.FC<{query: string}> = ({query}) => {
)}
</Repeater>
</Card>
);
};
)
}
export default SlackCard;
export default SlackCard

20
src/components/cards/providers/Spectrum.tsx
View File

@@ -1,11 +1,11 @@
import React from 'react';
import {useTranslation} from 'react-i18next';
import {Card, Repeater, DedicatedAvailability} from '../core';
import {SpectrumIcon} from '../../Icons';
import React from 'react'
import { useTranslation } from 'react-i18next'
import { Card, Repeater, DedicatedAvailability } from '../core'
import { SpectrumIcon } from '../../Icons'
const SpectrumCard: React.FC<{query: string}> = ({query}) => {
const {t} = useTranslation();
const names = [query];
const SpectrumCard: React.FC<{ query: string }> = ({ query }) => {
const { t } = useTranslation()
const names = [query]
return (
<Card title={t('providers.spectrum')}>
@@ -25,7 +25,7 @@ const SpectrumCard: React.FC<{query: string}> = ({query}) => {
)}
</Repeater>
</Card>
);
};
)
}
export default SpectrumCard;
export default SpectrumCard

32
src/components/cards/providers/Twitter.tsx
View File

@@ -1,20 +1,18 @@
import React from 'react';
import {useTranslation} from 'react-i18next';
import {FaTwitter} from 'react-icons/fa';
import React from 'react'
import { useTranslation } from 'react-i18next'
import { FaTwitter } from 'react-icons/fa'
import {capitalize} from '../../../util/text';
import {Card, Repeater, DedicatedAvailability} from '../core';
import { capitalize } from '../../../util/text'
import { Card, Repeater, DedicatedAvailability } from '../core'
const TwitterCard: React.FC<{query: string}> = ({query}) => {
const {t} = useTranslation();
const TwitterCard: React.FC<{ query: string }> = ({ query }) => {
const { t } = useTranslation()
const sanitizedQuery = query
.replace(/[^0-9a-zA-Z_-]/g, '')
.replace(/-/g, '_');
const lowerCase = sanitizedQuery.toLowerCase();
const capitalCase = capitalize(sanitizedQuery);
const sanitizedQuery = query.replace(/[^0-9a-zA-Z_-]/g, '').replace(/-/g, '_')
const lowerCase = sanitizedQuery.toLowerCase()
const capitalCase = capitalize(sanitizedQuery)
const names = [sanitizedQuery, `${capitalCase}App`, `${lowerCase}hq`];
const names = [sanitizedQuery, `${capitalCase}App`, `${lowerCase}hq`]
const moreNames = [
`hey${lowerCase}`,
`${capitalCase}Team`,
@@ -22,7 +20,7 @@ const TwitterCard: React.FC<{query: string}> = ({query}) => {
`${lowerCase}_org`,
`${lowerCase}_app`,
`${capitalCase}JS`,
];
]
return (
<Card title={t('providers.twitter')}>
@@ -39,7 +37,7 @@ const TwitterCard: React.FC<{query: string}> = ({query}) => {
)}
</Repeater>
</Card>
);
};
)
}
export default TwitterCard;
export default TwitterCard

26
src/components/cards/providers/Vercel.tsx
View File

@@ -1,18 +1,16 @@
import React from 'react';
import {useTranslation} from 'react-i18next';
import {NowIcon} from '../../Icons';
import React from 'react'
import { useTranslation } from 'react-i18next'
import { NowIcon } from '../../Icons'
import {Card, Repeater, DedicatedAvailability} from '../core';
import { Card, Repeater, DedicatedAvailability } from '../core'
const VercelCard: React.FC<{query: string}> = ({query}) => {
const {t} = useTranslation();
const VercelCard: React.FC<{ query: string }> = ({ query }) => {
const { t } = useTranslation()
const sanitizedQuery = query
.replace(/[^0-9a-zA-Z_-]/g, '')
.replace(/_/g, '-');
const lowerCase = sanitizedQuery.toLowerCase();
const sanitizedQuery = query.replace(/[^0-9a-zA-Z_-]/g, '').replace(/_/g, '-')
const lowerCase = sanitizedQuery.toLowerCase()
const names = [lowerCase];
const names = [lowerCase]
return (
<Card title={t('providers.now')}>
@@ -39,7 +37,7 @@ const VercelCard: React.FC<{query: string}> = ({query}) => {
)}
</Repeater>
</Card>
);
};
)
}
export default VercelCard;
export default VercelCard