Tampere · tkataja · Oct 26, 2023 · Oct 26, 2023
diff --git a/backend/src/router/projectObject.ts b/backend/src/router/projectObject.ts
@@ -10,6 +10,7 @@ import { TRPC } from '@backend/router';
 
 import { nonEmptyString } from '@shared/schema/common';
 import {
+  UpdateGeometry,
   UpdateProjectObject,
   UpsertProjectObject,
   dbProjectObjectSchema,
@@ -303,9 +304,48 @@ export async function upsertProjectObject(
   await updateObjectUsages(tx, { ...projectObject, id: upsertResult.id });
   await updateObjectRoles(tx, { ...projectObject, id: upsertResult.id });
 
+  if (projectObject.geom) {
+    updateProjectObjectGeometry(
+      tx,
+      {
+        id: upsertResult.id,
+        features: projectObject.geom,
+      },
+      userId
+    );
+  }
+
   return upsertResult;
 }
 
+async function updateProjectObjectGeometry(
+  tx: DatabaseTransactionConnection,
+  input: UpdateGeometry,
+  userId: string
+) {
+  const { id, features } = input;
+
+  await addAuditEvent(tx, {
+    eventType: 'projectObject.updateGeometry',
+    eventData: input,
+    eventUser: userId,
+  });
+
+  return tx.one(sql.type(updateGeometryResultSchema)`
+    WITH featureCollection AS (
+      SELECT ST_Collect(
+        ST_GeomFromGeoJSON(value->'geometry')
+      ) AS resultGeom
+      FROM jsonb_array_elements(${features}::jsonb)
+    )
+    UPDATE app.project_object
+    SET geom = featureCollection.resultGeom
+    FROM featureCollection
+    WHERE id = ${id}
+    RETURNING id, ST_AsGeoJSON(geom) AS geom
+  `);
+}
+
 export const createProjectObjectRouter = (t: TRPC) =>
   t.router({
     upsert: t.procedure.input(upsertProjectObjectSchema).mutation(async ({ input, ctx }) => {
@@ -316,27 +356,8 @@ export const createProjectObjectRouter = (t: TRPC) =>
     }),
 
     updateGeometry: t.procedure.input(updateGeometrySchema).mutation(async ({ input, ctx }) => {
-      const { id, features } = input;
-
-      return getPool().transaction(async (tx) => {
-        await addAuditEvent(tx, {
-          eventType: 'projectObject.updateGeometry',
-          eventData: input,
-          eventUser: ctx.user.id,
-        });
-        return tx.one(sql.type(updateGeometryResultSchema)`
-          WITH featureCollection AS (
-            SELECT ST_Collect(
-              ST_GeomFromGeoJSON(value->'geometry')
-            ) AS resultGeom
-            FROM jsonb_array_elements(${features}::jsonb)
-          )
-          UPDATE app.project_object
-          SET geom = featureCollection.resultGeom
-          FROM featureCollection
-          WHERE id = ${id}
-          RETURNING id, ST_AsGeoJSON(geom) AS geom
-        `);
+      return await getPool().transaction(async (tx) => {
+        return await updateProjectObjectGeometry(tx, input, ctx.user.id);
       });
     }),
 

diff --git a/frontend/src/views/ProjectObject/ProjectObject.tsx b/frontend/src/views/ProjectObject/ProjectObject.tsx
@@ -3,7 +3,7 @@ import { Assignment, Euro, Map } from '@mui/icons-material';
 import { Box, Breadcrumbs, Chip, Paper, Tab, Tabs, Typography } from '@mui/material';
 import VectorLayer from 'ol/layer/Vector';
 import VectorSource from 'ol/source/Vector';
-import { ReactElement, useMemo } from 'react';
+import { ReactElement, useMemo, useState } from 'react';
 import { useParams } from 'react-router';
 import { Link } from 'react-router-dom';
 
@@ -82,6 +82,7 @@ export function ProjectObject(props: Props) {
     projectObjectId: string;
     tabView?: TabView;
   };
+
   const projectObjectId = routeParams?.projectObjectId;
   const tabView = routeParams.tabView || 'default';
   const tabs = projectObjectTabs(routeParams.projectId, props.projectType, projectObjectId);
@@ -95,6 +96,8 @@ export function ProjectObject(props: Props) {
     { enabled: Boolean(projectObjectId) }
   );
 
+  const [geom, setGeom] = useState<string | null>(null);
+
   const tr = useTranslations();
   const notify = useNotifications();
   const geometryUpdate = trpc.projectObject.updateGeometry.useMutation({
@@ -181,6 +184,7 @@ export function ProjectObject(props: Props) {
               projectId={routeParams.projectId}
               projectType={props.projectType}
               projectObject={projectObject.data}
+              geom={geom}
             />
           </Paper>
           {/* <Paper sx={{ p: 3 }} variant="outlined">
@@ -215,6 +219,7 @@ export function ProjectObject(props: Props) {
           >
             {tabs.map((tab) => (
               <Tab
+                disabled={!projectObject.data}
                 key={tab.tabView}
                 component={Link}
                 to={tab.url}
@@ -230,11 +235,15 @@ export function ProjectObject(props: Props) {
               <MapWrapper
                 geoJson={projectObject?.data?.geom}
                 drawStyle={PROJ_OBJ_STYLE}
-                editable={Boolean(projectObjectId)}
+                editable={true}
                 vectorLayers={[projectLayer]}
                 fitExtent="vectorLayers"
                 onFeaturesSaved={(features) => {
-                  geometryUpdate.mutate({ id: projectObjectId, features: features });
+                  if (!projectObject.data) {
+                    setGeom(features);
+                  } else {
+                    geometryUpdate.mutate({ id: projectObjectId, features });
+                  }
                 }}
               />
             </Box>

diff --git a/frontend/src/views/ProjectObject/ProjectObjectForm.tsx b/frontend/src/views/ProjectObject/ProjectObjectForm.tsx
@@ -1,7 +1,7 @@
 import { css } from '@emotion/react';
 import { zodResolver } from '@hookform/resolvers/zod';
 import { AddCircle, Edit, Save, Undo } from '@mui/icons-material';
-import { Box, Button, InputAdornment, TextField } from '@mui/material';
+import { Alert, Box, Button, InputAdornment, TextField } from '@mui/material';
 import { useQueryClient } from '@tanstack/react-query';
 import dayjs from 'dayjs';
 import { useAtomValue } from 'jotai';
@@ -25,7 +25,6 @@ import { SapWBSSelect } from '@frontend/views/ProjectObject/SapWBSSelect';
 import {
   UpsertProjectObject,
   newProjectObjectSchema,
-  updateProjectObjectSchema,
   upsertProjectObjectSchema,
 } from '@shared/schema/projectObject';
 
@@ -38,6 +37,7 @@ interface Props {
   projectId: string;
   projectType: ProjectTypePath;
   projectObject?: UpsertProjectObject | null;
+  geom?: string | null;
 }
 
 export function ProjectObjectForm(props: Props) {
@@ -138,7 +138,9 @@ export function ProjectObjectForm(props: Props) {
     },
   });
 
-  const onSubmit = (data: UpsertProjectObject) => projectObjectUpsert.mutate(data);
+  const onSubmit = (data: UpsertProjectObject) => {
+    projectObjectUpsert.mutate({ ...data, geom: props.geom });
+  };
 
   return (
     <FormProvider {...form}>
@@ -330,17 +332,24 @@ export function ProjectObjectForm(props: Props) {
         />
 
         {!props.projectObject && (
-          <Button
-            disabled={!form.formState.isValid}
-            type="submit"
-            sx={{ mt: 2 }}
-            variant="contained"
-            color="primary"
-            size="small"
-            endIcon={<AddCircle />}
-          >
-            {tr('projectObjectForm.createBtnLabel')}
-          </Button>
+          <>
+            {(!props.geom || props.geom === '[]') && (
+              <Alert sx={{ mt: 1 }} severity="info">
+                {tr('projectObjectForm.infoNoGeom')}
+              </Alert>
+            )}
+            <Button
+              disabled={!form.formState.isValid}
+              type="submit"
+              sx={{ mt: 2 }}
+              variant="contained"
+              color="primary"
+              size="small"
+              endIcon={<AddCircle />}
+            >
+              {tr('projectObjectForm.createBtnLabel')}
+            </Button>
+          </>
         )}
 
         {props.projectObject && editing && (

diff --git a/shared/src/language/fi.json b/shared/src/language/fi.json
@@ -232,6 +232,7 @@
   "projectObject.notifyGeometryUpdateTitle": "Kohteen sijainti päivitetty",
   "projectObject.notifyGeometryUpdateFailedTitle": "Virhe tallentaessa kohteen sijaintia",
   "projectObject.noTasks": "Kohteella ei ole tehtäviä",
+  "projectObjectForm.infoNoGeom": "Olet luomassa kohdetta ilman aluetta",
   "projectObjectForm.createBtnLabel": "Luo kohde",
   "projectObjectForm.saveBtnLabel": "Tallenna",
   "sessionExpiredWarning.infoText": "Istuntosi on vanhentunut. Jatkaaksesi keskeneräisiä töitäsi, uusi istunto.",

diff --git a/shared/src/schema/projectObject.ts b/shared/src/schema/projectObject.ts
@@ -29,6 +29,7 @@ export const newProjectObjectSchema = z.object({
   height: z.coerce.number().optional().nullable(),
   objectUserRoles: z.array(projectObjectUserRoleSchema),
   budgetUpdate: partialBudgetUpdateSchema.optional().nullable(),
+  geom: z.string().optional().nullable(),
 });
 
 export const updateProjectObjectSchema = newProjectObjectSchema.partial().extend({