feat: Add update project button

finnishtransportagency · May 5, 2022 · 59ca0d5 · 59ca0d5
1 parent 2dd28d1
commit 59ca0d5
Show file tree

Hide file tree

Showing 2 changed files with 43 additions and 5 deletions.
diff --git a/src/components/projekti/ProjektiPageLayout.tsx b/src/components/projekti/ProjektiPageLayout.tsx
@@ -1,18 +1,44 @@
 import Notification, { NotificationType } from "@components/notification/Notification";
+import { api } from "@services/api";
+import Button from "@components/button/Button";
 import { useRouter } from "next/router";
-import React, { ReactElement, ReactNode } from "react";
+import React, { useState, ReactElement, ReactNode } from "react";
 import useProjekti from "src/hooks/useProjekti";
 import ProjektiSideNavigation from "./ProjektiSideNavigation";
+import useSnackbars from "src/hooks/useSnackbars";
+import log from "loglevel";
+import { Stack } from "@mui/material";
+import HassuSpinner from "@components/HassuSpinner";
 
 interface Props {
   children: ReactNode;
   title: string;
+  showUpdateButton?: boolean
 }
 
-export default function ProjektiPageLayout({ children, title }: Props): ReactElement {
+export default function ProjektiPageLayout({ children, title, showUpdateButton }: Props): ReactElement {
   const router = useRouter();
   const oid = typeof router.query.oid === "string" ? router.query.oid : undefined;
-  const { data: projekti } = useProjekti(oid);
+  const { data: projekti, mutate: reloadProjekti } = useProjekti(oid);
+  const [loading, setLoading] = useState(false);
+
+  const { showSuccessMessage, showErrorMessage } = useSnackbars();
+
+  const uudelleenLataaProjekit = async () => {
+    if (projekti?.oid) {
+      try {
+        setLoading(true);
+        await api.synkronoiProjektiMuutoksetVelhosta(projekti.oid);
+        await reloadProjekti();
+        setLoading(false);
+        showSuccessMessage("Projekti päivitetty");
+      } catch (e) {
+        setLoading(false);
+        log.log("realoadProjekti Error", e);
+        showErrorMessage("Päivittämisessä tapahtui virhe!");
+      }
+    }
+  }
 
   return (
     <section>
@@ -21,7 +47,18 @@ export default function ProjektiPageLayout({ children, title }: Props): ReactEle
           <ProjektiSideNavigation />
         </div>
         <div className="md:col-span-6 lg:col-span-8 xl:col-span-9">
-          <h1>{title}</h1>
+          <Stack
+            sx={{ marginBottom: { xs: 3, sm: 0 } }}
+            alignItems="flex-start"
+            justifyContent="space-between"
+            direction={{ xs: 'column', sm: 'row' }}
+            rowGap={0}
+          >
+            <h1>{title}</h1>
+            {showUpdateButton &&
+              <Button  onClick={uudelleenLataaProjekit}>Päivitä tiedot</Button>
+            }
+          </Stack>
           <h2>{projekti?.velho?.nimi || "-"}</h2>
           {projekti && !projekti?.nykyinenKayttaja.omaaMuokkausOikeuden && (
             <Notification type={NotificationType.WARN}>
@@ -31,6 +68,7 @@ export default function ProjektiPageLayout({ children, title }: Props): ReactEle
           )}
           {children}
         </div>
+        <HassuSpinner open={loading} />
       </div>
     </section>
   );

diff --git a/src/pages/yllapito/projekti/[oid]/index.tsx b/src/pages/yllapito/projekti/[oid]/index.tsx
@@ -187,7 +187,7 @@ export default function ProjektiSivu({ setRouteLabels }: PageProps) {
   }, [router.isReady, oid, projekti, setRouteLabels]);
 
   return (
-    <ProjektiPageLayout title={"Projektin tiedot"}>
+    <ProjektiPageLayout title={"Projektin tiedot"} showUpdateButton>
       <FormProvider {...useFormReturn}>
         <form onSubmit={handleSubmit(onSubmit)}>
           <fieldset style={{ display: "contents" }} disabled={disableFormEdit}>