mister-webdev / movie-app

src/app/Routes.tsx

import { Outlet, MakeGenerics, ReactLocation, Router } from 'react-location'
import { Main } from 'pages'
import { Header } from 'shared/ui'
import { ErrorBoundary } from 'entities/ErrorBoundary'

import { fetchMovieDetails } from 'pages/movie/model'

import { IMovieDetails } from 'types/common'

export type LocationGenerics = MakeGenerics<{
  LoaderData: { movie: IMovieDetails }
}>

const location = new ReactLocation<LocationGenerics>()

const Routes = () => (

Function component is not a function declaration

  <>

Fragments should contain more than one child - otherwise, there‘s no need for a Fragment at all.

Expected indentation of 4 space characters but found 2.

JSX not allowed in files with extension '.tsx'

    <Router

Expected indentation of 6 space characters but found 4.

      location={location}

Expected indentation of 8 space characters but found 6.

      routes={[

Expected indentation of 8 space characters but found 6.

JSX attribute values should not contain Arrays created in the same scope

        { path: '/', element: <Main /> },
        {
          path: 'movie',
          children: [
            {
              path: ':movieId',
              element: () => import('pages/movie').then(mod => <mod.default />),

Declare this component outside parent component "Routes" or memoize it. If you want to allow component creation in props, set allowAsProps option to true.

              loader: async ({ params: { movieId } }) => {
                return {
                  movie: await fetchMovieDetails(Number(movieId)),
                }
              },
            },
          ],
        },
      ]}
    >
      <Header />

Expected indentation of 8 space characters but found 6.

      <ErrorBoundary>

Expected indentation of 8 space characters but found 6.

JSX element should start in a new line

        <Outlet />

Expected indentation of 10 space characters but found 8.

      </ErrorBoundary>
    </Router>
  </>
)

export { Routes }