chore: enable spellcheck for md editor (#1683)

odd-platform-ui/src/components/DataModelling/QueryExampleDetails/QueryExampleDetailsContainer.tsx

@@ -1,4 +1,4 @@
-import React, { useCallback, useMemo, useState } from 'react';
+import React, { useMemo } from 'react';
 import { Box, Grid, Typography } from '@mui/material';
 import { useGetQueryExampleDetails } from 'lib/hooks/api/dataModelling/queryExamples';
 import { useAppDateTime } from 'lib/hooks';
@@ -67,9 +67,7 @@ const QueryExampleDetailsContainer: React.FC = () => {
       <Grid item alignItems='center'>
         <QueryExampleDetailsTabs
           linkedEntitiesHint={queryExampleDetails?.linkedEntities.pageInfo.total}
-          linkedTermsHint={
-            queryExampleDetails?.linkedTerms?.items ? queryExampleDetails?.linkedTerms?.items.length : 0
-          }
+          linkedTermsHint={queryExampleDetails?.linkedTerms?.items.length}
         />
       </Grid>
       <Grid item container gap={2} flexDirection='column' alignItems='start'>

odd-platform-ui/src/components/Terms/TermDetails/Overview/Overview.tsx

@@ -1,6 +1,6 @@
-import { Grid, Typography } from '@mui/material';
+import { Grid } from '@mui/material';
 import React, { useMemo, type FC } from 'react';
-import { Markdown, SkeletonWrapper } from 'components/shared/elements';
+import { SkeletonWrapper } from 'components/shared/elements';
 import { Permission, PermissionResourceType } from 'generated-sources';
 import { WithPermissionsProvider } from 'components/shared/contexts';
 import { useTermsRouteParams } from 'routes';

odd-platform-ui/src/components/Terms/TermDetails/Overview/TermDefinition/TermDefinition.styles.ts

@@ -14,4 +14,4 @@ export const Definition = styled('div')(({ theme }) => ({
   display: 'flex',
   alignItems: 'center',
   marginBottom: theme.spacing(1),
-}));
+}));

odd-platform-ui/src/components/Terms/TermDetails/Overview/TermDefinition/TermDefinition.tsx

@@ -1,12 +1,10 @@
 import React, { type FC } from 'react';
-import { Box, Grid, Typography } from '@mui/material';
-import { WithPermissions } from 'components/shared/contexts';
+import { Typography } from '@mui/material';
 import type { TermRef } from 'generated-sources';
-import { Permission } from 'generated-sources';
-import { AppTooltip, Button, Markdown } from 'components/shared/elements';
+import { AppTooltip, Markdown } from 'components/shared/elements';
 import { useTermWiki } from 'lib/hooks';
 import { updateDataSetFieldDescription } from 'redux/thunks';
-import { InformationIcon, StrokedInfoIcon } from 'components/shared/icons';
+import { InformationIcon } from 'components/shared/icons';
 import * as S from './TermDefinition.styles';
 
 interface TermDefinitionProps {
@@ -16,14 +14,13 @@ interface TermDefinitionProps {
 }
 
 const TermDefinition: FC<TermDefinitionProps> = ({ definition, termId, terms }) => {
-  const { error, internalDescription, transformDescriptionToMarkdown, editMode } =
-    useTermWiki({
-      terms,
-      description: definition,
-      entityId: termId,
-      updateDescription: updateDataSetFieldDescription,
-      isDatasetField: false,
-    });
+  const { transformDescriptionToMarkdown } = useTermWiki({
+    terms,
+    description: definition,
+    entityId: termId,
+    updateDescription: updateDataSetFieldDescription,
+    isDatasetField: false,
+  });
 
   const tooltipInfoContent = (
     <S.Tooltip>

odd-platform-ui/src/components/shared/elements/Markdown/Markdown.tsx

@@ -1,4 +1,4 @@
-import React, { type FC, type ReactNode, type CSSProperties } from 'react';
+import React, { type FC, type ReactNode, type CSSProperties, useEffect } from 'react';
 import type { ContextStore } from '@uiw/react-md-editor';
 import MDEditor from '@uiw/react-md-editor';
 import type { Position } from 'unist';
@@ -87,8 +87,16 @@ const Markdown: FC<MarkdownProps> = ({
     'data-color-mode'?: 'light' | 'dark';
   };
 
+  useEffect(() => {
+    document
+      .getElementById('md-editor')
+      ?.querySelector('textarea')
+      ?.setAttribute('spellcheck', 'true');
+  }, []);
+
   return editor ? (
     <MDEditor
+      id='md-editor'
       height={height}
       value={value}
       preview='edit'

odd-platform-ui/src/lib/hooks/api/dataModelling/queryExamples.ts

@@ -122,4 +122,3 @@ export function useGetQueryExamplesByTermId({
     queryFn: async () => queryExampleApi.getQueryExampleByTermId({ termId }),
   });
 }
-

odd-platform-ui/src/lib/hooks/api/terms.ts

@@ -119,7 +119,7 @@ export function useUnassignTermQueryExample() {
     mutationKey: ['unassignTermQueryExample'],
     mutationFn: async ({
       exampleId,
-      termId
+      termId,
     }: TermApiDeleteQueryExampleToTermRelationshipRequest) =>
       termApi.deleteQueryExampleToTermRelationship({
         termId,