Merge pull request #283 from CivicDataLab/282-fix-bugs

sanjaypinna · web-flow · commit 63a3e85ca9e7 · 2025-07-14T12:45:32.000+05:30
282 fix bugs
diff --git a/app/[locale]/dashboard/[entityType]/[entitySlug]/dataset/[id]/edit/components/EditMetadata.tsx b/app/[locale]/dashboard/[entityType]/[entitySlug]/dataset/[id]/edit/components/EditMetadata.tsx
@@ -238,7 +238,7 @@ export function EditMetadata({ id }: { id: string }) {
           setFormData(updatedData);
           setPreviousFormData(updatedData);
         } else {
-           toast(
+          toast(
             'Error: ' +
               (res.addUpdateDatasetMetadata?.errors?.fieldErrors
                 ? res.addUpdateDatasetMetadata?.errors?.fieldErrors[0]
@@ -322,51 +322,79 @@ export function EditMetadata({ id }: { id: string }) {
   };
 
   const handleSave = (updatedData: any) => {
-    if (JSON.stringify(updatedData) !== JSON.stringify(previousFormData)) {
-      setPreviousFormData(updatedData);
+    const changedFields: any = {};
 
-      const transformedValues = Object.keys(updatedData)?.reduce(
-        (acc: any, key) => {
-          acc[key] = Array.isArray(updatedData[key])
-            ? updatedData[key]
-                .map((item: any) => item?.value || item)
-                .join(', ')
-            : updatedData[key];
-          return acc;
-        },
-        {}
-      );
+    for (const key in updatedData) {
+      const newValue = updatedData[key];
+      const prevValue = previousFormData[key];
 
-      updateMetadataMutation.mutate({
-        UpdateMetadataInput: {
-          dataset: id,
-          metadata: [
-            ...Object.keys(transformedValues)
-              .filter(
-                (valueItem) =>
-                  ![
-                    'sectors',
-                    'description',
-                    'tags',
-                    'isPublic',
-                    'license',
-                  ].includes(valueItem) && transformedValues[valueItem] !== ''
-              )
-              .map((key) => {
-                return {
-                  id: key,
-                  value: transformedValues[key],
-                };
-              }),
-          ],
-          ...(updatedData.license && { license: updatedData.license }),
-          accessType: updatedData.accessType || 'PUBLIC',
-          description: updatedData.description || '',
-          tags: updatedData.tags?.map((item: any) => item.label) || [],
-          sectors: updatedData.sectors?.map((item: any) => item.value) || [],
-        },
-      });
+      const isArray = Array.isArray(newValue);
+
+      const normalize = (val: any) =>
+        isArray ? val?.map((item: any) => item?.value || item) : val;
+
+      const newNormalized = normalize(newValue);
+      const prevNormalized = normalize(prevValue);
+
+      const hasChanged = isArray
+        ? JSON.stringify(newNormalized) !== JSON.stringify(prevNormalized)
+        : newNormalized !== prevNormalized;
+
+      if (hasChanged) {
+        changedFields[key] = newValue;
+      }
     }
+
+    // Exit early if nothing changed
+    if (Object.keys(changedFields).length === 0) return;
+
+    setPreviousFormData(updatedData); // Update local copy
+
+    const transformedValues = Object.keys(changedFields).reduce(
+      (acc: any, key) => {
+        acc[key] = Array.isArray(changedFields[key])
+          ? changedFields[key]
+              .map((item: any) => item?.value || item)
+              .join(', ')
+          : changedFields[key];
+        return acc;
+      },
+      {}
+    );
+
+    updateMetadataMutation.mutate({
+      UpdateMetadataInput: {
+        dataset: id,
+        metadata: Object.keys(transformedValues)
+          .filter(
+            (key) =>
+              ![
+                'sectors',
+                'description',
+                'tags',
+                'isPublic',
+                'license',
+              ].includes(key) && transformedValues[key] !== ''
+          )
+          .map((key) => ({
+            id: key,
+            value: transformedValues[key],
+          })),
+        ...(changedFields.license && { license: changedFields.license }),
+        ...(changedFields.accessType && {
+          accessType: changedFields.accessType,
+        }),
+        ...(changedFields.description !== undefined && {
+          description: changedFields.description,
+        }),
+        ...(changedFields.tags && {
+          tags: changedFields.tags.map((item: any) => item.label),
+        }),
+        ...(changedFields.sectors && {
+          sectors: changedFields.sectors.map((item: any) => item.value),
+        }),
+      },
+    });
   };
 
   function renderInputField(metadataFormItem: any) {
@@ -522,7 +550,7 @@ export function EditMetadata({ id }: { id: string }) {
                     name="description"
                     label="Description *"
                     value={formData.description}
-                    helpText="Character limit: 1000"
+                    helpText={`Character limit: ${formData?.description?.length}/1000`}
                     onChange={(e) => handleChange('description', e)}
                     onBlur={() => handleSave(formData)} // Save on blur
                   />
diff --git a/app/[locale]/dashboard/[entityType]/[entitySlug]/dataset/[id]/edit/resources/components/EditResource.tsx b/app/[locale]/dashboard/[entityType]/[entitySlug]/dataset/[id]/edit/resources/components/EditResource.tsx
@@ -94,17 +94,29 @@ export const EditResource = ({ refetch, allResources }: EditProps) => {
   const [schema, setSchema] = React.useState<any>([]);
 
   const resourceDetailsQuery = useQuery<any>(
-    [`fetch_resource_details_${resourceId}`],
-    () =>
-      GraphQL(
+    // Use a stable key when resourceId is empty/invalid
+    resourceId && resourceId.trim()
+      ? [`fetch_resource_details_${resourceId}`]
+      : ['fetch_resource_details_disabled'],
+    () => {
+      if (!resourceId || !resourceId.trim()) {
+        // Return a rejected promise or throw an error to prevent execution
+        return Promise.reject(new Error('No resource ID provided'));
+      }
+      return GraphQL(
         resourceDetails,
         {
           [params.entityType]: params.entitySlug,
         },
         { resourceId: resourceId }
-      ),
+      );
+    },
     {
-      enabled: !!resourceId,
+      enabled: !!(resourceId && resourceId.trim()),
+      // Prevent retries when there's no resourceId
+      retry: false,
+      // Don't refetch when resourceId is empty
+      refetchOnWindowFocus: !!(resourceId && resourceId.trim()),
     }
   );
 
@@ -213,9 +225,9 @@ export const EditResource = ({ refetch, allResources }: EditProps) => {
     columns: [],
   });
 
-  // useEffect(() => {
-  //   resourceDetailsQuery.refetch();
-  // }, []);
+  useEffect(() => {
+    resourceDetailsQuery.refetch();
+  }, []);
 
   React.useEffect(() => {
     const ResourceData = resourceDetailsQuery.data?.resourceById;
@@ -232,14 +244,12 @@ export const EditResource = ({ refetch, allResources }: EditProps) => {
     });
   }, [resourceDetailsQuery.data]);
 
-
   useEffect(() => {
     const schemaData = resourceDetailsQuery.data?.resourceById?.schema;
     if (schemaData && Array.isArray(schemaData)) {
       setSchema(schemaData);
     }
   }, [resourceDetailsQuery.data]);
-  
 
   const handleResourceChange = (e: any) => {
     setResourceId(e, { shallow: false });
@@ -378,6 +388,7 @@ export const EditResource = ({ refetch, allResources }: EditProps) => {
                 <TextField
                   value={resourceName}
                   onChange={(text) => setResourceName(text)}
+                  helpText={`Character limit: ${resourceName?.length}/200`}
                   onBlur={saveResource}
                   multiline={2}
                   label="Data File Name"
diff --git a/app/[locale]/dashboard/[entityType]/[entitySlug]/dataset/[id]/edit/resources/components/ResourceDropzone.tsx b/app/[locale]/dashboard/[entityType]/[entitySlug]/dataset/[id]/edit/resources/components/ResourceDropzone.tsx
@@ -58,7 +58,7 @@ export const ResourceDropzone = ({ reload }: { reload: () => void }) => {
       <Button kind="secondary" variant="interactive">
         Choose Files to Upload
       </Button>
-      <Text>Maximum File Size Limit : 25 MB</Text>
+      <Text>Maximum File Size Limit : 50 MB</Text>
       <div className="flex flex-wrap flex-row items-center gap-2">
       <Text variant="bodyMd" color="subdued">
           Supported File Types:
diff --git a/app/[locale]/dashboard/[entityType]/[entitySlug]/dataset/page.tsx b/app/[locale]/dashboard/[entityType]/[entitySlug]/dataset/page.tsx
@@ -14,6 +14,7 @@ import { Loading } from '@/components/loading';
 import { ActionBar } from './components/action-bar';
 import { Content } from './components/content';
 import { Navigation } from './components/navigate-org-datasets';
+import { formatDate } from '@/lib/utils';
 
 const allDatasetsQueryDoc: any = graphql(`
   query allDatasetsQuery($filters: DatasetFilter, $order: DatasetOrder) {
@@ -239,16 +240,8 @@ export default function DatasetPage({
       return {
         title: item.title,
         id: item.id,
-        created: new Date(item.created).toLocaleString('en-GB', {
-          day: '2-digit',
-          month: '2-digit',
-          year: 'numeric',
-        }),
-        modified: new Date(item.modified).toLocaleString('en-GB', {
-          day: '2-digit',
-          month: '2-digit',
-          year: 'numeric',
-        }),
+        created: formatDate(item.created),
+        modified: formatDate(item.modified),
       };
     });
   };
diff --git a/app/[locale]/dashboard/[entityType]/[entitySlug]/layout.tsx b/app/[locale]/dashboard/[entityType]/[entitySlug]/layout.tsx
@@ -24,16 +24,26 @@ export default function OrgDashboardLayout({ children }: DashboardLayoutProps) {
   const params = useParams<{ entityType: string; entitySlug: string }>();
   const { setEntityDetails, entityDetails, userDetails } = useDashboardStore();
 
-  const EntityDetailsQryRes: { data: any; isLoading: boolean; error: any } =
-    useQuery([`entity_details_${params.entityType}`], () =>
-      GraphQL(
-        params.entityType === 'organization' && getOrgDetailsQryDoc,
-        {
-          [params.entityType]: params.entitySlug,
-        },
-        { slug: params.entitySlug }
-      )
-    );
+  const EntityDetailsQryRes: {
+    data: any;
+    isLoading: boolean;
+    error: any;
+    refetch: any;
+  } = useQuery([`entity_details_${params.entityType}`], () =>
+    GraphQL(
+      params.entityType === 'organization' && getOrgDetailsQryDoc,
+      {
+        [params.entityType]: params.entitySlug,
+      },
+      { slug: params.entitySlug }
+    )
+  );
+
+
+  useEffect(() => {
+    EntityDetailsQryRes.refetch();
+  }, []);
+
 
   useEffect(() => {
     if (EntityDetailsQryRes.data) {
diff --git a/app/[locale]/dashboard/[entityType]/[entitySlug]/usecases/edit/[id]/details/page.tsx b/app/[locale]/dashboard/[entityType]/[entitySlug]/usecases/edit/[id]/details/page.tsx
@@ -109,7 +109,7 @@ const Details = () => {
 
   const runningStatus = [
     {
-      label: 'Intitated',
+      label: 'Initiated',
       value: 'INITIATED',
     },
     {
@@ -230,7 +230,7 @@ const Details = () => {
           name="summary"
           value={formData.summary}
           multiline={7}
-          helpText="Character limit: 10000"
+          helpText={`Character limit: ${formData?.summary?.length}/10000`}
           onChange={(e) => handleChange('summary', e)}
           onBlur={() => handleSave(formData)}
         />
diff --git a/app/[locale]/dashboard/[entityType]/[entitySlug]/usecases/page.tsx b/app/[locale]/dashboard/[entityType]/[entitySlug]/usecases/page.tsx
@@ -9,6 +9,7 @@ import { Button, DataTable, Icon, IconButton, Text, toast } from 'opub-ui';
 import { twMerge } from 'tailwind-merge';
 
 import { GraphQL } from '@/lib/api';
+import { formatDate } from '@/lib/utils';
 import { Icons } from '@/components/icons';
 import { LinkButton } from '@/components/Link';
 import { Loading } from '@/components/loading';
@@ -184,14 +185,21 @@ export default function DatasetPage({
       header: 'Title',
       cell: ({ row }: any) =>
         navigationTab === 'published' ? (
-          <Text className="line-clamp-1 max-w-[280px]" title={row.original.title}>{row.original.title}</Text>
+          <Text
+            className="line-clamp-1 max-w-[280px]"
+            title={row.original.title}
+          >
+            {row.original.title}
+          </Text>
         ) : (
           <LinkButton
             kind="tertiary"
             size="medium"
             href={`/dashboard/${params.entityType}/${params.entitySlug}/usecases/edit/${row.original.id}/details`}
           >
-            <span className="line-clamp-1 max-w-[280px]">{row.original.title}</span>
+            <span className="line-clamp-1 max-w-[280px]">
+              {row.original.title}
+            </span>
           </LinkButton>
         ),
     },
@@ -235,16 +243,8 @@ export default function DatasetPage({
       return {
         title: item.title,
         id: item.id,
-        created: new Date(item.created).toLocaleString('en-GB', {
-          day: '2-digit',
-          month: '2-digit',
-          year: 'numeric',
-        }),
-        modified: new Date(item.modified).toLocaleString('en-GB', {
-          day: '2-digit',
-          month: '2-digit',
-          year: 'numeric',
-        }),
+        created: formatDate(item.created),
+        modified: formatDate(item.modified),
       };
     });
   };
diff --git a/app/[locale]/dashboard/[entityType]/page.tsx b/app/[locale]/dashboard/[entityType]/page.tsx
@@ -169,6 +169,7 @@ const Page = () => {
                           <div>
                             <TextField
                               label="Organization Name *"
+                              helpText={`Character limit: ${formData?.name?.length}/200`}
                               name="name"
                               value={formData.name}
                               onChange={(e) =>
@@ -328,7 +329,7 @@ const EntityCard = ({ entityItem, params }: any) => {
         </Link>
       </div>
       <div>
-        <Text variant="headingMd" className="text-center">
+        <Text variant="headingMd" className="text-center line-clamp-3" title={entityItem.name}>
           {entityItem.name}
         </Text>
       </div>
