feat: use ReadonlyArray in props

react-component · Jan 27, 2021 · 1b7b4d6 · 1b7b4d6
1 parent 4cf7ec0
commit 1b7b4d6
Show file tree

Hide file tree

Showing 15 changed files with 39 additions and 41 deletions.
diff --git a/src/Body/BodyRow.tsx b/src/Body/BodyRow.tsx
@@ -24,7 +24,9 @@ export interface BodyRowProps<RecordType> {
   childrenColumnName: string;
 }
 
-function BodyRow<RecordType extends { children?: RecordType[] }>(props: BodyRowProps<RecordType>) {
+function BodyRow<RecordType extends { children?: readonly RecordType[] }>(
+  props: BodyRowProps<RecordType>,
+) {
   const {
     className,
     style,

diff --git a/src/Body/index.tsx b/src/Body/index.tsx
@@ -9,7 +9,7 @@ import ResizeContext from '../context/ResizeContext';
 import MeasureCell from './MeasureCell';
 
 export interface BodyProps<RecordType> {
-  data: RecordType[];
+  data: readonly RecordType[];
   getRowKey: GetRowKey<RecordType>;
   measureColumnWidth: boolean;
   expandedKeys: Set<Key>;

diff --git a/src/ColGroup.tsx b/src/ColGroup.tsx
@@ -3,8 +3,8 @@ import { ColumnType } from './interface';
 import { INTERNAL_COL_DEFINE } from './utils/legacyUtil';
 
 export interface ColGroupProps<RecordType> {
-  colWidths: (number | string)[];
-  columns?: ColumnType<RecordType>[];
+  colWidths: readonly (number | string)[];
+  columns?: readonly ColumnType<RecordType>[];
   columCount?: number;
 }
 

diff --git a/src/Header/FixedHeader.tsx b/src/Header/FixedHeader.tsx
@@ -7,7 +7,7 @@ import ColGroup from '../ColGroup';
 import { ColumnsType, ColumnType } from '../interface';
 import TableContext from '../context/TableContext';
 
-function useColumnWidth(colWidths: number[], columCount: number) {
+function useColumnWidth(colWidths: readonly number[], columCount: number) {
   return useMemo(() => {
     const cloneColumns: number[] = [];
     for (let i = 0; i < columCount; i += 1) {
@@ -24,7 +24,7 @@ function useColumnWidth(colWidths: number[], columCount: number) {
 
 export interface FixedHeaderProps<RecordType> extends HeaderProps<RecordType> {
   noData: boolean;
-  colWidths: number[];
+  colWidths: readonly number[];
   columCount: number;
   direction: 'ltr' | 'rtl';
   fixHeader: boolean;
@@ -92,7 +92,7 @@ const FixedHeader = React.forwardRef<HTMLDivElement, FixedHeaderProps<unknown>>(
       [combinationScrollBarSize, columns],
     );
 
-    const flattenColumnsWithScrollbar = useMemo<ColumnType<unknown>[]>(
+    const flattenColumnsWithScrollbar = useMemo(
       () => (combinationScrollBarSize ? [...flattenColumns, ScrollBarColumn] : flattenColumns),
       [combinationScrollBarSize, flattenColumns],
     );

diff --git a/src/Header/Header.tsx b/src/Header/Header.tsx
@@ -83,9 +83,9 @@ function parseHeaderRows<RecordType>(
 
 export interface HeaderProps<RecordType> {
   columns: ColumnsType<RecordType>;
-  flattenColumns: ColumnType<RecordType>[];
+  flattenColumns: readonly ColumnType<RecordType>[];
   stickyOffsets: StickyOffsets;
-  onHeaderRow: GetComponentProps<ColumnType<RecordType>[]>;
+  onHeaderRow: GetComponentProps<readonly ColumnType<RecordType>[]>;
 }
 
 function Header<RecordType>({

diff --git a/src/Header/HeaderRow.tsx b/src/Header/HeaderRow.tsx
@@ -12,12 +12,12 @@ import { getCellFixedInfo } from '../utils/fixUtil';
 import { getColumnsKey } from '../utils/valueUtil';
 
 export interface RowProps<RecordType> {
-  cells: CellType<RecordType>[];
+  cells: readonly CellType<RecordType>[];
   stickyOffsets: StickyOffsets;
-  flattenColumns: ColumnType<RecordType>[];
+  flattenColumns: readonly ColumnType<RecordType>[];
   rowComponent: CustomizeComponent;
   cellComponent: CustomizeComponent;
-  onHeaderRow: GetComponentProps<ColumnType<RecordType>[]>;
+  onHeaderRow: GetComponentProps<readonly ColumnType<RecordType>[]>;
   index: number;
 }
 

diff --git a/src/Table.tsx b/src/Table.tsx
@@ -106,7 +106,7 @@ export interface TableProps<RecordType = unknown> extends LegacyExpandableProps<
   className?: string;
   style?: React.CSSProperties;
   children?: React.ReactNode;
-  data?: RecordType[];
+  data?: readonly RecordType[];
   columns?: ColumnsType<RecordType>;
   rowKey?: string | GetRowKey<RecordType>;
   tableLayout?: TableLayout;
@@ -123,14 +123,14 @@ export interface TableProps<RecordType = unknown> extends LegacyExpandableProps<
   // Additional Part
   title?: PanelRender<RecordType>;
   footer?: PanelRender<RecordType>;
-  summary?: (data: RecordType[]) => React.ReactNode;
+  summary?: (data: readonly RecordType[]) => React.ReactNode;
 
   // Customize
   id?: string;
   showHeader?: boolean;
   components?: TableComponents<RecordType>;
   onRow?: GetComponentProps<RecordType>;
-  onHeaderRow?: GetComponentProps<ColumnType<RecordType>[]>;
+  onHeaderRow?: GetComponentProps<readonly ColumnType<RecordType>[]>;
   emptyText?: React.ReactNode | (() => React.ReactNode);
 
   direction?: 'ltr' | 'rtl';
@@ -303,7 +303,7 @@ function Table<RecordType extends DefaultRecordType>(props: TableProps<RecordTyp
     return false;
   }, [!!expandedRowRender, mergedData]);
 
-  const [innerExpandedKeys, setInnerExpandedKeys] = React.useState<Key[]>(() => {
+  const [innerExpandedKeys, setInnerExpandedKeys] = React.useState(() => {
     if (defaultExpandedRowKeys) {
       return defaultExpandedRowKeys;
     }

diff --git a/src/context/BodyContext.tsx b/src/context/BodyContext.tsx
@@ -16,7 +16,7 @@ export interface BodyContextProps<RecordType = DefaultRecordType> {
   expandedRowClassName: RowClassName<RecordType>;
 
   columns: ColumnsType<RecordType>;
-  flattenColumns: ColumnType<RecordType>[];
+  flattenColumns: readonly ColumnType<RecordType>[];
 
   componentWidth: number;
   tableLayout: TableLayout;

diff --git a/src/context/TableContext.tsx b/src/context/TableContext.tsx
@@ -12,7 +12,7 @@ export interface TableContextProps {
 
   direction: 'ltr' | 'rtl';
 
-  fixedInfoList: FixedInfo[];
+  fixedInfoList: readonly FixedInfo[];
 
   isSticky: boolean;
 }

diff --git a/src/hooks/useColumns.tsx b/src/hooks/useColumns.tsx
@@ -60,7 +60,7 @@ function flatColumns<RecordType>(columns: ColumnsType<RecordType>): ColumnType<R
   }, []);
 }
 
-function warningFixed(flattenColumns: { fixed?: FixedType }[]) {
+function warningFixed(flattenColumns: readonly { fixed?: FixedType }[]) {
   let allFixLeft = true;
   for (let i = 0; i < flattenColumns.length; i += 1) {
     const col = flattenColumns[i];
@@ -136,7 +136,7 @@ function useColumns<RecordType>(
     columnWidth?: number | string;
   },
   transformColumns: (columns: ColumnsType<RecordType>) => ColumnsType<RecordType>,
-): [ColumnsType<RecordType>, ColumnType<RecordType>[]] {
+): [ColumnsType<RecordType>, readonly ColumnType<RecordType>[]] {
   const baseColumns = React.useMemo<ColumnsType<RecordType>>(
     () => columns || convertChildrenToColumns(children),
     [columns, children],

diff --git a/src/interface.ts b/src/interface.ts
@@ -53,7 +53,7 @@ export interface RenderedCell<RecordType> {
   children?: React.ReactNode;
 }
 
-export type DataIndex = string | number | (string | number)[];
+export type DataIndex = string | number | readonly (string | number)[];
 
 export type CellEllipsisType = { showTitle?: boolean } | boolean;
 
@@ -89,17 +89,14 @@ export interface ColumnType<RecordType> extends ColumnSharedType<RecordType> {
   onCellClick?: (record: RecordType, e: React.MouseEvent<HTMLElement>) => void;
 }
 
-export type ColumnsType<RecordType = unknown> = (
-  | ColumnGroupType<RecordType>
-  | ColumnType<RecordType>
-)[];
+export type ColumnsType<RecordType = unknown> = readonly (ColumnGroupType<RecordType> | ColumnType<RecordType>)[];
 
 export type GetRowKey<RecordType> = (record: RecordType, index?: number) => Key;
 
 // ================= Fix Column =================
 export interface StickyOffsets {
-  left: number[];
-  right: number[];
+  left: readonly number[];
+  right: readonly number[];
   isSticky?: boolean;
 }
 
@@ -118,7 +115,7 @@ type Component<P> =
 export type CustomizeComponent = Component<any>;
 
 export type CustomizeScrollBody<RecordType> = (
-  data: RecordType[],
+  data: readonly RecordType[],
   info: {
     scrollbarSize: number;
     ref: React.Ref<{ scrollLeft: number }>;
@@ -143,7 +140,7 @@ export interface TableComponents<RecordType> {
 }
 
 export type GetComponent = (
-  path: string[],
+  path: readonly string[],
   defaultComponent?: CustomizeComponent,
 ) => CustomizeComponent;
 
@@ -197,13 +194,13 @@ export type RenderExpandIcon<RecordType> = (
 ) => React.ReactNode;
 
 export interface ExpandableConfig<RecordType> {
-  expandedRowKeys?: Key[];
-  defaultExpandedRowKeys?: Key[];
+  expandedRowKeys?: readonly Key[];
+  defaultExpandedRowKeys?: readonly Key[];
   expandedRowRender?: ExpandedRowRender<RecordType>;
   expandRowByClick?: boolean;
   expandIcon?: RenderExpandIcon<RecordType>;
   onExpand?: (expanded: boolean, record: RecordType) => void;
-  onExpandedRowsChange?: (expandedKeys: Key[]) => void;
+  onExpandedRowsChange?: (expandedKeys: readonly Key[]) => void;
   defaultExpandAllRows?: boolean;
   indentSize?: number;
   expandIconColumnIndex?: number;
@@ -214,7 +211,7 @@ export interface ExpandableConfig<RecordType> {
 }
 
 // =================== Render ===================
-export type PanelRender<RecordType> = (data: RecordType[]) => React.ReactNode;
+export type PanelRender<RecordType> = (data: readonly RecordType[]) => React.ReactNode;
 
 // =================== Events ===================
 export type TriggerEventHandler<RecordType> = (

diff --git a/src/sugar/ColumnGroup.tsx b/src/sugar/ColumnGroup.tsx
@@ -5,7 +5,7 @@ import { ColumnType } from '../interface';
 export interface ColumnGroupProps<RecordType> extends Omit<ColumnType<RecordType>, 'children'> {
   children:
     | React.ReactElement<ColumnProps<RecordType>>
-    | React.ReactElement<ColumnProps<RecordType>>[];
+    | readonly React.ReactElement<ColumnProps<RecordType>>[];
 }
 
 /* istanbul ignore next */

diff --git a/src/utils/expandUtil.tsx b/src/utils/expandUtil.tsx
@@ -32,13 +32,13 @@ export function renderExpandIcon<RecordType>({
 }
 
 export function findAllChildrenKeys<RecordType>(
-  data: RecordType[],
+  data: readonly RecordType[],
   getRowKey: GetRowKey<RecordType>,
   childrenColumnName: string,
 ): Key[] {
   const keys: Key[] = [];
 
-  function dig(list: RecordType[]) {
+  function dig(list: readonly RecordType[]) {
     (list || []).forEach((item, index) => {
       keys.push(getRowKey(item, index));
 

diff --git a/src/utils/fixUtil.ts b/src/utils/fixUtil.ts
@@ -16,7 +16,7 @@ export interface FixedInfo {
 export function getCellFixedInfo(
   colStart: number,
   colEnd: number,
-  columns: { fixed?: FixedType }[],
+  columns: readonly { fixed?: FixedType }[],
   stickyOffsets: StickyOffsets,
   direction: 'ltr' | 'rtl',
 ): FixedInfo {

diff --git a/src/utils/valueUtil.tsx b/src/utils/valueUtil.tsx
@@ -2,12 +2,11 @@ import { Key, DataIndex } from '../interface';
 
 const INTERNAL_KEY_PREFIX = 'RC_TABLE_KEY';
 
-function toArray<T>(arr: T | T[]): T[] {
+function toArray<T>(arr: T | readonly T[]): T[] {
   if (arr === undefined || arr === null) {
     return [];
   }
-
-  return Array.isArray(arr) ? arr : [arr];
+  return (Array.isArray(arr) ? arr : [arr]) as T[];
 }
 
 export function getPathValue<ValueType, ObjectType extends object>(
@@ -40,7 +39,7 @@ interface GetColumnKeyColumn {
   dataIndex?: DataIndex;
 }
 
-export function getColumnsKey(columns: GetColumnKeyColumn[]) {
+export function getColumnsKey(columns: readonly GetColumnKeyColumn[]) {
   const columnKeys: React.Key[] = [];
   const keys: Record<React.Key, boolean> = {};