mirror of
https://github.com/uetchy/namae.git
synced 2025-03-16 20:20:38 +09:00
feat: add YouTube card
This commit is contained in:
parent
5ca31d2f18
commit
517ef36409
@ -45,7 +45,8 @@
|
|||||||
"twitter": "Twitter",
|
"twitter": "Twitter",
|
||||||
"cloudflare": "Cloudflare Pages",
|
"cloudflare": "Cloudflare Pages",
|
||||||
"chromeWebStore": "Chrome Web Store",
|
"chromeWebStore": "Chrome Web Store",
|
||||||
"firefoxAddons": "Firefox Add-ons"
|
"firefoxAddons": "Firefox Add-ons",
|
||||||
|
"youtube": "YouTube"
|
||||||
},
|
},
|
||||||
"showMore": "show more",
|
"showMore": "show more",
|
||||||
"title": "Grab a slick name for your new app",
|
"title": "Grab a slick name for your new app",
|
||||||
|
@ -14,6 +14,7 @@ import {
|
|||||||
FaTwitter,
|
FaTwitter,
|
||||||
FaCloudflare,
|
FaCloudflare,
|
||||||
FaFirefoxBrowser,
|
FaFirefoxBrowser,
|
||||||
|
FaYoutube,
|
||||||
} from 'react-icons/fa';
|
} from 'react-icons/fa';
|
||||||
import { IoIosBeer, IoMdAppstore } from 'react-icons/io';
|
import { IoIosBeer, IoMdAppstore } from 'react-icons/io';
|
||||||
import { MdDomain } from 'react-icons/md';
|
import { MdDomain } from 'react-icons/md';
|
||||||
@ -38,6 +39,7 @@ const supportedProviders: Record<string, React.ReactNode> = {
|
|||||||
github: <FaGithub />,
|
github: <FaGithub />,
|
||||||
gitlab: <FaGitlab />,
|
gitlab: <FaGitlab />,
|
||||||
twitter: <FaTwitter />,
|
twitter: <FaTwitter />,
|
||||||
|
youtube: <FaYoutube />,
|
||||||
homebrew: <IoIosBeer />,
|
homebrew: <IoIosBeer />,
|
||||||
npm: <RiNpmjsFill />,
|
npm: <RiNpmjsFill />,
|
||||||
rust: <SiRust />,
|
rust: <SiRust />,
|
||||||
|
@ -30,6 +30,7 @@ import SlackCard from './providers/Slack';
|
|||||||
import SubredditCard from './providers/Subreddit';
|
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';
|
||||||
|
|
||||||
const Index: React.FC<{ query: string }> = ({ query }) => {
|
const Index: React.FC<{ query: string }> = ({ query }) => {
|
||||||
const {
|
const {
|
||||||
@ -42,6 +43,7 @@ const Index: React.FC<{ query: string }> = ({ query }) => {
|
|||||||
<DomainCard query={query} />
|
<DomainCard query={query} />
|
||||||
<GithubCard query={query} />
|
<GithubCard query={query} />
|
||||||
<TwitterCard query={query} />
|
<TwitterCard query={query} />
|
||||||
|
<YouTubeCard query={query} />
|
||||||
<NpmCard query={query} />
|
<NpmCard query={query} />
|
||||||
<HomebrewCard query={query} />
|
<HomebrewCard query={query} />
|
||||||
<GitLabCard query={query} />
|
<GitLabCard query={query} />
|
||||||
|
37
src/components/cards/providers/YouTube.tsx
Normal file
37
src/components/cards/providers/YouTube.tsx
Normal file
@ -0,0 +1,37 @@
|
|||||||
|
import React from 'react';
|
||||||
|
import { useTranslation } from 'react-i18next';
|
||||||
|
import { FaYoutube } from 'react-icons/fa';
|
||||||
|
import { normalize } from '../../../util/text';
|
||||||
|
|
||||||
|
import { Card, Repeater, DedicatedAvailability } from '../core';
|
||||||
|
|
||||||
|
const YouTubeCard: React.FC<{ query: string }> = ({ query }) => {
|
||||||
|
const { t } = useTranslation();
|
||||||
|
const normalizedQuery = normalize(query, {
|
||||||
|
alphanumeric: false,
|
||||||
|
allowUnderscore: false,
|
||||||
|
allowHyphens: false,
|
||||||
|
});
|
||||||
|
const lowerCase = normalizedQuery.toLowerCase();
|
||||||
|
|
||||||
|
const names = [normalizedQuery];
|
||||||
|
const moreNames = [`${lowerCase}app`, `${lowerCase}team`, `${lowerCase}hq`];
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Card title={t('providers.youtube')}>
|
||||||
|
<Repeater items={names} moreItems={moreNames}>
|
||||||
|
{(name) => (
|
||||||
|
<DedicatedAvailability
|
||||||
|
name={`youtube.com/c/${name}`}
|
||||||
|
service="existence"
|
||||||
|
message={`Go to youtube.com/c/${name}`}
|
||||||
|
link={`https://www.youtube.com/c/${name}`}
|
||||||
|
icon={<FaYoutube />}
|
||||||
|
/>
|
||||||
|
)}
|
||||||
|
</Repeater>
|
||||||
|
</Card>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default YouTubeCard;
|
Loading…
x
Reference in New Issue
Block a user