diff --git a/src/components/Form.tsx b/src/components/Form.tsx
index 659637f..620394e 100644
--- a/src/components/Form.tsx
+++ b/src/components/Form.tsx
@@ -11,7 +11,8 @@ import Suggestion from './Suggestion';
const Form: React.FC<{
initialValue?: string;
-}> = ({ initialValue = '' }) => {
+ useSuggestion?: boolean;
+}> = ({ initialValue = '', useSuggestion = true }) => {
const reset = useStoreActions((actions) => actions.stats.reset);
const navigate = useNavigate();
const [inputValue, setInputValue] = useState(initialValue);
@@ -53,8 +54,6 @@ const Form: React.FC<{
setSuggestionQuery(modifiedValue);
}, [inputValue, setSuggestionQuery]);
- const queryGiven = suggestionQuery && suggestionQuery !== '';
-
return (
@@ -71,7 +70,7 @@ const Form: React.FC<{
aria-label="Search"
/>
- {queryGiven && !suggested ? (
+ {useSuggestion && !suggested ? (
) : null}
diff --git a/src/components/Suggestion.tsx b/src/components/Suggestion.tsx
index d15c415..8e0d423 100644
--- a/src/components/Suggestion.tsx
+++ b/src/components/Suggestion.tsx
@@ -3,6 +3,7 @@ import { motion } from 'framer-motion';
import React, { useEffect, useRef, useState } from 'react';
import { useTranslation } from 'react-i18next';
import { TiArrowSync } from 'react-icons/ti';
+import { PropagateLoader } from 'react-spinners';
import styled from 'styled-components';
import {
sendAcceptSuggestionEvent,
@@ -22,7 +23,7 @@ import {
type Modifier = (word: string) => string;
-const modifiers: Modifier[] = [
+const MODIFIERS: Modifier[] = [
(word): string => `${capitalize(germanify(word))}`,
(word): string => `${capitalize(word)}`,
(word): string => njoin('Air', capitalize(word), { elision: false }),
@@ -154,19 +155,19 @@ const modifiers: Modifier[] = [
(word): string => capitalize(word) + ' by Design',
];
-const fontFamilies = [
+const FONT_FAMILIES = [
`'Helvetica', sans-serif`,
`'Avenir', sans-serif`,
`'Futura', sans-serif`,
`'Montserrat', sans-serif`,
];
-const fontWeight = [300, 600, 900];
+const FONT_WEIGHTS = [300, 600, 900];
-const numSuggestion = 3;
+const NUM_SUGGESTION = 3;
function modifyWord(word: string): string {
- return sample(modifiers)(word);
+ return sample(MODIFIERS)(word);
}
async function getSynonyms(word: string): Promise {
@@ -206,7 +207,7 @@ const Suggestion: React.FC<{
function shuffle(): void {
const best = sampleMany(
[...synonymRef.current.filter((s) => s.length < 8), ...times(query, 10)],
- numSuggestion
+ NUM_SUGGESTION
).map((word) => modifyWord(word));
setBestWords(best);
}
@@ -223,6 +224,7 @@ const Suggestion: React.FC<{
useEffect(() => {
let isEffective = true;
+
const fn = async (): Promise => {
if (query && query.length > 0) {
const synonyms = await getSynonyms(query);
@@ -243,13 +245,14 @@ const Suggestion: React.FC<{
return (
{t('try')}
-
- {bestWords &&
- bestWords.map((name, i) => (
+
+ {bestWords.length > 0 ? (
+
+ {bestWords.map((name, i) => (
- applyQuery(name)}
@@ -257,8 +260,21 @@ const Suggestion: React.FC<{
>
{name}
- ))}
-
+ ))}{' '}
+
+ ) : (
+
+ )}
+
diff --git a/src/pages/Home.tsx b/src/pages/Home.tsx
index 8f6bd14..baefe47 100644
--- a/src/pages/Home.tsx
+++ b/src/pages/Home.tsx
@@ -15,7 +15,7 @@ export default function Home() {