From ea61ecc9dcbda92241d8b8e8b4c3a2d12a07f08f Mon Sep 17 00:00:00 2001
From: Yasuaki Uechi <y@uechi.io>
Date: Fri, 6 Mar 2020 23:46:19 +0900
Subject: [PATCH] fix: add getting started button

---
 now.json                               |  1 -
 web/public/locales/en/translation.json |  3 +-
 web/public/locales/ja/translation.json |  7 +++--
 web/src/components/Form.tsx            |  4 +--
 web/src/components/Welcome.tsx         | 40 +++++++-------------------
 web/src/util/i18n.ts                   |  4 ++-
 6 files changed, 20 insertions(+), 39 deletions(-)

diff --git a/now.json b/now.json
index 098347c..b80ab1e 100644
--- a/now.json
+++ b/now.json
@@ -1,6 +1,5 @@
 {
   "version": 2,
-  "name": "namae",
   "alias": "namae.dev",
   "builds": [
     {
diff --git a/web/public/locales/en/translation.json b/web/public/locales/en/translation.json
index faea854..599ce6f 100644
--- a/web/public/locales/en/translation.json
+++ b/web/public/locales/en/translation.json
@@ -30,5 +30,6 @@
   "try": "How about this?",
   "showMore": "show more",
   "noResult": "No Result",
-  "exampleQueries": "Try these queries"
+  "gettingStarted": "Getting Started",
+  "pressEnterToSearch": "Press Enter to search"
 }
diff --git a/web/public/locales/ja/translation.json b/web/public/locales/ja/translation.json
index c33cefd..5c63b93 100644
--- a/web/public/locales/ja/translation.json
+++ b/web/public/locales/ja/translation.json
@@ -1,6 +1,6 @@
 {
-  "title": "その名前、もう使われてる？",
-  "description": "あなたの新しいアプリやライブラリにつける「名前」が被っていないか調べましょう。",
+  "title": "唯一無二の名前を見つけましょう",
+  "description": "namae は、あなたのアプリやライブラリにつける最適な名前を見つけるお手伝いをします。",
   "placeholder": "検索",
   "providers": {
     "domains": "ドメイン",
@@ -30,5 +30,6 @@
   "try": "これはどう？",
   "showMore": "もっと見る",
   "noResult": "該当なし",
-  "exampleQueries": "これらのワードでお試しください"
+  "gettingStarted": "試してみる",
+  "pressEnterToSearch": "エンターキーで検索"
 }
diff --git a/web/src/components/Form.tsx b/web/src/components/Form.tsx
index 52677cb..b472446 100644
--- a/web/src/components/Form.tsx
+++ b/web/src/components/Form.tsx
@@ -75,9 +75,7 @@ const Form: React.FC<{
         />
         {isFocused && (
           <Tips>
-            <span>
-              Press <kbd>Enter</kbd> to search
-            </span>
+            <span>{t('pressEnterToSearch')}</span>
           </Tips>
         )}
       </form>
diff --git a/web/src/components/Welcome.tsx b/web/src/components/Welcome.tsx
index 62b3864..4e5852c 100644
--- a/web/src/components/Welcome.tsx
+++ b/web/src/components/Welcome.tsx
@@ -22,46 +22,26 @@ import {IoIosBeer} from 'react-icons/io';
 import {DiRust, DiHeroku} from 'react-icons/di';
 
 import {SpectrumIcon, NowIcon, NetlifyIcon, OcamlIcon} from './Icons';
-import {shuffleArray} from '../util/array';
 import {mobile} from '../util/css';
 import {sendExampleQueryEvent} from '../util/analytics';
 
-const QUERY_WORDS = [
-  'Name',
-  'Colorful',
-  'Ghost',
-  'Animate',
-  'Graph',
-  'Compile',
-  'Crop',
-  'Test',
-  'Cat',
-  'Machine',
-  'Craft',
-];
-
 const Welcome: React.FC = () => {
   const {t} = useTranslation();
 
-  const queries = shuffleArray(QUERY_WORDS).slice(0, 5);
-
   return (
     <Container>
       <Hero>
         <HeroTitle>{t('title')}</HeroTitle>
         <HeroText>{t('description')}</HeroText>
         <ButtonContainer>
-          <h5>{t('exampleQueries')}</h5>
           <List>
-            {queries.map((query) => (
-              <ListButton key={query}>
-                <Link
-                  to={`/s/${query}`}
-                  onClick={() => sendExampleQueryEvent(query)}>
-                  {query}
-                </Link>
-              </ListButton>
-            ))}
+            <ListButton>
+              <Link
+                to="/s/namae"
+                onClick={() => sendExampleQueryEvent('namae')}>
+                {t('gettingStarted')}
+              </Link>
+            </ListButton>
           </List>
         </ButtonContainer>
       </Hero>
@@ -161,7 +141,7 @@ const HeroTitle = styled.h1`
 
 const HeroText = styled.p`
   font-size: 1.2em;
-  font-weight: 300;
+  font-weight: 400;
   line-height: 1.3em;
   color: #3c3c3c;
 `;
@@ -178,7 +158,7 @@ const Hero = styled.div`
 `;
 
 const ButtonContainer = styled.div`
-  margin: 30px 0 0 0;
+  margin: 10px 0 0 0;
 `;
 
 const List = styled.div`
@@ -244,7 +224,7 @@ const ListButton = styled.div`
 
   a {
     color: black;
-    padding: 10px;
+    padding: 12px 25px;
     border: 1px solid black;
     border-radius: 2px;
     text-decoration: none;
diff --git a/web/src/util/i18n.ts b/web/src/util/i18n.ts
index 21bbc9d..d8d1351 100644
--- a/web/src/util/i18n.ts
+++ b/web/src/util/i18n.ts
@@ -5,6 +5,8 @@ import XHR from 'i18next-xhr-backend';
 import LanguageDetector from 'i18next-browser-languagedetector';
 import {initReactI18next} from 'react-i18next';
 
+const TRANSLATION_VERSION = '1.11';
+
 i18n
   .use(Backend)
   .use(LanguageDetector)
@@ -14,7 +16,7 @@ i18n
       backends: [LocalStorageBackend, XHR],
       backendOptions: [
         {
-          versions: {en: '1.10', ja: '1.10'},
+          versions: {en: TRANSLATION_VERSION, ja: TRANSLATION_VERSION},
         },
       ],
     },