Initial dev for container copy

src/Explorer/ContainerCopy/MonitorCopyJobs/Components/CopyJobs.NotFound.tsx

@@ -0,0 +1,23 @@
+import { ActionButton, Image } from '@fluentui/react';
+import React, { useCallback } from 'react';
+import CopyJobIcon from "../../../../../images/ContainerCopy/copy-jobs.svg";
+import * as Actions from "../../Actions/CopyJobActions";
+import ContainerCopyMessages from '../../ContainerCopyMessages';
+
+interface CopyJobsNotFoundProps { }
+
+const CopyJobsNotFound: React.FC<CopyJobsNotFoundProps> = () => {
+
+    const handleCreateCopyJob = useCallback(Actions.openCreateCopyJobPanel, []);
+    return (
+        <div className='notFoundContainer flexContainer centerContent'>
+            <Image src={CopyJobIcon} alt={ContainerCopyMessages.noCopyJobsTitle} width={100} height={100} />
+            <h4 className='noCopyJobsMessage'>{ContainerCopyMessages.noCopyJobsTitle}</h4>
+            <ActionButton allowDisabledFocus className='createCopyJobButton' onClick={handleCreateCopyJob}>
+                {ContainerCopyMessages.createCopyJobButtonText}
+            </ActionButton>
+        </div>
+    );
+}
+
+export default CopyJobsNotFound;

src/Explorer/ContainerCopy/MonitorCopyJobs/MonitorCopyJobs.tsx

@@ -0,0 +1,14 @@
+import React from 'react';
+import CopyJobsNotFound from '../MonitorCopyJobs/Components/CopyJobs.NotFound';
+
+interface MonitorCopyJobsProps { }
+
+const MonitorCopyJobs: React.FC<MonitorCopyJobsProps> = () => {
+    return (
+        <div className='monitorCopyJobs flexContainer'>
+            <CopyJobsNotFound />
+        </div>
+    );
+}
+
+export default MonitorCopyJobs;