invalidate cost-surfaces query after upload

app/layout/project/sidebar/project/inventory-panel/cost-surfaces/modals/upload/index.tsx

@@ -2,6 +2,7 @@ import React, { useCallback, useEffect, useRef, useState } from 'react';
 
 import { useDropzone, DropzoneProps } from 'react-dropzone';
 import { Form as FormRFF, Field as FieldRFF, FormProps } from 'react-final-form';
+import { useQueryClient } from 'react-query';
 
 import { useRouter } from 'next/router';
 
@@ -51,6 +52,8 @@ export const CostSurfaceUploadModal = ({
 
   const { addToast } = useToasts();
 
+  const queryClient = useQueryClient();
+
   const uploadProjectCostSurfaceMutation = useUploadProjectCostSurface();
 
   const downloadShapefileTemplateMutation = useDownloadShapefileTemplate();
@@ -118,6 +121,7 @@ export const CostSurfaceUploadModal = ({
         {
           onSuccess: () => {
             setSuccessFile({ ...successFile });
+            queryClient.invalidateQueries(['cost-surfaces', pid]);
             onClose();
             addToast(
               'success-upload-cost-surface-file',
@@ -163,7 +167,7 @@ export const CostSurfaceUploadModal = ({
         }
       );
     },
-    [pid, addToast, onClose, uploadProjectCostSurfaceMutation, successFile]
+    [pid, addToast, onClose, uploadProjectCostSurfaceMutation, successFile, queryClient]
   );
 
   const { getRootProps, getInputProps, isDragActive, isDragAccept, isDragReject } = useDropzone({

app/layout/projects/show/map/legend/hooks/index.ts

@@ -290,7 +290,7 @@ export const useInventoryLegend = ({
             ]
           : []),
         {
-          name: 'Cost Surface',
+          name: 'Cost Surfacex',
           layers: useCostSurfaceLegend(),
         },
       ],

app/layout/projects/show/status/component.tsx

@@ -35,6 +35,7 @@ export const ProjectStatus = (): JSX.Element => {
   const { jobs = [] } = scenarioStatusData || {};
 
   // Jobs
+
   const JOBS = useProjectJobs(jobs);
 
   // Failure