From fc59b7fb791b0beb386fde0b3fb3e62723e4f7fa Mon Sep 17 00:00:00 2001 From: Amit Amrutiya Date: Tue, 26 Nov 2024 12:03:53 +0530 Subject: [PATCH] fix: types Signed-off-by: Amit Amrutiya --- src/constants/constants.ts | 2 +- .../CatalogDesignTable/CatalogDesignTable.tsx | 5 ++-- src/custom/CatalogDesignTable/helper.ts | 6 +++++ src/custom/CatalogDesignTable/helper.tsx | 9 ------- src/custom/ResponsiveDataTable.tsx | 8 +++--- src/custom/TeamTable/TeamTable.tsx | 3 ++- .../TeamTable/TeamTableConfiguration.tsx | 26 ++++++++++--------- src/custom/UsersTable/UsersTable.tsx | 17 ++++++------ src/custom/Workspaces/EnvironmentTable.tsx | 6 ++--- src/custom/Workspaces/types.ts | 6 +++++ 10 files changed, 48 insertions(+), 40 deletions(-) create mode 100644 src/custom/CatalogDesignTable/helper.ts delete mode 100644 src/custom/CatalogDesignTable/helper.tsx diff --git a/src/constants/constants.ts b/src/constants/constants.ts index 148e8aaf..acd42608 100644 --- a/src/constants/constants.ts +++ b/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; diff --git a/src/custom/CatalogDesignTable/CatalogDesignTable.tsx b/src/custom/CatalogDesignTable/CatalogDesignTable.tsx index b6e63a17..064015e4 100644 --- a/src/custom/CatalogDesignTable/CatalogDesignTable.tsx +++ b/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; + columns: MUIDataTableColumn[]; totalCount: number; sortOrder: string; setSortOrder: (order: string) => void; @@ -63,7 +64,7 @@ export const CatalogDesignsTable: React.FC = ({ 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 = {}; diff --git a/src/custom/CatalogDesignTable/helper.ts b/src/custom/CatalogDesignTable/helper.ts new file mode 100644 index 00000000..827fd086 --- /dev/null +++ b/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] || ''; +}; diff --git a/src/custom/CatalogDesignTable/helper.tsx b/src/custom/CatalogDesignTable/helper.tsx deleted file mode 100644 index a80b784b..00000000 --- a/src/custom/CatalogDesignTable/helper.tsx +++ /dev/null @@ -1,9 +0,0 @@ -/* eslint-disable @typescript-eslint/ban-ts-comment */ -/* eslint-disable @typescript-eslint/no-explicit-any */ -import { MUIDataTableMeta } from 'mui-datatables'; - -export const getColumnValue = (tableMeta: MUIDataTableMeta, targetColumn: string): any => { - //@ts-ignore - const rowData = tableMeta.tableData[tableMeta.rowIndex] as Pattern; - return (rowData as any)[targetColumn] || ''; -}; diff --git a/src/custom/ResponsiveDataTable.tsx b/src/custom/ResponsiveDataTable.tsx index d6fad434..489abb38 100644 --- a/src/custom/ResponsiveDataTable.tsx +++ b/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 | undefined; theme?: object; colViews?: ColView[]; diff --git a/src/custom/TeamTable/TeamTable.tsx b/src/custom/TeamTable/TeamTable.tsx index 47c1a753..cfa5de4a 100644 --- a/src/custom/TeamTable/TeamTable.tsx +++ b/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; colViews: ColView[]; tableCols: any[]; - columns: any[]; + columns: MUIDataTableColumn[]; updateCols: (cols: any) => void; isRemoveFromTeamAllowed: boolean; org_id: string; diff --git a/src/custom/TeamTable/TeamTableConfiguration.tsx b/src/custom/TeamTable/TeamTableConfiguration.tsx index 0b8db7c9..8ebd6321 100644 --- a/src/custom/TeamTable/TeamTableConfiguration.tsx +++ b/src/custom/TeamTable/TeamTableConfiguration.tsx @@ -1,4 +1,5 @@ /* eslint-disable @typescript-eslint/no-explicit-any */ +import { MUIDataTableColumn, MUIDataTableMeta } from 'mui-datatables'; import { useState } from 'react'; import { DeleteIcon, EditIcon } from '../../icons'; import LogoutIcon from '../../icons/Logout/LogOutIcon'; @@ -17,11 +18,12 @@ import { TableTopIcon, TableTopIconsWrapper } from '../Workspaces/styles'; +import { Team } from '../Workspaces/types'; // currently team does not support bulk team delete interface DeleteTeamsBtnProps { selected: any; - teams: any[]; + teams: Team[]; deleteTeamsModalHandler: (deleteTeams: { team_ids: string[]; team_names: string[] }) => void; } @@ -55,7 +57,7 @@ function DeleteTeamsBtn({ selected, teams, deleteTeamsModalHandler }: DeleteTeam } interface TeamTableConfigurationProps { - teams: any[]; + teams: Team[]; count: number; page: number; pageSize: number; @@ -65,9 +67,9 @@ interface TeamTableConfigurationProps { setSortOrder: (sortOrder: string) => void; bulkSelect: boolean; setBulkSelect: (bulkSelect: boolean) => void; - handleTeamView: (ev: any, rowData: any) => void; - handleDeleteTeam: (ev: any, rowData: any) => void; - handleleaveTeam: (ev: any, rowData: any) => void; + handleTeamView: (ev: React.MouseEvent, rowData: any) => void; + handleDeleteTeam: (ev: React.MouseEvent, rowData: any) => void; + handleleaveTeam: (ev: React.MouseEvent, rowData: any) => void; handleRemoveTeamFromWorkspace?: (rowData: any) => void; teamId: string; workspace?: boolean; @@ -114,7 +116,7 @@ export default function TeamTableConfiguration({ ['actions', 'xs'] ]; - const columns = [ + const columns: MUIDataTableColumn[] = [ { name: 'id', label: 'ID', @@ -122,7 +124,7 @@ export default function TeamTableConfiguration({ filter: false, sort: false, searchable: false, - customBodyRender: (value: any) => + customBodyRender: (value: string) => } }, { @@ -141,7 +143,7 @@ export default function TeamTableConfiguration({ filter: false, sort: true, searchable: false, - customBodyRender: (value: any) => + customBodyRender: (value: string) => } }, { @@ -171,10 +173,10 @@ export default function TeamTableConfiguration({ sort: true, searchable: false, sortDescFirst: true, - customBodyRender: (v: any) => JSON.stringify(v), + customBodyRender: (v: string) => JSON.stringify(v), filterOptions: { names: ['Deleted', 'Not Deleted'], - logic: (val: any, filters: any) => { + logic: (val: string, filters: any) => { if (val != 'NA' && filters.indexOf('Deleted') >= 0) return true; else if (val == 'NA' && filters.indexOf('Not Deleted') >= 0) return true; return false; @@ -190,7 +192,7 @@ export default function TeamTableConfiguration({ filter: false, sort: false, searchable: false, - customBodyRender: (_: any, tableMeta: any) => { + customBodyRender: (_: string, tableMeta: MUIDataTableMeta) => { if (bulkSelect || tableMeta.rowData[4].Valid) { return ( @@ -251,7 +253,7 @@ export default function TeamTableConfiguration({ { + onClick={(ev: React.MouseEvent) => { isDeleteTeamAllowed && handleDeleteTeam(ev, tableMeta.rowData); }} iconType="delete" diff --git a/src/custom/UsersTable/UsersTable.tsx b/src/custom/UsersTable/UsersTable.tsx index 2a03fafe..16d991b8 100644 --- a/src/custom/UsersTable/UsersTable.tsx +++ b/src/custom/UsersTable/UsersTable.tsx @@ -1,4 +1,5 @@ /* eslint-disable @typescript-eslint/no-explicit-any */ +import { MUIDataTableColumn, MUIDataTableMeta } from 'mui-datatables'; import { useRef, useState } from 'react'; import { Avatar, Box, Grid, Tooltip, Typography } from '../../base'; import { EditIcon, PersonIcon } from '../../icons'; @@ -18,7 +19,7 @@ import { parseDeletionTimestamp } from '../Workspaces/helper'; import { TableIconsContainer, TableIconsDisabledContainer } from '../Workspaces/styles'; interface ActionButtonsProps { - tableMeta: any; + tableMeta: MUIDataTableMeta; isRemoveFromTeamAllowed: boolean; handleRemoveFromTeam: (data: any[]) => () => void; } @@ -121,7 +122,7 @@ const UsersTable: React.FC = ({ } }; - 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 = ({ // ["actions", "xs"] ]; - const columns: any[] = [ + const columns: MUIDataTableColumn[] = [ { name: 'user_id', label: 'User ID', @@ -250,7 +251,7 @@ const UsersTable: React.FC = ({ filter: false, sort: false, searchable: false, - customBodyRender: (value: string, tableMeta: any) => ( + customBodyRender: (value: string, tableMeta: MUIDataTableMeta) => ( img': { mr: 2, flexShrink: 0 } }}> @@ -295,7 +296,7 @@ const UsersTable: React.FC = ({ filter: false, sort: true, searchable: true, - customBodyRender: (value: string, tableMeta: any) => ( + customBodyRender: (value: string, tableMeta: MUIDataTableMeta) => (
{value} @@ -408,7 +409,7 @@ const UsersTable: React.FC = ({ }, fullWidth: true }, - customBodyRender: (value: any, tableMeta: any) => { + customBodyRender: (_: string, tableMeta: MUIDataTableMeta) => { const rowData = users[tableMeta.rowIndex]; return parseDeletionTimestamp(rowData); } @@ -421,7 +422,7 @@ const UsersTable: React.FC = ({ filter: false, sort: false, searchable: false, - customBodyRender: (_: any, tableMeta: any) => + customBodyRender: (_: string, tableMeta: MUIDataTableMeta) => getValidColumnValue(tableMeta.rowData, 'deleted_at', columns).Valid !== false ? ( = ({ } ]; - const [tableCols, updateCols] = useState(columns); + const [tableCols, updateCols] = useState(columns); const [columnVisibility] = useState>(() => { const showCols: Record = updateVisibleColumns(colViews, width); diff --git a/src/custom/Workspaces/EnvironmentTable.tsx b/src/custom/Workspaces/EnvironmentTable.tsx index b09bf023..127a1339 100644 --- a/src/custom/Workspaces/EnvironmentTable.tsx +++ b/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 = ({ }); const { width } = useWindowDimensions(); const [unassignEnvironmentFromWorkspace] = useUnassignEnvironmentFromWorkspaceMutation(); - const columns: any[] = [ + const columns: MUIDataTableColumn[] = [ { name: 'id', label: 'ID', @@ -150,7 +150,7 @@ const EnvironmentTable: React.FC = ({ filter: false, sort: false, searchable: false, - customBodyRender: (_: any, tableMeta: MUIDataTableMeta) => ( + customBodyRender: (_: string, tableMeta: MUIDataTableMeta) => (