Refactor/improvements

packages/web/.eslintrc.json

@@ -25,13 +25,42 @@
     "ecmaVersion": 11,
     "sourceType": "module"
   },
-  "plugins": ["react", "react-hooks", "@typescript-eslint"],
+  "plugins": ["react", "react-hooks", "import", "@typescript-eslint"],
   "rules": {
     "react-hooks/rules-of-hooks": "error",
     "react-hooks/exhaustive-deps": "warn",
     "react/prop-types": "off",
     "react/react-in-jsx-scope": "off",
     "@typescript-eslint/explicit-module-boundary-types": "off",
-    "@typescript-eslint/no-namespace": "off"
+    "@typescript-eslint/no-namespace": "off",
+    "import/order": [
+      "error",
+      {
+        "newlines-between": "always",
+        "groups": [
+          "external",
+          "index",
+          "sibling",
+          "parent",
+          "internal",
+          "builtin",
+          "object",
+          "type"
+        ],
+        "pathGroups": [
+          {
+            "pattern": "react",
+            "group": "external",
+            "position": "before"
+          },
+          {
+            "pattern": "{next,next/**}",
+            "group": "external",
+            "position": "before"
+          }
+        ],
+        "pathGroupsExcludedImportTypes": []
+      }
+    ]
   }
 }

packages/web/.storybook/preview.js

