CivicDataLab · Abhishekfm · Aug 27, 2026
diff --git a/app/[locale]/(user)/datasets/[datasetIdentifier]/components/Resources/index.tsx b/app/[locale]/(user)/datasets/[datasetIdentifier]/components/Resources/index.tsx
@@ -5,19 +5,12 @@ import { useParams } from 'next/navigation';
 import PdfPreview from '@/app/[locale]/(user)/components/PdfPreview';
 import { graphql } from '@/gql';
 import { useQuery } from '@tanstack/react-query';
-import {
-  Button,
-  Dialog,
-  Format,
-  Icon,
-  Spinner,
-  Table,
-  Text,
-} from 'opub-ui';
+import { Button, Dialog, Format, Icon, Spinner, Table, Text } from 'opub-ui';
 
 import { GraphQL } from '@/lib/api';
 import { Icons } from '@/components/icons';
 import styles from './Resources.module.scss';
+
 const datasetResourceQuery: any = graphql(`
   query datasetResources($datasetId: UUID!) {
     datasetResources(datasetId: $datasetId) {
@@ -78,7 +71,11 @@ const Resources = () => {
                   View All Columns
                 </Button>
               </Dialog.Trigger>
-              <Dialog.Content title={'All Columns'} limitHeight className={styles.dialogTableWrapper}>
+              <Dialog.Content
+                title={'All Columns'}
+                limitHeight
+                className={styles.dialogTableWrapper}
+              >
                 <Table
                   columns={[
                     {
@@ -139,7 +136,9 @@ const Resources = () => {
               header: column,
               cell: ({ cell }: any) => {
                 const value = cell.getValue();
-                return <span>{value !== null ? value.toString() : 'N/A'}</span>;
+                return (
+                  <span>{value !== null ? value?.toString() : 'N/A'}</span>
+                );
               },
             })) || [];
 
@@ -164,7 +163,12 @@ const Resources = () => {
                   Preview
                 </Button>
               </Dialog.Trigger>
-              <Dialog.Content title={'Preview'} limitHeight large className={styles.dialogTableWrapper}>
+              <Dialog.Content
+                title={'Preview'}
+                limitHeight
+                large
+                className={styles.dialogTableWrapper}
+              >
                 {row.original.format === 'PDF' ? (
                   <PdfPreview
                     url={`${process.env.NEXT_PUBLIC_BACKEND_URL}/api/download/resource/${row.original.id}`}
@@ -210,7 +214,8 @@ const Resources = () => {
           <div className="flex flex-col gap-1">
             <Text variant="headingXl">Files in this Dataset </Text>
             <Text variant="bodyLg">
-              All files associated with this Dataset which can be downloaded{' '}
+              All files associated with this Dataset which can be
+              downloaded{' '}
             </Text>
           </div>
           <div>
@@ -221,8 +226,8 @@ const Resources = () => {
                   className="mt-5 flex flex-col gap-6 border-1 border-solid border-greyExtralight bg-surfaceDefault p-4 lg:mx-0 lg:p-6"
                 >
                   <div>
-                    <div className="flex flex-wrap md:flex-nowrap items-center justify-between gap-4">
-                      <div className="flex flex-wrap md:flex-nowrap items-center gap-2 ">
+                    <div className="flex flex-wrap items-center justify-between gap-4 md:flex-nowrap">
+                      <div className="flex flex-wrap items-center gap-2 md:flex-nowrap ">
                         {item.fileDetails?.format && (
                           <Format fileType={item.fileDetails?.format} />
                         )}

diff --git a/app/[locale]/dashboard/[entityType]/[entitySlug]/layout.tsx b/app/[locale]/dashboard/[entityType]/[entitySlug]/layout.tsx
@@ -28,22 +28,19 @@ export default function OrgDashboardLayout({ children }: DashboardLayoutProps) {
     isLoading: boolean;
     error: any;
     refetch: any;
-  } = useQuery([`entity_details_${params.entityType}`], () =>
-    GraphQL(
-      params.entityType === 'organization' && getOrgDetailsQryDoc,
-      {
-        [params.entityType]: params.entitySlug,
-      },
-      { slug: params.entitySlug }
-    )
+  } = useQuery(
+    [`entity_details_${params.entityType}`, params.entitySlug],
+    () =>
+      GraphQL(
+        getOrgDetailsQryDoc,
+        {
+          [params.entityType]: params.entitySlug,
+        },
+        { slug: params.entitySlug }
+      ),
+    { enabled: params.entityType === 'organization' }
   );
 
-
-  useEffect(() => {
-    EntityDetailsQryRes.refetch();
-  }, [EntityDetailsQryRes]);
-
-
   useEffect(() => {
     if (EntityDetailsQryRes.data) {
       setEntityDetails(EntityDetailsQryRes.data);

diff --git a/app/[locale]/dashboard/[entityType]/[entitySlug]/profile/userProfile.tsx b/app/[locale]/dashboard/[entityType]/[entitySlug]/profile/userProfile.tsx
@@ -35,9 +35,12 @@ const updateUserMutation: any = graphql(`
   }
 `);
 
-const githubRegex = /^https:\/\/github\.com\/[a-zA-Z0-9](?:[a-zA-Z0-9]|-(?=[a-zA-Z0-9])){0,38}$/;
-const linkedinRegex = /^https:\/\/(?:www\.)?linkedin\.com\/in\/[a-zA-Z0-9-]+\/?$/;
-const twitterRegex = /^https:\/\/(?:www\.)?(?:twitter\.com|x\.com)\/[a-zA-Z0-9_]+\/?$/;
+const githubRegex =
+  /^https:\/\/github\.com\/[a-zA-Z0-9](?:[a-zA-Z0-9]|-(?=[a-zA-Z0-9])){0,38}$/;
+const linkedinRegex =
+  /^https:\/\/(?:www\.)?linkedin\.com\/in\/[a-zA-Z0-9-]+\/?$/;
+const twitterRegex =
+  /^https:\/\/(?:www\.)?(?:twitter\.com|x\.com)\/[a-zA-Z0-9_]+\/?$/;
 
 const prettyField = (f: string) => {
   switch (f) {
@@ -160,16 +163,22 @@ const UserProfile = () => {
       toast('Please fill all the required fields');
       return;
     }
-   if (formData.githubProfile && !githubRegex.test(formData.githubProfile)) {
+    if (formData.githubProfile && !githubRegex.test(formData.githubProfile)) {
       toast.error('GitHub URL: Enter a valid URL.');
       return;
     }
-    if (formData.linkedinProfile && !linkedinRegex.test(formData.linkedinProfile)) {
-       toast.error('LinkedIn URL: Enter a valid URL.');
+    if (
+      formData.linkedinProfile &&
+      !linkedinRegex.test(formData.linkedinProfile)
+    ) {
+      toast.error('LinkedIn URL: Enter a valid URL.');
       return;
     }
-    if (formData.twitterProfile && !twitterRegex.test(formData.twitterProfile)) {
-       toast.error('Twitter URL: Enter a valid URL.');
+    if (
+      formData.twitterProfile &&
+      !twitterRegex.test(formData.twitterProfile)
+    ) {
+      toast.error('Twitter URL: Enter a valid URL.');
       return;
     }
 
@@ -208,7 +217,7 @@ const UserProfile = () => {
                   onChange={(e) => setFormData({ ...formData, firstName: e })}
                 />
               </div>
-              <div className="w-full">
+              <div className=" w-full">
                 <TextField
                   label="Last Name *"
                   name="lastName"
@@ -218,7 +227,7 @@ const UserProfile = () => {
               </div>
             </div>
 
-            <div className="w-full">
+            <div className=" w-full">
               <TextField
                 label="Email *"
                 disabled
@@ -227,7 +236,7 @@ const UserProfile = () => {
                 onChange={(e) => setFormData({ ...formData, email: e })}
               />
             </div>
-            <div className="w-full">
+            <div className=" w-full">
               <TextField
                 label="Location"
                 name="location"
@@ -264,7 +273,7 @@ const UserProfile = () => {
           </div>
         </div>
         <div className="flex w-full flex-col gap-4 lg:flex-row">
-          <div className="w-full">
+          <div className=" w-full">
             <TextField
               label="Bio *"
               name="bio"

diff --git a/app/[locale]/dashboard/[entityType]/[entitySlug]/schema.ts b/app/[locale]/dashboard/[entityType]/[entitySlug]/schema.ts
@@ -1,6 +1,6 @@
-import { graphql } from '@/gql';
+import gql from 'graphql-tag';
 
-export const getOrgDetailsQryDoc: any = graphql(`
+export const getOrgDetailsQryDoc: any = gql`
   query getOrgDetailsQry($slug: String) {
     organizations(slug: $slug) {
       id
@@ -24,9 +24,9 @@ export const getOrgDetailsQryDoc: any = graphql(`
       location
     }
   }
