no log: Group Series and Movies page to the same folder

frontend/src/App/Router.tsx

@@ -3,9 +3,8 @@ import { Redirect, Route, Switch, useHistory } from "react-router-dom";
 import { useDidMount } from "rooks";
 import { useIsRadarrEnabled, useIsSonarrEnabled } from "../@redux/hooks/site";
 import BlacklistRouter from "../Blacklist/Router";
+import DisplayItemRouter from "../DisplayItem/Router";
 import HistoryRouter from "../History/Router";
-import MovieRouter from "../Movies/Router";
-import SeriesRouter from "../Series/Router";
 import SettingRouter from "../Settings/Router";
 import EmptyPage, { RouterEmptyPath } from "../special-pages/404";
 import SystemRouter from "../System/Router";
@@ -40,16 +39,9 @@ const Router: FunctionComponent<{ className?: string }> = ({ className }) => {
         <Route exact path="/">
           <Redirect exact to={redirectPath}></Redirect>
         </Route>
-        {sonarr && (
-          <Route path="/series">
-            <SeriesRouter></SeriesRouter>
-          </Route>
-        )}
-        {radarr && (
-          <Route path="/movies">
-            <MovieRouter></MovieRouter>
-          </Route>
-        )}
+        <Route path={["/series", "/movies"]}>
+          <DisplayItemRouter></DisplayItemRouter>
+        </Route>
         <Route path="/wanted">
           <WantedRouter></WantedRouter>
         </Route>

frontend/src/DisplayItem/Episodes/index.tsx

@@ -23,9 +23,9 @@ import {
   SeriesUploadModal,
   useShowModal,
 } from "../../components";
-import ItemOverview from "../../generic/ItemOverview";
 import { RouterEmptyPath } from "../../special-pages/404";
 import { useOnLoadedOnce } from "../../utilites";
+import ItemOverview from "../generic/ItemOverview";
 import Table from "./table";
 
 interface Params {

frontend/src/DisplayItem/MovieDetail/index.tsx

@@ -26,9 +26,9 @@ import {
   useShowModal,
 } from "../../components";
 import { ManualSearchModal } from "../../components/modals/ManualSearchModal";
-import ItemOverview from "../../generic/ItemOverview";
 import { RouterEmptyPath } from "../../special-pages/404";
 import { useOnLoadedOnce } from "../../utilites";
+import ItemOverview from "../generic/ItemOverview";
 import Table from "./table";
 
 const download = (item: Item.Movie, result: SearchResultType) => {

frontend/src/DisplayItem/Movies/index.tsx

@@ -5,13 +5,13 @@ import React, { FunctionComponent, useMemo } from "react";
 import { Badge } from "react-bootstrap";
 import { Link } from "react-router-dom";
 import { Column } from "react-table";
-import { movieUpdateAll, movieUpdateByRange } from "../@redux/actions";
-import { useMovieEntities } from "../@redux/hooks";
-import { useReduxAction } from "../@redux/hooks/base";
-import { MoviesApi } from "../apis";
-import { ActionBadge, LanguageText, TextPopover } from "../components";
+import { movieUpdateAll, movieUpdateByRange } from "../../@redux/actions";
+import { useMovieEntities } from "../../@redux/hooks";
+import { useReduxAction } from "../../@redux/hooks/base";
+import { MoviesApi } from "../../apis";
+import { ActionBadge, LanguageText, TextPopover } from "../../components";
+import { BuildKey } from "../../utilites";
 import BaseItemView from "../generic/BaseItemView";
-import { BuildKey } from "../utilites";
 
 interface Props {}
 

frontend/src/DisplayItem/Router.tsx

@@ -0,0 +1,45 @@
+import React, { FunctionComponent } from "react";
+import { Redirect, Route, Switch } from "react-router-dom";
+import { useIsRadarrEnabled, useIsSonarrEnabled } from "../@redux/hooks";
+import { RouterEmptyPath } from "../special-pages/404";
+import Episodes from "./Episodes";
+import MovieDetail from "./MovieDetail";
+import Movies from "./Movies";
+import Series from "./Series";
+
+interface Props {}
+
+const Router: FunctionComponent<Props> = () => {
+  const radarr = useIsRadarrEnabled();
+  const sonarr = useIsSonarrEnabled();
+
+  return (
+    <Switch>
+      {radarr && (
+        <Route exact path="/movies">
+          <Movies></Movies>
+        </Route>
+      )}
+      {radarr && (
+        <Route path="/movies/:id">
+          <MovieDetail></MovieDetail>
+        </Route>
+      )}
+      {sonarr && (
+        <Route exact path="/series">
+          <Series></Series>
+        </Route>
+      )}
+      {sonarr && (
+        <Route path="/series/:id">
+          <Episodes></Episodes>
+        </Route>
+      )}
+      <Route path="*">
+        <Redirect to={RouterEmptyPath}></Redirect>
+      </Route>
+    </Switch>
+  );
+};
+
+export default Router;

frontend/src/DisplayItem/Series/index.tsx

@@ -3,13 +3,13 @@ import React, { FunctionComponent, useMemo } from "react";
 import { Badge, ProgressBar } from "react-bootstrap";
 import { Link } from "react-router-dom";
 import { Column } from "react-table";
-import { seriesUpdateAll, seriesUpdateByRange } from "../@redux/actions";
-import { useSerieEntities } from "../@redux/hooks";
-import { useReduxAction } from "../@redux/hooks/base";
-import { SeriesApi } from "../apis";
-import { ActionBadge } from "../components";
+import { seriesUpdateAll, seriesUpdateByRange } from "../../@redux/actions";
+import { useSerieEntities } from "../../@redux/hooks";
+import { useReduxAction } from "../../@redux/hooks/base";
+import { SeriesApi } from "../../apis";
+import { ActionBadge } from "../../components";
+import { BuildKey } from "../../utilites";
 import BaseItemView from "../generic/BaseItemView";
-import { BuildKey } from "../utilites";
 
 interface Props {}
 

frontend/src/DisplayItem/generic/BaseItemView/index.tsx

@@ -5,11 +5,11 @@ import React, { useCallback, useMemo, useState } from "react";
 import { Container, Dropdown, Row } from "react-bootstrap";
 import { Helmet } from "react-helmet";
 import { Column } from "react-table";
-import { useIsAnyTaskRunning } from "../../@modules/task/hooks";
-import { useLanguageProfiles } from "../../@redux/hooks";
-import { useAppDispatch } from "../../@redux/hooks/base";
-import { ContentHeader } from "../../components";
-import { GetItemId, isNonNullable } from "../../utilites";
+import { useIsAnyTaskRunning } from "../../../@modules/task/hooks";
+import { useLanguageProfiles } from "../../../@redux/hooks";
+import { useAppDispatch } from "../../../@redux/hooks/base";
+import { ContentHeader } from "../../../components";
+import { GetItemId, isNonNullable } from "../../../utilites";
 import Table from "./table";
 
 export interface SharedProps<T extends Item.Base> {

frontend/src/DisplayItem/generic/BaseItemView/table.tsx

@@ -2,16 +2,16 @@ import { uniqBy } from "lodash";
 import React, { useCallback, useMemo } from "react";
 import { TableOptions, TableUpdater, useRowSelect } from "react-table";
 import { SharedProps } from ".";
-import { useLanguageProfiles } from "../../@redux/hooks";
+import { useLanguageProfiles } from "../../../@redux/hooks";
 import {
   AsyncPageTable,
   ItemEditorModal,
   SimpleTable,
   useShowModal,
-} from "../../components";
-import { TableStyleProps } from "../../components/tables/BaseTable";
-import { useCustomSelection } from "../../components/tables/plugins";
-import { GetItemId, useEntityToList } from "../../utilites";
+} from "../../../components";
+import { TableStyleProps } from "../../../components/tables/BaseTable";
+import { useCustomSelection } from "../../../components/tables/plugins";
+import { GetItemId, useEntityToList } from "../../../utilites";
 
 interface Props<T extends Item.Base> extends SharedProps<T> {
   dirtyItems: readonly T[];

frontend/src/DisplayItem/generic/ItemOverview.tsx

@@ -22,9 +22,9 @@ import {
   Popover,
   Row,
 } from "react-bootstrap";
-import { useProfileBy, useProfileItemsToLanguages } from "../@redux/hooks";
-import { LanguageText } from "../components";
-import { BuildKey, isMovie } from "../utilites";
+import { useProfileBy, useProfileItemsToLanguages } from "../../@redux/hooks";
+import { LanguageText } from "../../components";
+import { BuildKey, isMovie } from "../../utilites";
 
 interface Props {
   item: Item.Base;

frontend/src/DisplayItem/generic/blacklist.tsx

@@ -1,7 +1,7 @@
 import { faFileExcel } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import React, { FunctionComponent } from "react";
-import { AsyncButton } from "../components";
+import { AsyncButton } from "../../components";
 
 interface Props {
   history: History.Base;

frontend/src/History/Movies/index.tsx

@@ -9,7 +9,7 @@ import { useMoviesHistory } from "../../@redux/hooks";
 import { useReduxAction } from "../../@redux/hooks/base";
 import { MoviesApi } from "../../apis";
 import { HistoryIcon, LanguageText, TextPopover } from "../../components";
-import { BlacklistButton } from "../../generic/blacklist";
+import { BlacklistButton } from "../../DisplayItem/generic/blacklist";
 import HistoryGenericView from "../generic";
 
 interface Props {}

frontend/src/History/Series/index.tsx

@@ -9,7 +9,7 @@ import { useSeriesHistory } from "../../@redux/hooks";
 import { useReduxAction } from "../../@redux/hooks/base";
 import { EpisodesApi } from "../../apis";
 import { HistoryIcon, LanguageText, TextPopover } from "../../components";
-import { BlacklistButton } from "../../generic/blacklist";
+import { BlacklistButton } from "../../DisplayItem/generic/blacklist";
 import HistoryGenericView from "../generic";
 
 interface Props {}

frontend/src/Movies/Router.tsx

@@ -1,21 +0,0 @@
-import React, { FunctionComponent } from "react";
-import { Route, Switch } from "react-router-dom";
-import Movie from ".";
-import MovieDetail from "./Detail";
-
-interface Props {}
-
-const Router: FunctionComponent<Props> = () => {
-  return (
-    <Switch>
-      <Route exact path="/movies">
-        <Movie></Movie>
-      </Route>
-      <Route path="/movies/:id">
-        <MovieDetail></MovieDetail>
-      </Route>
-    </Switch>
-  );
-};
-
-export default Router;

frontend/src/Series/Router.tsx

@@ -1,21 +0,0 @@
-import React, { FunctionComponent } from "react";
-import { Route, Switch } from "react-router-dom";
-import Series from ".";
-import Episodes from "./Episodes";
-
-interface Props {}
-
-const Router: FunctionComponent<Props> = () => {
-  return (
-    <Switch>
-      <Route exact path="/series">
-        <Series></Series>
-      </Route>
-      <Route path="/series/:id">
-        <Episodes></Episodes>
-      </Route>
-    </Switch>
-  );
-};
-
-export default Router;

frontend/src/components/modals/HistoryModal.tsx

@@ -3,7 +3,7 @@ import { Column } from "react-table";
 import { useDidUpdate } from "rooks";
 import { HistoryIcon, LanguageText, PageTable, TextPopover } from "..";
 import { EpisodesApi, MoviesApi, useAsyncRequest } from "../../apis";
-import { BlacklistButton } from "../../generic/blacklist";
+import { BlacklistButton } from "../../DisplayItem/generic/blacklist";
 import { AsyncOverlay } from "../async";
 import BaseModal, { BaseModalProps } from "./BaseModal";
 import { useModalPayload } from "./hooks";

frontend/src/components/modals/ItemEditorModal.tsx

@@ -22,9 +22,7 @@ const Editor: FunctionComponent<Props & BaseModalProps> = (props) => {
   );
 
   // TODO: Separate movies and series
-  const hasTask = useIsAnyTaskRunningWithId([
-    payload ? GetItemId(payload) : -1,
-  ]);
+  const hasTask = useIsAnyTaskRunningWithId([GetItemId(payload ?? {})]);
 
   const profileOptions = useMemo<SelectorOption<number>[]>(
     () =>