hook for copy

frontend/src/actions/projectActions.ts

@@ -12,7 +12,7 @@ import {TimesheetCheckAttachmentType} from '../models';
 import {authService} from '../components/users/authService';
 import {FullProjectMonthModel} from '../components/project/models/FullProjectMonthModel';
 
-export function saveProject(project: IProjectModel, navigate?: any, after: 'to-list' | 'to-details' = 'to-list') {
+export function saveProject(project: IProjectModel, navigate?: any, after: 'to-list' | 'to-details' = 'to-list', triggerCopy?: any) {
   return (dispatch: Dispatch) => {
     dispatch(busyToggle());
     return request
@@ -30,10 +30,7 @@ export function saveProject(project: IProjectModel, navigate?: any, after: 'to-l
           if (after === 'to-list') {
             navigate('/projects');
           } else {
-            // First navigate away?
-            // Workaround for EditProject not reloading the form
-            // when the url _id changes. Need a hook for this :)
-            navigate('/projects');
+            triggerCopy(response.body._id);
             navigate(`/projects/${response.body._id}`);
           }
         }

frontend/src/components/project/CopyProject.tsx

@@ -9,10 +9,11 @@ import {Modal} from '../controls/Modal';
 import {saveProject} from '../../actions/projectActions';
 import {ArrayInput} from '../controls/form-controls/inputs/ArrayInput';
 import {FullFormConfig} from '../../models';
-import { ContractStatus } from '../client/models/ContractModels';
+import {ContractStatus} from '../client/models/ContractModels';
 
 type CopyProjectProps = {
   projectToCopy: IProjectModel;
+  triggerCopy: any;
 }
 
 
@@ -25,7 +26,7 @@ export const copyProjectProperties: FullFormConfig = [
 ];
 
 
-export const CopyProject = ({projectToCopy}: CopyProjectProps) => {
+export const CopyProject = ({projectToCopy, triggerCopy}: CopyProjectProps) => {
   const [open, setOpen] = useState<boolean>(false);
   const defaultProject = {
     ...projectToCopy,
@@ -45,7 +46,7 @@ export const CopyProject = ({projectToCopy}: CopyProjectProps) => {
         <Modal
           show
           onClose={() => setOpen(false)}
-          onConfirm={() => dispatch(saveProject(project, history, 'to-details') as any)}
+          onConfirm={() => dispatch(saveProject(project, history, 'to-details', triggerCopy) as any)}
           title={t('project.copy.modalTitle')}
         >
           <div className="container">

frontend/src/components/project/EditProject.tsx

@@ -33,18 +33,23 @@ export const EditProject = () => {
   const navigate = useNavigate();
   const params = useParams();
   const model = useSelector((state: ConfacState) => state.projects.find(c => c._id === params.id));
+  console.log('retrieved model', model);
   const consultants = useSelector((state: ConfacState) => state.consultants);
   const [project, setProject] = useState<IProjectModel>(model || getNewProject());
   const consultant = useSelector((state: ConfacState) => state.consultants.find(x => x._id === project.consultantId) || getNewConsultant());
   const clients = useSelector((state: ConfacState) => state.clients);
   const client = useSelector((state: ConfacState) => state.clients.find(x => x._id === project.client.clientId) || getNewClient());
   const hasProjectMonths = useSelector((state: ConfacState) => state.projectsMonth.some(pm => pm.projectId === params.id));
   const [needsSync, setNeedsSync] = useState<{consultant: boolean, client: boolean}>({consultant: false, client: false});
+  const [copyId, setCopyId] = useState(0);
+  const useCopy = (id: number) => {
+    setCopyId(id);
+  }
 
   const docTitle = consultant._id ? 'projectEdit' : 'projectNew';
   useDocumentTitle(docTitle, {consultant: consultant.firstName, client: client.name});
-
-  if (model && !project._id) {
+  if (model && (!project._id || copyId !== 0)) {
+    setCopyId(0); //needs to be reset, otherwise page will go into render loop
     setProject(model);
   }
 
@@ -131,7 +136,7 @@ export const EditProject = () => {
       </Form>
       <StickyFooter claim={Claim.ManageProjects}>
         <ConfirmationButton
-        className="tst-confirm-delete-project"
+          className="tst-confirm-delete-project"
           onClick={() => dispatch(deleteProject(project._id, navigate) as any)}
           variant="danger"
           title={t('project.deleteConfirm.title')}
@@ -140,7 +145,7 @@ export const EditProject = () => {
         >
           {t('project.deleteConfirm.content')}
         </ConfirmationButton>
-        {project.endDate && project._id && <CopyProject projectToCopy={project} />}
+        {project.endDate && project._id && <CopyProject projectToCopy={project} triggerCopy={useCopy} />}
         <BusyButton className="tst-save-project" onClick={() => dispatch(saveProject(project, navigate) as any)} disabled={isButtonDisabled}>
           {t('save')}
         </BusyButton>