-`);
+`;
 
-export const UserDetailsQryDoc: any = graphql(`
+export const UserDetailsQryDoc: any = gql`
   query userDetails {
     me {
       bio
@@ -55,4 +55,4 @@ export const UserDetailsQryDoc: any = graphql(`
       }
     }
   }
-`);
+`;
diff --git a/app/[locale]/dashboard/components/CollaborativeSubdomainNav.tsx b/app/[locale]/dashboard/components/CollaborativeSubdomainNav.tsx
@@ -5,6 +5,8 @@ import Link from 'next/link';
 import { useParams } from 'next/navigation';
 import { Text } from 'opub-ui';
 
+import BhashiniTranslation from '@/components/BhashiniTranslation';
+
 type Props = {
   useCasesTargetId?: string;
   datasetsTargetId?: string;
@@ -86,6 +88,7 @@ export function CollaborativeSubdomainNav({
               Datasets
             </Text>
           </button>
+          <BhashiniTranslation />
         </div>
       </div>
     </nav>

diff --git a/app/[locale]/dashboard/components/dashboard-nav.tsx b/app/[locale]/dashboard/components/dashboard-nav.tsx
@@ -7,7 +7,7 @@ import { usePathname } from 'next/navigation';
 import { useMetaKeyPress } from '@/hooks/use-meta-key-press';
 import { Divider, Icon, IconButton, Text, Tooltip } from 'opub-ui';
 
-import { SidebarNavItem } from 'types';
+import { SidebarNavItem } from '@/types';
 import { cn } from '@/lib/utils';
 import { Icons } from '@/components/icons';
 import styles from '../dashboard.module.scss';

diff --git a/app/[locale]/dashboard/components/main-footer.tsx b/app/[locale]/dashboard/components/main-footer.tsx
@@ -110,14 +110,24 @@ const MainFooter = () => {
           ))}
         </div>
         <div className="text-white text-xs lg:text-base order-3 lg:order-none">
-          <Text color="onBgDefault">Made in India. A DataSpace product by </Text>
+          <Text color="onBgDefault">
+            Made in India. A{' '}
+            <span className="bhashini-skip-translation">DataSpace</span> product
+            by{' '}
+          </Text>
           <Link
             href={'https://www.civicdatalab.in'}
             target="_blank"
-            className="inline-flex items-center gap-1"
+            className="inline-flex items-center gap-1 bhashini-skip-translation"
           >
-             <Text color="onBgDefault">CivicDataLab</Text>
-            <Image src={'/cdl.svg'} width={32} height={32} className="lg:w-10 lg:h-10" alt="CDL logo" />
+            <Text color="onBgDefault">CivicDataLab</Text>
+            <Image
+              src={'/cdl.svg'}
+              width={32}
+              height={32}
+              className="lg:w-10 lg:h-10"
+              alt="CDL logo"
+            />
           </Link>
         </div>
       </div>

diff --git a/app/[locale]/dashboard/components/main-nav.tsx b/app/[locale]/dashboard/components/main-nav.tsx
@@ -20,6 +20,7 @@ import {
 
 import { useDashboardStore } from '@/config/store';
 import { GraphQL } from '@/lib/api';
+import BhashiniTranslation from '@/components/BhashiniTranslation';
 import { Icons } from '@/components/icons';
 import { UserDetailsQryDoc } from '../[entityType]/[entitySlug]/schema';
 import { allOrganizationsListingDoc } from '../[entityType]/schema';
@@ -291,6 +292,7 @@ export function MainNav({ hideSearch = false }) {
               )}
             </div>
           )}
+          <BhashiniTranslation />
         </div>
       </div>
     </nav>

diff --git a/components/BhashiniTranslation/BhashiniTranslation.tsx b/components/BhashiniTranslation/BhashiniTranslation.tsx
@@ -0,0 +1,57 @@
+'use client';
+
+import { useEffect, useRef } from 'react';
+import Script from 'next/script';
+
+const BHASHINI_SCRIPT_ID = 'bhashini-website-translation';
+const BHASHINI_SCRIPT_SRC =
+  'https://translation-plugin.bhashini.co.in/v3/website_translation_utility.js';
+const BHASHINI_HOLDER_ID = '__bhashini-plugin-holder';
+
+function getHolder() {
+  let holder = document.getElementById(BHASHINI_HOLDER_ID);
+  if (!holder) {
+    holder = document.createElement('div');
+    holder.id = BHASHINI_HOLDER_ID;
+    holder.hidden = true;
+    document.body.appendChild(holder);
+  }
+  return holder;
+}
+
+export default function BhashiniTranslation() {
+  const containerRef = useRef<HTMLDivElement>(null);
+
+  useEffect(() => {
+    const container = containerRef.current;
+    if (!container) return;
+
+    const holder = getHolder();
+    while (holder.firstChild) {
+      container.appendChild(holder.firstChild);
+    }
+
+    return () => {
+      while (container.firstChild) {
+        holder.appendChild(container.firstChild);
+      }
+    };
+  }, []);
+
+  return (
+    <>
+      <div
+        ref={containerRef}
+        className="bhashini-plugin-container flex items-center"
+      />
+      <Script
+        id={BHASHINI_SCRIPT_ID}
+        src={BHASHINI_SCRIPT_SRC}
+        strategy="afterInteractive"
+        {...({
+          'language-icon-color': '#fff',
+        } as Record<string, string>)}
+      />
+    </>
+  );
+}
diff --git a/components/BhashiniTranslation/index.ts b/components/BhashiniTranslation/index.ts
@@ -0,0 +1 @@
+export { default } from './BhashiniTranslation';
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1 @@
		export { default } from './BhashiniTranslation';