diff --git a/starsky/starsky/clientapp/src/components/molecules/archive-sidebar/archive-sidebar-label-edit-search-replace.tsx b/starsky/starsky/clientapp/src/components/molecules/archive-sidebar/archive-sidebar-label-edit-search-replace.tsx
index 732ec68b6f..f82b301661 100644
--- a/starsky/starsky/clientapp/src/components/molecules/archive-sidebar/archive-sidebar-label-edit-search-replace.tsx
+++ b/starsky/starsky/clientapp/src/components/molecules/archive-sidebar/archive-sidebar-label-edit-search-replace.tsx
@@ -91,6 +91,58 @@ const ArchiveSidebarLabelEditSearchReplace: React.FunctionComponent = () => {
   /**
    * To search and replace
    */
+  function prepareBodyParams(selectPaths: string) {
+    const bodyParams = new URLSearchParams();
+    bodyParams.append("f", selectPaths);
+    bodyParams.append(
+      "collections",
+      state.pageType !== PageType.Search
+        ? (
+            new URLPath().StringToIUrl(history.location.search).collections !==
+            false
+          ).toString()
+        : "false"
+    );
+    return bodyParams;
+  }
+
+  function handleFetchPostResponse(anyData: any) {
+    const result = new CastToInterface().InfoFileIndexArray(anyData.data);
+    result.forEach((element) => {
+      if (element.status === IExifStatus.ReadOnly)
+        setIsError(MessageErrorReadOnly);
+      if (element.status === IExifStatus.NotFoundSourceMissing)
+        setIsError(MessageErrorNotFoundSourceMissing);
+      if (
+        element.status === IExifStatus.Ok ||
+        element.status === IExifStatus.Deleted
+      ) {
+        dispatch({
+          type: "update",
+          ...element,
+          select: [element.fileName]
+        });
+      }
+    });
+
+    // loading + update button
+    setIsLoading(false);
+    setInputEnabled(true);
+    // undo error message when success
+    if (isError === MessageErrorGenericFail) {
+      setIsError("");
+    }
+
+    ClearSearchCache(history.location.search);
+  }
+
+  function handleFetchPostError() {
+    setIsError(MessageErrorGenericFail);
+    // loading + update button
+    setIsLoading(false);
+    setInputEnabled(true);
+  }
+
   function pushSearchAndReplace() {
     // loading + update button
     setIsLoading(true);
@@ -109,17 +161,7 @@ const ArchiveSidebarLabelEditSearchReplace: React.FunctionComponent = () => {
 
     if (selectPaths.length === 0) return;
 
-    const bodyParams = new URLSearchParams();
-    bodyParams.append("f", selectPaths);
-    bodyParams.append(
-      "collections",
-      state.pageType !== PageType.Search
-        ? (
-            new URLPath().StringToIUrl(history.location.search).collections !==
-            false
-          ).toString()
-        : "false"
-    );
+    const bodyParams = prepareBodyParams(selectPaths);
 
     for (const key of Object.entries(update)) {
       const fieldName = key[0];
@@ -140,48 +182,12 @@ const ArchiveSidebarLabelEditSearchReplace: React.FunctionComponent = () => {
         bodyParams.set("replace", replaceValue);
 
         FetchPost(new UrlQuery().UrlReplaceApi(), bodyParams.toString())
-          .then((anyData) => {
-            const result = new CastToInterface().InfoFileIndexArray(
-              anyData.data
-            );
-            result.forEach((element) => {
-              if (element.status === IExifStatus.ReadOnly)
-                setIsError(MessageErrorReadOnly);
-              if (element.status === IExifStatus.NotFoundSourceMissing)
-                setIsError(MessageErrorNotFoundSourceMissing);
-              if (
-                element.status === IExifStatus.Ok ||
-                element.status === IExifStatus.Deleted
-              ) {
-                dispatch({
-                  type: "update",
-                  ...element,
-                  select: [element.fileName]
-                });
-              }
-            });
-
-            // loading + update button
-            setIsLoading(false);
-            setInputEnabled(true);
-            // undo error message when success
-            if (isError === MessageErrorGenericFail) {
-              setIsError("");
-            }
-
-            ClearSearchCache(history.location.search);
-          })
-          .catch(() => {
-            setIsError(MessageErrorGenericFail);
-            // loading + update button
-            setIsLoading(false);
-            setInputEnabled(true);
-          });
+          .then(handleFetchPostResponse)
+          .catch(handleFetchPostError);
       }
     }
   }
 
-  // noinspection HtmlUnknownAttribute
   return (
     <>
       {isError !== "" ? (
diff --git a/starsky/starsky/clientapp/src/components/organisms/menu-archive/menu-archive.tsx b/starsky/starsky/clientapp/src/components/organisms/menu-archive/menu-archive.tsx
index 7ca771daca..d47431677a 100644
--- a/starsky/starsky/clientapp/src/components/organisms/menu-archive/menu-archive.tsx
+++ b/starsky/starsky/clientapp/src/components/organisms/menu-archive/menu-archive.tsx
@@ -8,14 +8,11 @@ import useHotKeys from "../../../hooks/use-keyboard/use-hotkeys";
 import useLocation from "../../../hooks/use-location/use-location";
 import { newIFileIndexItemArray } from "../../../interfaces/IFileIndexItem";
 import localization from "../../../localization/localization.json";
-import { FileListCache } from "../../../shared/filelist-cache";
 import { Language } from "../../../shared/language";
 import { GetArchiveSearchMenuHeaderClass } from "../../../shared/menu/get-archive-search-menu-header-class";
 import { Select } from "../../../shared/select";
 import { Sidebar } from "../../../shared/sidebar";
 import { URLPath } from "../../../shared/url-path";
-import { UrlQuery } from "../../../shared/url-query";
-import DropArea from "../../atoms/drop-area/drop-area";
 import HamburgerMenuToggle from "../../atoms/hamburger-menu-toggle/hamburger-menu-toggle";
 import MenuOption from "../../atoms/menu-option/menu-option";
 import MoreMenu from "../../atoms/more-menu/more-menu";
@@ -34,6 +31,7 @@ import ModalDisplayOptions from "../modal-display-options/modal-display-options"
 import ModalDownload from "../modal-download/modal-download";
 import ModalPublishToggleWrapper from "../modal-publish/modal-publish-toggle-wrapper";
 import NavContainer from "../nav-container/nav-container";
+import { UploadMenuItem } from "./shared/upload-menu-item";
 
 interface IMenuArchiveProps {}
 
@@ -105,30 +103,6 @@ const MenuArchive: React.FunctionComponent<IMenuArchiveProps> = memo(() => {
     newIFileIndexItemArray()
   );
 
-  const UploadMenuItem = () => {
-    if (readOnly)
-      return (
-        <li data-test="upload" className="menu-option disabled">
-          Upload
-        </li>
-      );
-    return (
-      <li className="menu-option menu-option--input">
-        <DropArea
-          callback={(add) => {
-            new FileListCache().CacheCleanEverything();
-            setDropAreaUploadFilesList(add);
-            dispatch({ type: "add", add });
-          }}
-          endpoint={new UrlQuery().UrlUploadApi()}
-          folderPath={state.subPath}
-          enableInputButton={true}
-          enableDragAndDrop={true}
-        />
-      </li>
-    );
-  };
-
   return (
     <>
       {/* Modal download */}
@@ -284,7 +258,14 @@ const MenuArchive: React.FunctionComponent<IMenuArchiveProps> = memo(() => {
                 set={setIsSynchronizeManuallyOpen}
                 localization={localization.MessageSynchronizeManually}
               />
-              {state ? <UploadMenuItem /> : null}
+              {state ? (
+                <UploadMenuItem
+                  readOnly={readOnly}
+                  setDropAreaUploadFilesList={setDropAreaUploadFilesList}
+                  dispatch={dispatch}
+                  state={state}
+                />
+              ) : null}
               <li
                 className={
                   !readOnly && state.subPath !== "/"
@@ -372,7 +353,14 @@ const MenuArchive: React.FunctionComponent<IMenuArchiveProps> = memo(() => {
                 set={setIsSynchronizeManuallyOpen}
                 localization={localization.MessageSynchronizeManually}
               />
-              {state ? <UploadMenuItem /> : null}
+              {state ? (
+                <UploadMenuItem
+                  readOnly={readOnly}
+                  setDropAreaUploadFilesList={setDropAreaUploadFilesList}
+                  dispatch={dispatch}
+                  state={state}
+                />
+              ) : null}
             </MoreMenu>
           ) : null}
 
diff --git a/starsky/starsky/clientapp/src/components/organisms/menu-archive/shared/upload-menu-item.tsx b/starsky/starsky/clientapp/src/components/organisms/menu-archive/shared/upload-menu-item.tsx
new file mode 100644
index 0000000000..d1a7f74c35
--- /dev/null
+++ b/starsky/starsky/clientapp/src/components/organisms/menu-archive/shared/upload-menu-item.tsx
@@ -0,0 +1,44 @@
+import { ArchiveAction } from "../../../../contexts/archive-context";
+import { IArchiveProps } from "../../../../interfaces/IArchiveProps";
+import { IFileIndexItem } from "../../../../interfaces/IFileIndexItem";
+import { FileListCache } from "../../../../shared/filelist-cache";
+import { UrlQuery } from "../../../../shared/url-query";
+import DropArea from "../../../atoms/drop-area/drop-area";
+
+export interface IUploadMenuItemProps {
+  readOnly: boolean;
+  setDropAreaUploadFilesList: React.Dispatch<
+    React.SetStateAction<IFileIndexItem[]>
+  >;
+  dispatch: React.Dispatch<ArchiveAction>;
+  state: IArchiveProps;
+}
+
+export const UploadMenuItem: React.FunctionComponent<IUploadMenuItemProps> = ({
+  readOnly,
+  setDropAreaUploadFilesList,
+  dispatch,
+  state
+}) => {
+  if (readOnly)
+    return (
+      <li data-test="upload" className="menu-option disabled">
+        Upload
+      </li>
+    );
+  return (
+    <li className="menu-option menu-option--input">
+      <DropArea
+        callback={(add) => {
+          new FileListCache().CacheCleanEverything();
+          setDropAreaUploadFilesList(add);
+          dispatch({ type: "add", add });
+        }}
+        endpoint={new UrlQuery().UrlUploadApi()}
+        folderPath={state.subPath}
+        enableInputButton={true}
+        enableDragAndDrop={true}
+      />
+    </li>
+  );
+};