move content

qdraw · Dec 14, 2023 · fb8ef34 · fb8ef34
1 parent 2e44e0b
commit fb8ef34
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 23 deletions.
diff --git a/starsky/starsky/clientapp/src/components/molecules/item-list-view/item-list-view.tsx b/starsky/starsky/clientapp/src/components/molecules/item-list-view/item-list-view.tsx
@@ -1,13 +1,9 @@
 import React, { memo, useEffect } from "react";
-import useGlobalSettings from "../../../hooks/use-global-settings";
 import useLocation from "../../../hooks/use-location/use-location";
 import { PageType } from "../../../interfaces/IDetailView";
 import { IFileIndexItem } from "../../../interfaces/IFileIndexItem";
 import { INavigateState } from "../../../interfaces/INavigateState";
-import localization from "../../../localization/localization.json";
-import { Language } from "../../../shared/language";
 import { URLPath } from "../../../shared/url-path";
-import { UrlQuery } from "../../../shared/url-query";
 import FlatListItem from "../../atoms/flat-list-item/flat-list-item";
 import ListImageChildItem from "../../atoms/list-image-child-item/list-image-child-item";
 import ListImageViewSelectContainer from "../list-image-view-select-container/list-image-view-select-container";
@@ -29,16 +25,6 @@ const ItemListView: React.FunctionComponent<ItemListProps> = memo((props) => {
   const history = useLocation();
   const folderRef = React.useRef<HTMLDivElement>(null);
 
-  // Content
-  const settings = useGlobalSettings();
-  const language = new Language(settings.language);
-  const MessageNoPhotosInFolder = language.key(
-    localization.MessageNoPhotosInFolder
-  );
-  const MessageNewUserNoPhotosInFolder = language.key(
-    localization.MessageNewUserNoPhotosInFolder
-  );
-
   useEffect(() => {
     const navigationState = history.location.state as INavigateState;
 
@@ -82,14 +68,6 @@ const ItemListView: React.FunctionComponent<ItemListProps> = memo((props) => {
         colorClassUsage={props.colorClassUsage}
       />
 
-      {props.pageType !== PageType.Loading &&
-      items.length === 0 &&
-      props.subPath === "/" ? (
-        <a className="warning-box" href={new UrlQuery().UrlPreferencesPage()}>
-          {MessageNewUserNoPhotosInFolder} {MessageNoPhotosInFolder}
-        </a>
-      ) : null}
-
       {items.map((item) => (
         <ListImageViewSelectContainer
           item={item}

diff --git a/...clientapp/src/components/molecules/item-list-view/shared/warning-box-no-photos-filter.tsx b/...clientapp/src/components/molecules/item-list-view/shared/warning-box-no-photos-filter.tsx
@@ -1,9 +1,10 @@
-import { memo } from "react";
+import React, { memo } from "react";
 import useGlobalSettings from "../../../../hooks/use-global-settings";
 import { PageType } from "../../../../interfaces/IDetailView";
 import { IFileIndexItem } from "../../../../interfaces/IFileIndexItem";
 import localization from "../../../../localization/localization.json";
 import { Language } from "../../../../shared/language";
+import { UrlQuery } from "../../../../shared/url-query.ts";
 
 interface IWarningBoxNoPhotosFilterProps {
   pageType: PageType | undefined;
@@ -24,6 +25,10 @@ export const WarningBoxNoPhotosFilter: React.FunctionComponent<IWarningBoxNoPhot
       localization.MessageItemsOutsideFilter
     );
 
+    const MessageNewUserNoPhotosInFolder = language.key(
+      localization.MessageNewUserNoPhotosInFolder
+    );
+
     let warningBox = null;
 
     if (
@@ -52,5 +57,18 @@ export const WarningBoxNoPhotosFilter: React.FunctionComponent<IWarningBoxNoPhot
       }
     }
 
+    // only on the home page there is a link to the preferences page
+    if (pageType !== PageType.Loading && subPath === "/") {
+      warningBox = (
+        <a
+          className="warning-box"
+          href={new UrlQuery().UrlPreferencesPage()}
+          data-test="list-view-no-photos-in-folder"
+        >
+          {MessageNewUserNoPhotosInFolder} {MessageNoPhotosInFolder}
+        </a>
+      );
+    }
+
     return <>{warningBox}</>;
   });