fix: types

Signed-off-by: Amit Amrutiya <[email protected]>

src/constants/constants.ts

@@ -9,5 +9,5 @@ export const DEFAULT_STROKE_WIDTH = '2';
 export const CLOUD_URL = 'https://cloud.layer5.io';
 export const PLAYGROUND_MODES = {
   DESIGNER: 'design',
-  VISUALIZER: 'visualize'
+  OPERATOR: 'operator'
 } as const;

src/custom/CatalogDesignTable/CatalogDesignTable.tsx

@@ -1,5 +1,6 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
 import _ from 'lodash';
+import { MUIDataTableColumn } from 'mui-datatables';
 import { useCallback, useMemo, useRef } from 'react';
 import { PublishIcon } from '../../icons';
 import { CHARCOAL, useTheme } from '../../theme';
@@ -14,7 +15,7 @@ import UnpublishTooltipIcon from './UnpublishTooltipIcon';
 interface CatalogDesignsTableProps {
   patterns: Pattern[];
   filter: any;
-  columns: Array<any>;
+  columns: MUIDataTableColumn[];
   totalCount: number;
   sortOrder: string;
   setSortOrder: (order: string) => void;
@@ -63,7 +64,7 @@ export const CatalogDesignsTable: React.FC<CatalogDesignsTableProps> = ({
     return new Date(date).toLocaleDateString('en-US', dateOptions);
   }, []);
 
-  const processedColumns = useMemo(() => {
+  const processedColumns: MUIDataTableColumn[] = useMemo(() => {
     return columns.map((col) => {
       const newCol = { ...col };
       if (!newCol.options) newCol.options = {};

src/custom/CatalogDesignTable/helper.ts

@@ -0,0 +1,6 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
+
+export const getColumnValue = (tableMeta: any, targetColumn: string): any => {
+  const rowData = tableMeta.tableData[tableMeta.rowIndex];
+  return (rowData as any)[targetColumn] || '';
+};

src/custom/ResponsiveDataTable.tsx

@@ -1,5 +1,5 @@
 import { Theme, ThemeProvider, createTheme, styled } from '@mui/material';
-import MUIDataTable from 'mui-datatables';
+import MUIDataTable, { MUIDataTableColumn } from 'mui-datatables';
 import React, { useCallback } from 'react';
 import { Checkbox, Collapse, ListItemIcon, ListItemText, Menu, MenuItem } from '../base';
 import { ShareIcon } from '../icons';
@@ -278,10 +278,10 @@ export interface Column {
 
 export interface ResponsiveDataTableProps {
   data: string[][];
-  columns: Column[];
+  columns: MUIDataTableColumn[];
   options?: object;
-  tableCols?: Column[];
-  updateCols?: ((columns: Column[]) => void) | undefined;
+  tableCols?: MUIDataTableColumn[];
+  updateCols?: ((columns: MUIDataTableColumn[]) => void) | undefined;
   columnVisibility: Record<string, boolean> | undefined;
   theme?: object;
   colViews?: ColView[];

src/custom/TeamTable/TeamTable.tsx

@@ -1,5 +1,6 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
 import { Grid, TableCell } from '@mui/material';
+import { MUIDataTableColumn } from 'mui-datatables';
 import { ErrorBoundary } from '../ErrorBoundary/ErrorBoundary.js';
 import { ColView } from '../Helpers/ResponsiveColumns/responsive-coulmns.tsx/index.js';
 import ResponsiveDataTable from '../ResponsiveDataTable.js';
@@ -11,7 +12,7 @@ interface TeamTableProps {
   columnVisibility: Record<string, boolean>;
   colViews: ColView[];
   tableCols: any[];
-  columns: any[];
+  columns: MUIDataTableColumn[];
   updateCols: (cols: any) => void;
   isRemoveFromTeamAllowed: boolean;
   org_id: string;

src/custom/TeamTable/TeamTableConfiguration.tsx

@@ -1,4 +1,5 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
+import { MUIDataTableColumn } from 'mui-datatables';
 import { useState } from 'react';
 import { DeleteIcon, EditIcon } from '../../icons';
 import LogoutIcon from '../../icons/Logout/LogOutIcon';
@@ -114,7 +115,7 @@ export default function TeamTableConfiguration({
     ['actions', 'xs']
   ];
 
-  const columns = [
+  const columns: MUIDataTableColumn[] = [
     {
       name: 'id',
       label: 'ID',

src/custom/UsersTable/UsersTable.tsx

@@ -1,4 +1,5 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
+import { MUIDataTableColumn } from 'mui-datatables';
 import { useRef, useState } from 'react';
 import { Avatar, Box, Grid, Tooltip, Typography } from '../../base';
 import { EditIcon, PersonIcon } from '../../icons';
@@ -121,7 +122,7 @@ const UsersTable: React.FC<UsersTableProps> = ({
     }
   };
 
-  const getValidColumnValue = (rowData: any, columnName: string, columns: any) => {
+  const getValidColumnValue = (rowData: any, columnName: string, columns: MUIDataTableColumn[]) => {
     const columnIndex = columns.findIndex((column: any) => column.name === columnName);
     return rowData[columnIndex];
   };
@@ -233,7 +234,7 @@ const UsersTable: React.FC<UsersTableProps> = ({
     // ["actions", "xs"]
   ];
 
-  const columns: any[] = [
+  const columns: MUIDataTableColumn[] = [
     {
       name: 'user_id',
       label: 'User ID',
@@ -445,7 +446,7 @@ const UsersTable: React.FC<UsersTableProps> = ({
     }
   ];
 
-  const [tableCols, updateCols] = useState<any[]>(columns);
+  const [tableCols, updateCols] = useState<MUIDataTableColumn[]>(columns);
 
   const [columnVisibility] = useState<Record<string, boolean>>(() => {
     const showCols: Record<string, boolean> = updateVisibleColumns(colViews, width);

src/custom/Workspaces/EnvironmentTable.tsx

@@ -1,6 +1,6 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
 import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
-import { MUIDataTableMeta } from 'mui-datatables';
+import { MUIDataTableColumn, MUIDataTableMeta } from 'mui-datatables';
 import React, { useState } from 'react';
 import { Accordion, AccordionDetails, AccordionSummary, Typography } from '../../base';
 import { DeleteIcon, EnvironmentIcon } from '../../icons';
@@ -80,7 +80,7 @@ const EnvironmentTable: React.FC<EnvironmentTableProps> = ({
   });
   const { width } = useWindowDimensions();
   const [unassignEnvironmentFromWorkspace] = useUnassignEnvironmentFromWorkspaceMutation();
-  const columns: any[] = [
+  const columns: MUIDataTableColumn[] = [
     {
       name: 'id',
       label: 'ID',