From 5d17a86779f15275b82d13adc0939cd027ad121f Mon Sep 17 00:00:00 2001 From: Yasuaki Uechi Date: Tue, 6 Aug 2019 02:07:05 +0900 Subject: [PATCH] chore: cosmetic changes --- web/src/App.js | 28 ++++++++++---------- web/src/components/Footer.js | 2 +- web/src/components/Suggestion.js | 1 + web/src/components/cards/AppStoreCard.js | 4 +-- web/src/components/cards/CratesioCard.js | 4 +-- web/src/components/cards/DomainCard.js | 9 ++++--- web/src/components/cards/GithubCard.js | 6 ++--- web/src/components/cards/GithubSearchCard.js | 4 +-- web/src/components/cards/HomebrewCard.js | 4 +-- web/src/components/cards/JsOrgCard.js | 4 +-- web/src/components/cards/LinuxCard.js | 4 +-- web/src/components/cards/NpmCard.js | 4 +-- web/src/components/cards/PypiCard.js | 6 ++--- web/src/components/cards/RubyGemsCard.js | 6 ++--- web/src/components/cards/S3Card.js | 4 +-- web/src/components/cards/SlackCard.js | 4 +-- web/src/components/cards/TwitterCard.js | 18 +++++++------ web/src/hooks/state.js | 2 +- 18 files changed, 59 insertions(+), 55 deletions(-) diff --git a/web/src/App.js b/web/src/App.js index e2500a1..86830e4 100644 --- a/web/src/App.js +++ b/web/src/App.js @@ -28,10 +28,10 @@ import { mobile } from './util/css' import { isStandalone } from './util/pwa' export default function App() { - const [query, setQuery] = useDeferredState('', 1000) + const [query, setQuery] = useDeferredState(1000, '') const [inputValue, setInputValue] = useState('') - const inputRef = useRef() const [suggested, setSuggested] = useState(false) + const inputRef = useRef() const { t } = useTranslation() const queryGiven = query && query.length > 0 @@ -92,20 +92,20 @@ export default function App() { {queryGiven ? ( - - - - - - - - + + + + + + + + + + + + - - - - diff --git a/web/src/components/Footer.js b/web/src/components/Footer.js index 948cf40..c2218aa 100644 --- a/web/src/components/Footer.js +++ b/web/src/components/Footer.js @@ -1,7 +1,7 @@ import React from 'react' import styled from 'styled-components' -import { FaTwitter, FaGithubAlt } from 'react-icons/fa' import { useTranslation } from 'react-i18next' +import { FaTwitter, FaGithubAlt } from 'react-icons/fa' import { ExternalLink } from './Links' diff --git a/web/src/components/Suggestion.js b/web/src/components/Suggestion.js index db74b6b..890cd97 100644 --- a/web/src/components/Suggestion.js +++ b/web/src/components/Suggestion.js @@ -2,6 +2,7 @@ import React, { useEffect, useState } from 'react' import styled from 'styled-components' import { useTranslation } from 'react-i18next' import fetch from 'isomorphic-unfetch' + import { capitalize } from '../util/text' const modifiers = [ diff --git a/web/src/components/cards/AppStoreCard.js b/web/src/components/cards/AppStoreCard.js index bcb3a92..35956f0 100644 --- a/web/src/components/cards/AppStoreCard.js +++ b/web/src/components/cards/AppStoreCard.js @@ -11,7 +11,7 @@ function Search({ query }) { const apps = response.result return ( -
+ <> {apps.map((app) => ( ))} -
+ ) } diff --git a/web/src/components/cards/CratesioCard.js b/web/src/components/cards/CratesioCard.js index 33a5b74..01e5382 100644 --- a/web/src/components/cards/CratesioCard.js +++ b/web/src/components/cards/CratesioCard.js @@ -4,9 +4,9 @@ import { DiRust } from 'react-icons/di' import { Card, Repeater, DedicatedAvailability } from '../Cards' -export default function CratesioCard({ name }) { +export default function CratesioCard({ query }) { const { t } = useTranslation() - const lowerCase = name.toLowerCase() + const lowerCase = query.toLowerCase() const names = [lowerCase] diff --git a/web/src/components/cards/DomainCard.js b/web/src/components/cards/DomainCard.js index 48819a1..b1a23bb 100644 --- a/web/src/components/cards/DomainCard.js +++ b/web/src/components/cards/DomainCard.js @@ -4,16 +4,17 @@ import { FaMapSigns } from 'react-icons/fa' import { Card, Repeater, DedicatedAvailability } from '../Cards' -export default function DomainCard({ name }) { +export default function DomainCard({ query }) { const { t } = useTranslation() - const lowerCase = name.toLowerCase() + const lowerCase = query.toLowerCase() - const names = [`${lowerCase}.com`, `${lowerCase}app.com`, `${lowerCase}.app`] + const names = [`${lowerCase}.com`, `${lowerCase}.app`] const moreNames = [ + `${lowerCase}app.com`, + `get${lowerCase}.com`, `${lowerCase}.dev`, `${lowerCase}.io`, `${lowerCase}.tools`, - `get${lowerCase}.com`, ] return ( diff --git a/web/src/components/cards/GithubCard.js b/web/src/components/cards/GithubCard.js index 61e5b80..0304aac 100644 --- a/web/src/components/cards/GithubCard.js +++ b/web/src/components/cards/GithubCard.js @@ -4,11 +4,11 @@ import { FaGithub } from 'react-icons/fa' import { Card, Repeater, DedicatedAvailability } from '../Cards' -export default function GithubCard({ name }) { +export default function GithubCard({ query }) { const { t } = useTranslation() - const lowerCase = name.toLowerCase() + const lowerCase = query.toLowerCase() - const names = [name] + const names = [query] const moreNames = [ `${lowerCase}hq`, `${lowerCase}-team`, diff --git a/web/src/components/cards/GithubSearchCard.js b/web/src/components/cards/GithubSearchCard.js index b13222a..f606bd7 100644 --- a/web/src/components/cards/GithubSearchCard.js +++ b/web/src/components/cards/GithubSearchCard.js @@ -13,7 +13,7 @@ function Search({ query }) { const repos = response.items return ( -
+ <> {repos.map((repo) => ( ))} -
+ ) } diff --git a/web/src/components/cards/HomebrewCard.js b/web/src/components/cards/HomebrewCard.js index f280899..6f6a05a 100644 --- a/web/src/components/cards/HomebrewCard.js +++ b/web/src/components/cards/HomebrewCard.js @@ -4,9 +4,9 @@ import { IoIosBeer } from 'react-icons/io' import { Card, Repeater, ExistentialAvailability } from '../Cards' -export default function HomebrewCard({ name }) { +export default function HomebrewCard({ query }) { const { t } = useTranslation() - const lowerCase = name.toLowerCase() + const lowerCase = query.toLowerCase() const names = [lowerCase] diff --git a/web/src/components/cards/JsOrgCard.js b/web/src/components/cards/JsOrgCard.js index f9481a5..39de180 100644 --- a/web/src/components/cards/JsOrgCard.js +++ b/web/src/components/cards/JsOrgCard.js @@ -4,9 +4,9 @@ import { FaJsSquare } from 'react-icons/fa' import { Card, Repeater, DedicatedAvailability } from '../Cards' -export default function JsOrgCard({ name }) { +export default function JsOrgCard({ query }) { const { t } = useTranslation() - const lowerCase = name.toLowerCase() + const lowerCase = query.toLowerCase() const names = [lowerCase] diff --git a/web/src/components/cards/LinuxCard.js b/web/src/components/cards/LinuxCard.js index bac6db3..dd61c3d 100644 --- a/web/src/components/cards/LinuxCard.js +++ b/web/src/components/cards/LinuxCard.js @@ -5,9 +5,9 @@ import { DiDebian } from 'react-icons/di' import { Card, Repeater, DedicatedAvailability } from '../Cards' -export default function LinuxCard({ name }) { +export default function LinuxCard({ query }) { const { t } = useTranslation() - const lowerCase = name.toLowerCase() + const lowerCase = query.toLowerCase() const names = [lowerCase] diff --git a/web/src/components/cards/NpmCard.js b/web/src/components/cards/NpmCard.js index 5224cc6..79777b0 100644 --- a/web/src/components/cards/NpmCard.js +++ b/web/src/components/cards/NpmCard.js @@ -4,9 +4,9 @@ import { FaNpm } from 'react-icons/fa' import { Card, Repeater, DedicatedAvailability } from '../Cards' -export default function NpmCard({ name }) { +export default function NpmCard({ query }) { const { t } = useTranslation() - const lowerCase = name.toLowerCase() + const lowerCase = query.toLowerCase() const names = [lowerCase] const moreNames = [`${lowerCase}-js`] diff --git a/web/src/components/cards/PypiCard.js b/web/src/components/cards/PypiCard.js index 4d543ac..80f14f7 100644 --- a/web/src/components/cards/PypiCard.js +++ b/web/src/components/cards/PypiCard.js @@ -5,11 +5,11 @@ import { FaPython } from 'react-icons/fa' import { capitalize } from '../../util/text' import { Card, DedicatedAvailability, Repeater } from '../Cards' -export default function PypiCard({ name }) { +export default function PypiCard({ query }) { const { t } = useTranslation() - const names = [name] - const moreNames = [`Py${capitalize(name)}`] + const names = [query] + const moreNames = [`Py${capitalize(query)}`] return ( diff --git a/web/src/components/cards/RubyGemsCard.js b/web/src/components/cards/RubyGemsCard.js index 566b221..36c5284 100644 --- a/web/src/components/cards/RubyGemsCard.js +++ b/web/src/components/cards/RubyGemsCard.js @@ -4,11 +4,11 @@ import { FaGem } from 'react-icons/fa' import { Card, Repeater, DedicatedAvailability } from '../Cards' -export default function RubyGemsCard({ name }) { +export default function RubyGemsCard({ query }) { const { t } = useTranslation() - const names = [name] - const moreNames = [`${name.toLowerCase()}-rb`] + const names = [query] + const moreNames = [`${query.toLowerCase()}-rb`] return ( diff --git a/web/src/components/cards/S3Card.js b/web/src/components/cards/S3Card.js index 6c32573..d5b9ebf 100644 --- a/web/src/components/cards/S3Card.js +++ b/web/src/components/cards/S3Card.js @@ -4,9 +4,9 @@ import { FaAws } from 'react-icons/fa' import { Card, DedicatedAvailability, Repeater } from '../Cards' -export default function S3Card({ name }) { +export default function S3Card({ query }) { const { t } = useTranslation() - const lowerCase = name.toLowerCase() + const lowerCase = query.toLowerCase() const names = [lowerCase] diff --git a/web/src/components/cards/SlackCard.js b/web/src/components/cards/SlackCard.js index 03d28e9..fe6534f 100644 --- a/web/src/components/cards/SlackCard.js +++ b/web/src/components/cards/SlackCard.js @@ -4,9 +4,9 @@ import { FaSlack } from 'react-icons/fa' import { Card, DedicatedAvailability, Repeater } from '../Cards' -export default function SlackCard({ name }) { +export default function SlackCard({ query }) { const { t } = useTranslation() - const lowerCase = name.toLowerCase() + const lowerCase = query.toLowerCase() const names = [lowerCase] diff --git a/web/src/components/cards/TwitterCard.js b/web/src/components/cards/TwitterCard.js index 1d32af7..54f3968 100644 --- a/web/src/components/cards/TwitterCard.js +++ b/web/src/components/cards/TwitterCard.js @@ -5,17 +5,19 @@ import { FaTwitter } from 'react-icons/fa' import { capitalize } from '../../util/text' import { Card, Repeater, DedicatedAvailability } from '../Cards' -export default function TwitterCard({ name }) { +export default function TwitterCard({ query }) { const { t } = useTranslation() + const lowerCase = query.toLowerCase() + const capitalCase = capitalize(query) - const names = [name] + const names = [query] const moreNames = [ - `${name.toLowerCase()}app`, - `hey${name.toLowerCase()}`, - `${capitalize(name)}Team`, - `${capitalize(name)}HQ`, - `${name.toLowerCase()}_official`, - `${name.toLowerCase()}-support`, + `${lowerCase}app`, + `hey${lowerCase}`, + `${capitalCase}Team`, + `${capitalCase}HQ`, + `${lowerCase}_official`, + `${lowerCase}-support`, ] return ( diff --git a/web/src/hooks/state.js b/web/src/hooks/state.js index 8f247bf..a0876a3 100644 --- a/web/src/hooks/state.js +++ b/web/src/hooks/state.js @@ -1,6 +1,6 @@ import { useState, useEffect } from 'react' -export function useDeferredState(initialValue = undefined, duration = 1000) { +export function useDeferredState(duration = 1000, initialValue = undefined) { const [response, setResponse] = useState(initialValue) const [innerValue, setInnerValue] = useState(initialValue)