From d597546f74264c77a40d7fa0c89830acde87b396 Mon Sep 17 00:00:00 2001 From: Lucas Boaventura Date: Mon, 13 Sep 2021 22:20:24 -0300 Subject: [PATCH] (#5) Ajuste geral dos componentes Co-authored-by: ServidioEC <52542729+ServidioEC@users.noreply.github.com> --- frontend/.eslintrc.json | 7 ++ frontend/package.json | 1 + frontend/src/App.tsx | 23 ++---- .../components/NavBar/FifthNavBar/index.tsx | 3 +- .../components/NavBar/FourthNavBar/index.tsx | 6 +- .../components/NavBar/SecondNavBar/index.tsx | 4 +- .../components/NavBar/ThirdNavBar/index.tsx | 2 +- frontend/src/components/NavBar/index.tsx | 6 +- frontend/src/components/NavBar/styles.ts | 4 +- .../src/hooks/{useFetch.tsx => useFetch.ts} | 1 - frontend/src/pages/Home/index.tsx | 30 +++++-- frontend/src/styles/taNaMesaDarkTheme.ts | 2 +- frontend/yarn.lock | 81 +++++++++++++++++-- 13 files changed, 128 insertions(+), 42 deletions(-) rename frontend/src/hooks/{useFetch.tsx => useFetch.ts} (96%) diff --git a/frontend/.eslintrc.json b/frontend/.eslintrc.json index 672d239..94bcb7c 100644 --- a/frontend/.eslintrc.json +++ b/frontend/.eslintrc.json @@ -36,6 +36,13 @@ "import/prefer-default-export": "off", "import/no-duplicates": "off", "@typescript-eslint/camelcase": "off", + "@typescript-eslint/naming-convention": [ + "off", + { + "selector": "interface", + "format": ["camelCase"] + } + ], "@typescript-eslint/explicit-function-return-type": [ "error", { diff --git a/frontend/package.json b/frontend/package.json index 3193af8..35b0fa1 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -12,6 +12,7 @@ "react": "^17.0.2", "react-dom": "^17.0.2", "react-icons": "^4.2.0", + "react-router-dom": "^5.3.0", "react-scripts": "4.0.3", "styled-components": "^5.3.1", "typescript": "^4.3.5", diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx index 77e7bd7..498f71c 100644 --- a/frontend/src/App.tsx +++ b/frontend/src/App.tsx @@ -2,27 +2,16 @@ import React from 'react'; import GlobalStyle from 'styles/global'; -import NavBar from 'components/NavBar'; -import Loading from 'components/Loading'; -import MenuItem from 'components/MenuItem'; +import Routes from 'routes'; +import AppProvider from 'hooks'; const App: React.FC = () => { return ( <> - - - - + + + + ); }; diff --git a/frontend/src/components/NavBar/FifthNavBar/index.tsx b/frontend/src/components/NavBar/FifthNavBar/index.tsx index f12eaa3..328cfc2 100644 --- a/frontend/src/components/NavBar/FifthNavBar/index.tsx +++ b/frontend/src/components/NavBar/FifthNavBar/index.tsx @@ -4,11 +4,10 @@ import { NavBarContainer } from 'components/NavBar/styles'; const FifthNavBar: React.FC = () => { return ( - +
Mesa
- ); }; diff --git a/frontend/src/components/NavBar/FourthNavBar/index.tsx b/frontend/src/components/NavBar/FourthNavBar/index.tsx index d2eca14..25278a8 100644 --- a/frontend/src/components/NavBar/FourthNavBar/index.tsx +++ b/frontend/src/components/NavBar/FourthNavBar/index.tsx @@ -4,11 +4,7 @@ import { FiArrowLeft } from 'react-icons/fi'; import { NavBarContainer } from 'components/NavBar/styles'; const FourthNavBar: React.FC = () => { - return ( - - - - ); + return ; }; export default FourthNavBar; diff --git a/frontend/src/components/NavBar/SecondNavBar/index.tsx b/frontend/src/components/NavBar/SecondNavBar/index.tsx index 5f5c8fb..8bb6ab0 100644 --- a/frontend/src/components/NavBar/SecondNavBar/index.tsx +++ b/frontend/src/components/NavBar/SecondNavBar/index.tsx @@ -1,11 +1,11 @@ import React from 'react'; import { FiArrowLeft } from 'react-icons/fi'; -import { NavBarContainer,NameContainer } from 'components/NavBar/styles'; +import { NavBarContainer, NameContainer } from 'components/NavBar/styles'; const SecondNavBar: React.FC = () => { return ( - +
Voltar diff --git a/frontend/src/components/NavBar/ThirdNavBar/index.tsx b/frontend/src/components/NavBar/ThirdNavBar/index.tsx index 3962d93..6c0eb28 100644 --- a/frontend/src/components/NavBar/ThirdNavBar/index.tsx +++ b/frontend/src/components/NavBar/ThirdNavBar/index.tsx @@ -5,7 +5,7 @@ import { NavBarContainer } from 'components/NavBar/styles'; const ThirdNavBar: React.FC = () => { return ( - +
Voltar diff --git a/frontend/src/components/NavBar/index.tsx b/frontend/src/components/NavBar/index.tsx index 02f229a..efa3ca2 100644 --- a/frontend/src/components/NavBar/index.tsx +++ b/frontend/src/components/NavBar/index.tsx @@ -5,7 +5,7 @@ import { NavBarContainer, NameContainer } from 'components/NavBar/styles'; const NavBar: React.FC = () => { return ( - +
Voltar @@ -18,4 +18,8 @@ const NavBar: React.FC = () => { ); }; +NavBar.defaultProps = { + styles: {}, +}; + export default NavBar; diff --git a/frontend/src/components/NavBar/styles.ts b/frontend/src/components/NavBar/styles.ts index 8f80f37..204efb1 100644 --- a/frontend/src/components/NavBar/styles.ts +++ b/frontend/src/components/NavBar/styles.ts @@ -21,7 +21,8 @@ export const NavBarContainer = styled.div` } span { - font-size: 1.5rem; + font-size: 2.4rem; + color: ${props => props.theme.black}; } } `; @@ -36,5 +37,6 @@ export const NameContainer = styled.div` span { font-size: 1.5rem; font-weight: 500; + color: ${props => props.theme.black}; } `; diff --git a/frontend/src/hooks/useFetch.tsx b/frontend/src/hooks/useFetch.ts similarity index 96% rename from frontend/src/hooks/useFetch.tsx rename to frontend/src/hooks/useFetch.ts index 0d9f571..93c498b 100644 --- a/frontend/src/hooks/useFetch.tsx +++ b/frontend/src/hooks/useFetch.ts @@ -1,4 +1,3 @@ -import React from 'react'; import { useState, useEffect, useCallback } from 'react'; type Hook = (url: string, setMenuItem: (menuItem: string) => void) => boolean; diff --git a/frontend/src/pages/Home/index.tsx b/frontend/src/pages/Home/index.tsx index 17e240e..7c1e874 100644 --- a/frontend/src/pages/Home/index.tsx +++ b/frontend/src/pages/Home/index.tsx @@ -2,20 +2,27 @@ import React from 'react'; import { useUserTheme } from 'hooks/theme'; +import Loading from 'components/Loading'; +import MenuItem from 'components/MenuItem'; import { Container } from './styles'; import NavBar from '../../components/NavBar'; -//import SecondNavBar from '../../components/NavBar/SecondNavBar'; -//import ThirdNavBar from '../../components/NavBar/ThirdNavBar'; -//import FourthNavBar from '../../components/NavBar/FourthNavBar'; -//import FifthNavBar from '../../components/NavBar/FifthNavBar'; +import SecondNavBar from '../../components/NavBar/SecondNavBar'; +import ThirdNavBar from '../../components/NavBar/ThirdNavBar'; +import FourthNavBar from '../../components/NavBar/FourthNavBar'; +import FifthNavBar from '../../components/NavBar/FifthNavBar'; const Home: React.FC = () => { const { switchTheme, theme } = useUserTheme(); return ( - + + + + {/* */} + +

Tá na Mesa

{theme.type}

+ + + ); }; diff --git a/frontend/src/styles/taNaMesaDarkTheme.ts b/frontend/src/styles/taNaMesaDarkTheme.ts index d3d6e09..2ba9e39 100644 --- a/frontend/src/styles/taNaMesaDarkTheme.ts +++ b/frontend/src/styles/taNaMesaDarkTheme.ts @@ -14,5 +14,5 @@ export default { black: '#FFFFFF', white: '#000000', - gray: '#C4C4C4' + gray: '#C4C4C4', }; diff --git a/frontend/yarn.lock b/frontend/yarn.lock index 22444ec..9ef8d04 100644 --- a/frontend/yarn.lock +++ b/frontend/yarn.lock @@ -1157,7 +1157,7 @@ dependencies: regenerator-runtime "^0.13.4" -"@babel/runtime@^7.10.2", "@babel/runtime@^7.11.2", "@babel/runtime@^7.12.5", "@babel/runtime@^7.5.5", "@babel/runtime@^7.7.2", "@babel/runtime@^7.8.4", "@babel/runtime@^7.9.2": +"@babel/runtime@^7.1.2", "@babel/runtime@^7.10.2", "@babel/runtime@^7.11.2", "@babel/runtime@^7.12.1", "@babel/runtime@^7.12.13", "@babel/runtime@^7.12.5", "@babel/runtime@^7.5.5", "@babel/runtime@^7.7.2", "@babel/runtime@^7.8.4", "@babel/runtime@^7.9.2": version "7.15.4" resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.15.4.tgz#fd17d16bfdf878e6dd02d19753a39fa8a8d9c84a" integrity sha512-99catp6bHCaxr4sJ/DbTGgHS4+Rs2RVd2g7iOap6SLGPDknRK9ztKNsE/Fg6QhSeh1FGE5f6gHGQmvvn3I3xhw== @@ -6112,6 +6112,18 @@ hex-color-regex@^1.1.0: resolved "https://registry.yarnpkg.com/hex-color-regex/-/hex-color-regex-1.1.0.tgz#4c06fccb4602fe2602b3c93df82d7e7dbf1a8a8e" integrity sha512-l9sfDFsuqtOqKDsQdqrMRk0U85RZc0RtOR9yPI7mRVOa4FsR/BVnZ0shmQRM96Ji99kYZP/7hn1cedc1+ApsTQ== +history@^4.9.0: + version "4.10.1" + resolved "https://registry.yarnpkg.com/history/-/history-4.10.1.tgz#33371a65e3a83b267434e2b3f3b1b4c58aad4cf3" + integrity sha512-36nwAD620w12kuzPAsyINPWJqlNbij+hpK1k9XRloDtym8mxzGYl2c17LnV6IAGB2Dmg4tEa7G7DlawS0+qjew== + dependencies: + "@babel/runtime" "^7.1.2" + loose-envify "^1.2.0" + resolve-pathname "^3.0.0" + tiny-invariant "^1.0.2" + tiny-warning "^1.0.0" + value-equal "^1.0.1" + hmac-drbg@^1.0.1: version "1.0.1" resolved "https://registry.yarnpkg.com/hmac-drbg/-/hmac-drbg-1.0.1.tgz#d2745701025a6c775a6c545793ed502fc0c649a1" @@ -6121,7 +6133,7 @@ hmac-drbg@^1.0.1: minimalistic-assert "^1.0.0" minimalistic-crypto-utils "^1.0.1" -hoist-non-react-statics@^3.0.0, hoist-non-react-statics@^3.3.0: +hoist-non-react-statics@^3.0.0, hoist-non-react-statics@^3.1.0, hoist-non-react-statics@^3.3.0: version "3.3.2" resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz#ece0acaf71d62c2969c2ec59feff42a4b1a85b45" integrity sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw== @@ -7854,7 +7866,7 @@ lolex@^5.0.0: dependencies: "@sinonjs/commons" "^1.7.0" -loose-envify@^1.1.0, loose-envify@^1.4.0: +loose-envify@^1.1.0, loose-envify@^1.2.0, loose-envify@^1.3.1, loose-envify@^1.4.0: version "1.4.0" resolved "https://registry.yarnpkg.com/loose-envify/-/loose-envify-1.4.0.tgz#71ee51fa7be4caec1a63839f7e682d8132d30caf" integrity sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q== @@ -8101,6 +8113,14 @@ min-indent@^1.0.0: resolved "https://registry.yarnpkg.com/min-indent/-/min-indent-1.0.1.tgz#a63f681673b30571fbe8bc25686ae746eefa9869" integrity sha512-I9jwMn07Sy/IwOj3zVkVik2JTvgpaykDZEigL6Rx6N9LbMywwUSMtxET+7lVoDLLd3O3IXwJwvuuns8UB/HeAg== +mini-create-react-context@^0.4.0: + version "0.4.1" + resolved "https://registry.yarnpkg.com/mini-create-react-context/-/mini-create-react-context-0.4.1.tgz#072171561bfdc922da08a60c2197a497cc2d1d5e" + integrity sha512-YWCYEmd5CQeHGSAKrYvXgmzzkrvssZcuuQDDeqkT+PziKGMgE+0MCCtcKbROzocGBG1meBLl2FotlRwf4gAzbQ== + dependencies: + "@babel/runtime" "^7.12.1" + tiny-warning "^1.0.3" + mini-css-extract-plugin@0.11.3: version "0.11.3" resolved "https://registry.yarnpkg.com/mini-css-extract-plugin/-/mini-css-extract-plugin-0.11.3.tgz#15b0910a7f32e62ffde4a7430cfefbd700724ea6" @@ -8894,7 +8914,7 @@ path-to-regexp@0.1.7: resolved "https://registry.yarnpkg.com/path-to-regexp/-/path-to-regexp-0.1.7.tgz#df604178005f522f15eb4490e7247a1bfaa67f8c" integrity sha1-32BBeABfUi8V60SQ5yR6G/qmf4w= -path-to-regexp@^1.0.3: +path-to-regexp@^1.0.3, path-to-regexp@^1.7.0: version "1.8.0" resolved "https://registry.yarnpkg.com/path-to-regexp/-/path-to-regexp-1.8.0.tgz#887b3ba9d84393e87a0a0b9f4cb756198b53548a" integrity sha512-n43JRhlUKUAlibEJhPeir1ncUID16QnEjNpwzNdO3Lm4ywrBpBZ5oLD0I6br9evr1Y9JTqwRtAh7JLoOzAQdVA== @@ -9802,7 +9822,7 @@ prompts@^2.0.1: kleur "^3.0.3" sisteransi "^1.0.5" -prop-types@^15.7.2: +prop-types@^15.6.2, prop-types@^15.7.2: version "15.7.2" resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.7.2.tgz#52c41e75b8c87e72b9d9360e0206b99dcbffa6c5" integrity sha512-8QQikdH7//R2vurIJSutZ1smHYTcLpRWEOlHnzcWHmBYrOGUysKwSsrC89BCiFj3CbrfJ/nXFdJepOVrY1GCHQ== @@ -10046,7 +10066,7 @@ react-icons@^4.2.0: resolved "https://registry.yarnpkg.com/react-icons/-/react-icons-4.2.0.tgz#6dda80c8a8f338ff96a1851424d63083282630d0" integrity sha512-rmzEDFt+AVXRzD7zDE21gcxyBizD/3NqjbX6cmViAgdqfJ2UiLer8927/QhhrXQV7dEj/1EGuOTPp7JnLYVJKQ== -react-is@^16.7.0, react-is@^16.8.1: +react-is@^16.6.0, react-is@^16.7.0, react-is@^16.8.1: version "16.13.1" resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4" integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ== @@ -10061,6 +10081,35 @@ react-refresh@^0.8.3: resolved "https://registry.yarnpkg.com/react-refresh/-/react-refresh-0.8.3.tgz#721d4657672d400c5e3c75d063c4a85fb2d5d68f" integrity sha512-X8jZHc7nCMjaCqoU+V2I0cOhNW+QMBwSUkeXnTi8IPe6zaRWfn60ZzvFDZqWPfmSJfjub7dDW1SP0jaHWLu/hg== +react-router-dom@^5.3.0: + version "5.3.0" + resolved "https://registry.yarnpkg.com/react-router-dom/-/react-router-dom-5.3.0.tgz#da1bfb535a0e89a712a93b97dd76f47ad1f32363" + integrity sha512-ObVBLjUZsphUUMVycibxgMdh5jJ1e3o+KpAZBVeHcNQZ4W+uUGGWsokurzlF4YOldQYRQL4y6yFRWM4m3svmuQ== + dependencies: + "@babel/runtime" "^7.12.13" + history "^4.9.0" + loose-envify "^1.3.1" + prop-types "^15.6.2" + react-router "5.2.1" + tiny-invariant "^1.0.2" + tiny-warning "^1.0.0" + +react-router@5.2.1: + version "5.2.1" + resolved "https://registry.yarnpkg.com/react-router/-/react-router-5.2.1.tgz#4d2e4e9d5ae9425091845b8dbc6d9d276239774d" + integrity sha512-lIboRiOtDLFdg1VTemMwud9vRVuOCZmUIT/7lUoZiSpPODiiH1UQlfXy+vPLC/7IWdFYnhRwAyNqA/+I7wnvKQ== + dependencies: + "@babel/runtime" "^7.12.13" + history "^4.9.0" + hoist-non-react-statics "^3.1.0" + loose-envify "^1.3.1" + mini-create-react-context "^0.4.0" + path-to-regexp "^1.7.0" + prop-types "^15.6.2" + react-is "^16.6.0" + tiny-invariant "^1.0.2" + tiny-warning "^1.0.0" + react-scripts@4.0.3: version "4.0.3" resolved "https://registry.yarnpkg.com/react-scripts/-/react-scripts-4.0.3.tgz#b1cafed7c3fa603e7628ba0f187787964cb5d345" @@ -10402,6 +10451,11 @@ resolve-from@^5.0.0: resolved "https://registry.yarnpkg.com/resolve-from/-/resolve-from-5.0.0.tgz#c35225843df8f776df21c57557bc087e9dfdfc69" integrity sha512-qYg9KP24dD5qka9J47d0aVky0N+b4fTU89LN9iDnjB5waksiC49rvMB0PrUJQGoTmH50XPiqOvAjDfaijGxYZw== +resolve-pathname@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/resolve-pathname/-/resolve-pathname-3.0.0.tgz#99d02224d3cf263689becbb393bc560313025dcd" + integrity sha512-C7rARubxI8bXFNB/hqcp/4iUeIXJhJZvFPFPiSPRnhU5UPxzMFIl+2E6yY6c4k9giDJAhtV+enfA+G89N6Csng== + resolve-url-loader@^3.1.2: version "3.1.4" resolved "https://registry.yarnpkg.com/resolve-url-loader/-/resolve-url-loader-3.1.4.tgz#3c16caebe0b9faea9c7cc252fa49d2353c412320" @@ -11608,6 +11662,16 @@ timsort@^0.3.0: resolved "https://registry.yarnpkg.com/timsort/-/timsort-0.3.0.tgz#405411a8e7e6339fe64db9a234de11dc31e02bd4" integrity sha1-QFQRqOfmM5/mTbmiNN4R3DHgK9Q= +tiny-invariant@^1.0.2: + version "1.1.0" + resolved "https://registry.yarnpkg.com/tiny-invariant/-/tiny-invariant-1.1.0.tgz#634c5f8efdc27714b7f386c35e6760991d230875" + integrity sha512-ytxQvrb1cPc9WBEI/HSeYYoGD0kWnGEOR8RY6KomWLBVhqz0RgTwVO9dLrGz7dC+nN9llyI7OKAgRq8Vq4ZBSw== + +tiny-warning@^1.0.0, tiny-warning@^1.0.3: + version "1.0.3" + resolved "https://registry.yarnpkg.com/tiny-warning/-/tiny-warning-1.0.3.tgz#94a30db453df4c643d0fd566060d60a875d84754" + integrity sha512-lBN9zLN/oAf68o3zNXYrdCt1kP8WsiGW8Oo2ka41b2IM5JL/S1CTyX1rW0mb/zSuJun0ZUrDxx4sqvYS2FWzPA== + tmp@^0.0.33: version "0.0.33" resolved "https://registry.yarnpkg.com/tmp/-/tmp-0.0.33.tgz#6d34335889768d21b2bcda0aa277ced3b1bfadf9" @@ -12087,6 +12151,11 @@ validate-npm-package-license@^3.0.1: spdx-correct "^3.0.0" spdx-expression-parse "^3.0.0" +value-equal@^1.0.1: + version "1.0.1" + resolved "https://registry.yarnpkg.com/value-equal/-/value-equal-1.0.1.tgz#1e0b794c734c5c0cade179c437d356d931a34d6c" + integrity sha512-NOJ6JZCAWr0zlxZt+xqCHNTEKOsrks2HQd4MqhP1qy4z1SkbEP467eNx6TgDKXMvUOb+OENfJCZwM+16n7fRfw== + vary@^1, vary@~1.1.2: version "1.1.2" resolved "https://registry.yarnpkg.com/vary/-/vary-1.1.2.tgz#2299f02c6ded30d4a5961b0b9f74524a18f634fc"