@@ -1,4 +1,4 @@
-import GlobalStyles from '../src/styles/global'
+import { GlobalStyles } from '../src/styles/global'
 
 export const decorators = [
   (Story) => (

packages/web/package.json

@@ -47,6 +47,7 @@
     "babel-loader": "^8.2.3",
     "eslint": "7.21.0",
     "eslint-config-prettier": "8.1.0",
+    "eslint-plugin-import": "^2.25.4",
     "eslint-plugin-prettier": "3.3.1",
     "eslint-plugin-react": "7.22.0",
     "eslint-plugin-react-hooks": "4.2.0",

packages/web/src/components/AutoCompĺete/index.tsx → packages/web/src/components/AutoComplete/index.tsx

@@ -18,7 +18,7 @@ export type AutoCompleteProps = {
   onBlur?: () => void
 }
 
-const AutoComplete: React.FC<AutoCompleteProps> = ({
+export const AutoComplete: React.FC<AutoCompleteProps> = ({
   id,
   defaultValue = '',
   onChange = () => '',
@@ -48,5 +48,3 @@ const AutoComplete: React.FC<AutoCompleteProps> = ({
     </S.Wrapper>
   )
 }
-
-export default AutoComplete

packages/web/src/components/AutoCompĺete/stories.tsx → packages/web/src/components/AutoComplete/stories.tsx

@@ -1,15 +1,15 @@
 import { Story, Meta } from '@storybook/react/types-6-0'
 
-import AutoCompĺete from '.'
+import { AutoComplete } from '.'
 
 export default {
-  title: 'AutoCompĺete',
-  component: AutoCompĺete,
+  title: 'AutoComplete',
+  component: AutoComplete,
   args: {}
 } as Meta
 
 export const Default: Story = () => (
-  <AutoCompĺete
+  <AutoComplete
     id="AutoCompleteId"
     label="AutoCompleteLabel"
     placeholder="AutoCompletePlaceholder"

packages/web/src/components/AutoCompĺete/styles.ts → packages/web/src/components/AutoComplete/styles.ts

@@ -1,4 +1,5 @@
 import styled, { css, FlattenSimpleInterpolation } from 'styled-components'
+
 import { AutoCompleteVariants } from '.'
 
 type VariantsDecorators = {

packages/web/src/components/AutoCompĺete/test.tsx → packages/web/src/components/AutoComplete/test.tsx

@@ -1,6 +1,6 @@
 import { fireEvent, render, screen } from '@testing-library/react'
 
-import AutoComplete, { AutoCompleteProps } from '.'
+import { AutoComplete, AutoCompleteProps } from '.'
 
 const BaseComponent = (props: Partial<AutoCompleteProps>) => (
   <AutoComplete

packages/web/src/components/BusSchedule/index.tsx

@@ -1,6 +1,6 @@
 import { BusTime } from 'models'
 import { BusScheduleViewModel, ScheduleMapNonNull } from 'view-model'
-import { modifiersMap } from 'components/ModifiersTooltip'
+import { modifiersMap } from 'components'
 
 import * as S from './styles'
 
@@ -9,7 +9,10 @@ export type BusScheduleProps = {
   schedule: BusTime[]
 }
 
-const BusSchedule: React.FC<BusScheduleProps> = ({ title, schedule }) => {
+export const BusSchedule: React.FC<BusScheduleProps> = ({
+  title,
+  schedule
+}) => {
   const scheduleMap = BusScheduleViewModel.parse(schedule) as ScheduleMapNonNull
 
   return (
@@ -40,5 +43,3 @@ const BusSchedule: React.FC<BusScheduleProps> = ({ title, schedule }) => {
     </S.Wrapper>
   )
 }
-
-export default BusSchedule

packages/web/src/components/BusSchedule/stories.tsx

@@ -1,7 +1,7 @@
 import { Story, Meta } from '@storybook/react/types-6-0'
 import { BusTime, Time } from 'models'
 
-import BusSchedule from '.'
+import { BusSchedule } from '.'
 
 export default {
   title: 'BusSchedule',

packages/web/src/components/Dialog/provider.tsx

@@ -1,6 +1,7 @@
-import { ContextOutsideProviderError } from 'errors'
 import React, { useState, createContext, useContext } from 'react'
 
+import { ContextOutsideProviderError } from 'errors'
+
 import { Dialog } from '.'
 
 type openDialogParam = React.FC<{ close: () => void }>
@@ -51,8 +52,3 @@ export const useDialog = () => {
 
   return context
 }
-
-export default {
-  DialogProvider,
-  useDialog
-}

packages/web/src/components/Footer/index.tsx

@@ -1,5 +1,7 @@
-import { Text } from 'components/Text'
 import React from 'react'
+
+import { Text } from 'components'
+
 import * as S from './styles'
 
 export const Footer: React.FC = () => {

packages/web/src/components/Footer/styles.ts

@@ -1,4 +1,4 @@
-import { TextStyles } from 'components/Text'
+import * as TextStyles from 'components/Text/styles'
 import styled from 'styled-components'
 
 export const Content = styled.div`

packages/web/src/components/LabelsLegend/index.tsx

@@ -1,13 +1,13 @@
 import { BusModifiers } from 'models'
-import { modifiersMap } from 'components/ModifiersTooltip'
+import { modifiersMap } from 'components'
 
 import * as S from './styles'
 
 export type LabelsLegendProps = {
   labels: { [key in BusModifiers]?: string }
 }
 
-const LabelsLegend: React.FC<LabelsLegendProps> = ({ labels }) => {
+export const LabelsLegend: React.FC<LabelsLegendProps> = ({ labels }) => {
   const labelsEntries = Object.entries(labels)
 
   if (labelsEntries.length === 0) return <></>
@@ -23,5 +23,3 @@ const LabelsLegend: React.FC<LabelsLegendProps> = ({ labels }) => {
     </S.Wrapper>
   )
 }
-
-export default LabelsLegend

packages/web/src/components/Loader/index.tsx

@@ -1,6 +1,6 @@
 import * as S from './styles'
 
-const Loader: React.FC = () => {
+export const Loader: React.FC = () => {
   return (
     <S.Wrapper>
       <div></div>
@@ -9,5 +9,3 @@ const Loader: React.FC = () => {
     </S.Wrapper>
   )
 }
-
-export default Loader

packages/web/src/components/ModifiersTooltip/styles.ts

@@ -1,5 +1,5 @@
 import styled from 'styled-components'
-import Tooltip from 'components/Tooltip'
+import { Tooltip } from 'components/Tooltip'
 
 type WidgetProps = {
   color?: string

packages/web/src/components/Text/index.tsx

@@ -1,9 +1,8 @@
 import React from 'react'
+
 import * as S from './styles'
 import { ValidHtmlTextTags } from './types'
 
-export * as TextStyles from './styles'
-
 export type TextVariants =
   | 'default'
   | 'title'

packages/web/src/components/Text/stories.tsx

@@ -1,4 +1,5 @@
 import React from 'react'
+
 import { ComponentStory, ComponentMeta } from '@storybook/react'
 
 import { Text } from '.'

packages/web/src/components/Text/styles.ts

@@ -1,4 +1,5 @@
 import styled, { css, FlattenSimpleInterpolation } from 'styled-components'
+
 import { TextVariants } from '.'
 
 type VariantsDecorators = { [key in TextVariants]: FlattenSimpleInterpolation }

packages/web/src/components/Toolbar/index.tsx

@@ -1,6 +1,9 @@
-import { useRouter } from 'next/router'
 import React from 'react'
+
+import { useRouter } from 'next/router'
+
 import { IoMdArrowBack } from 'react-icons/io'
+
 import * as S from './styles'
 
 export interface ToolbarProps {

packages/web/src/components/Tooltip/index.tsx

@@ -1,4 +1,5 @@
 import React from 'react'
+
 import * as S from './styles'
 
 export interface TooltipProps {
@@ -8,7 +9,7 @@ export interface TooltipProps {
   position?: 'top' | 'bottom'
 }
 
-const Tooltip = ({
+export const Tooltip = ({
   className,
   children,
   text,
@@ -22,5 +23,3 @@ const Tooltip = ({
     </S.Wrapper>
   )
 }
-
-export default Tooltip

packages/web/src/components/Tooltip/stories.tsx

@@ -1,5 +1,6 @@
 import { Story, Meta } from '@storybook/react/types-6-0'
-import Tooltip, { TooltipProps } from '.'
+
+import { Tooltip, TooltipProps } from '.'
 
 export default {
   title: 'Tooltip',

packages/web/src/components/index.ts

@@ -0,0 +1,11 @@
+export * from './AlertBanner'
+export * from './AutoComplete'
+export * from './BusSchedule'
+export * from './Dialog'
+export * from './Footer'
+export * from './LabelsLegend'
+export * from './Loader'
+export * from './ModifiersTooltip'
+export * from './Text'
+export * from './Toolbar'
+export * from './Tooltip'

packages/web/src/configs/index.ts

@@ -0,0 +1,11 @@
+export const configs = {
+  busValues: {
+    external_bus_value: 'R$ 7,65',
+
+    internal_bus_value: 'R$ 5,30',
+    internal_integration_value: 'R$ 2,35',
+
+    municipal_bus_value: 'R$ 4,25',
+    municipal_integration_value: 'R$ 3,40'
+  }
+}

packages/web/src/pages/404.tsx

@@ -1,7 +1,9 @@
-import Loader from 'components/Loader'
-import { useRouter } from 'next/router'
 import { useEffect } from 'react'
 
+import { useRouter } from 'next/router'
+
+import { Loader } from 'components'
+
 export default function Page404() {
   const router = useRouter()
 

packages/web/src/pages/500.tsx

@@ -1,7 +1,9 @@
-import Loader from 'components/Loader'
-import { useRouter } from 'next/router'
 import { useEffect } from 'react'
 
+import { useRouter } from 'next/router'
+
+import { Loader } from 'components'
+
 export default function Page500() {
   const router = useRouter()
 

packages/web/src/pages/_app.tsx

@@ -1,9 +1,9 @@
 import { AppProps } from 'next/app'
 import Head from 'next/head'
 
-import GlobalStyles from 'styles/global'
+import { GlobalStyles } from 'styles/global'
 
-function App({ Component, pageProps }: AppProps) {
+export default function App({ Component, pageProps }: AppProps) {
   return (
     <>
       <Head>
@@ -22,5 +22,3 @@ function App({ Component, pageProps }: AppProps) {
     </>
   )
 }
-
-export default App

packages/web/src/pages/_document.tsx

@@ -5,6 +5,7 @@ import Document, {
   NextScript,
   DocumentContext
 } from 'next/document'
+
 import { ServerStyleSheet } from 'styled-components'
 
 export default class MyDocument extends Document {

packages/web/src/pages/index.tsx

@@ -1,3 +1,3 @@
-import HomePage from 'screens/home'
+import { HomePage } from 'screens'
 
 export default HomePage

packages/web/src/pages/linhas/[id].tsx

@@ -1,7 +1,4 @@
-import {
-  BusScheduleDetailsPage,
-  getServerSideProps
-} from 'screens/bus-schedule-details'
+import { BusScheduleDetailsPage, getServerSideProps } from 'screens'
 
 export { getServerSideProps }
 

packages/web/src/pages/politicas-de-privacidade/index.tsx

@@ -1,3 +1,3 @@
-import PrivacyPoliciesPage from 'screens/privacy-policies'
+import { PrivacyPoliciesPage } from 'screens'
 
 export default PrivacyPoliciesPage