From bdaced04574c27729b573ea659bcd7d4dfe8e802 Mon Sep 17 00:00:00 2001 From: David Date: Sat, 12 Jun 2021 22:44:56 +0200 Subject: [PATCH] Dependencies updated & small enhancements (#27) * Dependencies updated and imports shortened * Head tags refactored * Final tweaks --- .travis.yml | 3 +- README.md | 2 +- components/CustomError.tsx | 8 +- components/CustomHead.tsx | 56 + components/Footer.tsx | 4 +- components/Header.tsx | 77 +- components/Layout.tsx | 50 +- components/TranslationArea.tsx | 2 +- components/index.tsx | 4 + jest.config.js | 6 +- package.json | 50 +- pages/404.tsx | 4 +- pages/500.tsx | 4 +- pages/[[...slug]].tsx | 20 +- pages/_app.tsx | 7 +- pages/_document.tsx | 2 +- pages/api/graphql.ts | 2 +- pages/api/v1/[[...slug]].ts | 2 +- public/{favicon.svg => logo.svg} | 0 tests/components/CustomError.test.tsx | 4 +- tests/pages/[[...slug]].test.tsx | 6 +- tests/pages/api/graphql.test.ts | 4 +- tests/pages/api/v1/[[...slug]].test.ts | 4 +- tests/reactUtils.tsx | 7 +- tests/utils/language.test.ts | 4 +- tests/utils/reducer.test.ts | 2 +- tests/utils/translate.test.ts | 4 +- tsconfig.json | 6 +- yarn.lock | 5552 ++++++++++-------------- 29 files changed, 2523 insertions(+), 3373 deletions(-) create mode 100644 components/CustomHead.tsx rename public/{favicon.svg => logo.svg} (100%) diff --git a/.travis.yml b/.travis.yml index 6ef1d2a..c2f1e38 100644 --- a/.travis.yml +++ b/.travis.yml @@ -23,7 +23,8 @@ branches: script: - yarn test --ci - - yarn dev & wait-on http://localhost:3000 + - yarn build + - yarn start & wait-on http://localhost:3000 - 'if [ "$TRAVIS_PULL_REQUEST" = "false" ]; then yarn cy:run --record --key $CY_KEY; diff --git a/README.md b/README.md index 87b4970..846fa2f 100644 --- a/README.md +++ b/README.md @@ -1,6 +1,6 @@ # Lingva Translate - + [![Travis Build](https://travis-ci.com/TheDavidDelta/lingva-translate.svg?branch=main)](https://travis-ci.com/TheDavidDelta/lingva-translate) [![Vercel Status](https://img.shields.io/github/deployments/TheDavidDelta/lingva-translate/Production?label=vercel&logo=vercel&color=f5f5f5)](https://lingva.ml/) diff --git a/components/CustomError.tsx b/components/CustomError.tsx index 0a46aef..214897f 100644 --- a/components/CustomError.tsx +++ b/components/CustomError.tsx @@ -1,7 +1,7 @@ import { FC } from "react"; import { Stack, HStack, Heading, Text, Icon, useColorModeValue } from "@chakra-ui/react"; import { FaSadTear } from "react-icons/fa"; -import Layout from "./Layout"; +import { CustomHead } from "."; type Props = { statusCode: number, @@ -9,7 +9,9 @@ type Props = { }; const CustomError: FC = ({ statusCode, statusText }) => ( - + <> + + = ({ statusCode, statusText }) => ( {statusText} - + ); export default CustomError; diff --git a/components/CustomHead.tsx b/components/CustomHead.tsx new file mode 100644 index 0000000..a6d1aaa --- /dev/null +++ b/components/CustomHead.tsx @@ -0,0 +1,56 @@ +import { FC } from "react"; +import Head from "next/head"; +import { useColorModeValue } from "@chakra-ui/react"; +import theme from "@theme"; + +type Props = { + customTitle?: string, + home?: true +}; + +const title = "Lingva Translate"; +const description = "Alternative front-end for Google Translate, serving as a Free and Open Source translator with over a hundred languages available"; + +const siteDomain = process.env["NEXT_PUBLIC_SITE_DOMAIN"]; +const url = siteDomain && (siteDomain.includes("localhost") ? "http://" : "https://") + siteDomain; + +const CustomHead: FC = ({ customTitle, home }) => { + const fullTitle = customTitle + ? `${customTitle} | ${title}` + : title; + + const themeColor = useColorModeValue(theme.colors.lingva["100"], theme.colors.lingva["900"]); + + return ( + + {fullTitle} + + + {home && } + + + + + + + + + + + + + + + + + + + + + + + + ); +}; + +export default CustomHead; diff --git a/components/Footer.tsx b/components/Footer.tsx index 0d793e2..f4d4b2c 100644 --- a/components/Footer.tsx +++ b/components/Footer.tsx @@ -1,5 +1,5 @@ import { FC } from "react"; -import { Center, Text, useColorModeValue } from "@chakra-ui/react"; +import { Center, Text } from "@chakra-ui/react"; type Props = { [key: string]: any @@ -11,8 +11,6 @@ const Footer: FC = (props) => ( w="full" p={3} fontSize={["sm", null, "md"]} - bgColor={useColorModeValue("lingva.100", "lingva.900")} - color={useColorModeValue("lingva.900", "lingva.100")} {...props} > © 2021 TheDavidDelta diff --git a/components/Header.tsx b/components/Header.tsx index 98930f8..ede6bf1 100644 --- a/components/Header.tsx +++ b/components/Header.tsx @@ -1,50 +1,57 @@ import { FC } from "react"; +import Head from "next/head"; import NextLink from "next/link"; import { Flex, HStack, IconButton, Link, useColorModeValue } from "@chakra-ui/react"; import { FaGithub } from "react-icons/fa"; import Image from "next/image"; -import ColorModeToggler from "./ColorModeToggler"; +import { ColorModeToggler } from "."; type Props = { [key: string]: any }; const Header: FC = (props) => ( - - - - Logo + + + + + + + + + Logo + + + + - - - - - } - colorScheme="lingva" - variant={useColorModeValue("outline", "solid")} - /> - - + } + colorScheme="lingva" + variant={useColorModeValue("outline", "solid")} + /> + + + ); export default Header; diff --git a/components/Layout.tsx b/components/Layout.tsx index 11d05ac..c648e72 100644 --- a/components/Layout.tsx +++ b/components/Layout.tsx @@ -1,48 +1,13 @@ import { FC } from "react"; import { Flex, VStack, Button, Link, useColorModeValue } from "@chakra-ui/react"; -import Head from "next/head"; -import Header from "./Header"; -import Footer from "./Footer"; +import { Header, Footer } from "."; type Props = { - customTitle?: string, - home?: true [key: string]: any }; -const title = "Lingva Translate"; -const description = "Alternative front-end for Google Translate, serving as a Free and Open Source translator with over a hundred languages available"; -const siteDomain = process.env["NEXT_PUBLIC_SITE_DOMAIN"]; -const url = siteDomain && (siteDomain.includes("localhost") ? "http://" : "https://") + siteDomain; - -const Layout: FC = ({ customTitle, children, home, ...props }) => ( +const Layout: FC = ({ children, ...props }) => ( <> - - - {customTitle ?? title} - - - - {home && } - - - - - - - - - - - - - - - - - - - -
+
+ = ({ customTitle, children, home, ...props }) => ( > {children} -