refact(KtTable): turn all files in kotti-table/logic into typescript

types have been purposefully left obtuse for now

Co-Authored-By: Florian Wendelborn <[email protected]>

packages/kotti-ui/source/kotti-table/logic/column.js → packages/kotti-ui/source/kotti-table/logic/column.ts

@@ -1,3 +1,5 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
+/* eslint-disable @typescript-eslint/explicit-module-boundary-types */
 import pick from 'lodash/pick'
 import Vue from 'vue'
 
@@ -9,19 +11,19 @@ import { setHiddenColumn, getResolvedHiddenColumns } from './hide'
 import { resolveColumnsOrder, getOrderedColumns } from './order'
 import { setSortedColumn } from './sort'
 
-export function getColumnRealIndex(state, column) {
-	return state._columnsArray.findIndex(({ id }) => id == column.id)
+export function getColumnRealIndex(state: any, column: any) {
+	return state._columnsArray.findIndex(({ id }: any) => id == column.id)
 }
 
-function getColumn(state, column = {}) {
+function getColumn(state: any, column: any = {}) {
 	return state._columns[column.prop]
 }
 
-export function getColumnIndex(state, column) {
+export function getColumnIndex(state: any, column: any) {
 	return getColumn(state, column).index
 }
 
-function setColumn(state, { column, index, deleted }) {
+function setColumn(state: any, { column, index, deleted }: any) {
 	const { _columns = {} } = state
 	let newColumn = column
 	const oldColumn = _columns[newColumn.prop]
@@ -42,6 +44,7 @@ function setColumn(state, { column, index, deleted }) {
 			Vue.set(_columns, newColumn.prop, newColumn)
 		}
 	} else {
+		// eslint-disable-next-line unicorn/explicit-length-check
 		newColumn.index = index || Object.keys(_columns).length
 		Vue.set(_columns, newColumn.prop, newColumn)
 	}
@@ -60,31 +63,41 @@ function setColumn(state, { column, index, deleted }) {
 }
 
 export function setColumnsArray(
-	state,
-	prop,
-	shapeKeys,
-	columns,
+	state: any,
+	prop: any,
+	shapeKeys: any,
+	columns: any,
 	mergeStrategy = Object.assign,
 ) {
-	state[prop] = columns.map((column) => {
+	state[prop] = columns.map((column: any) => {
 		// eslint-disable-next-line no-param-reassign
 		column = pick(column, shapeKeys)
 		const oldColumn = getColumn(state, column) || {}
 		return mergeStrategy(oldColumn, column)
 	})
 }
 
-function emitColumnsChange(store) {
+function emitColumnsChange(store: any) {
 	store.table.$ready &&
 		store.emit(
 			'columnsChange',
-			store.state._columnsArray.map((col) => pick(col, PUBLIC_COLUMN_PROPS)),
+			store.state._columnsArray.map((col: any) =>
+				pick(col, PUBLIC_COLUMN_PROPS),
+			),
 		)
 }
 
-function didRestorDestroyedColumns({ _destroyedColumns }) {
+function didRestorDestroyedColumns({
+	_destroyedColumns,
+}: {
+	_destroyedColumns: any
+}) {
 	const columns = Object.values(_destroyedColumns)
-	return columns.length && columns.reduce((sum, n) => sum + n) === 0
+
+	return (
+		columns.length > 0 &&
+		columns.reduce((sum, n) => (sum as number) + (n as number) === 0)
+	)
 }
 
 export const defaultState = {
@@ -96,13 +109,13 @@ export const defaultState = {
 }
 
 export const mutations = {
-	insertColumn(store, { column, index }) {
+	insertColumn(store: any, { column, index }: any) {
 		const deleted = store.state._destroyedColumns[column.prop]
 		setColumn(store.state, { column, index, deleted })
 		deleted && (store.state._destroyedColumns[column.prop] = 0)
 		store.commit('updateColumns', { emitChange: false })
 	},
-	removeColumn(store, column) {
+	removeColumn(store: any, column: any) {
 		// eslint-disable-next-line no-param-reassign
 		column = getColumn(store.state, column)
 		if (column) {
@@ -111,9 +124,11 @@ export const mutations = {
 			store.commit('updateColumns', { emitChange: false })
 		}
 	},
-	setColumns(store, columns = store.state._columnsArray) {
+	setColumns(store: any, columns = store.state._columnsArray) {
 		const { state } = store
-		const pickedColumns = columns.map((col) => pick(col, PUBLIC_COLUMN_PROPS))
+		const pickedColumns = columns.map((col: any) =>
+			pick(col, PUBLIC_COLUMN_PROPS),
+		)
 		for (const col of pickedColumns) {
 			const column = getColumn(state, col) //getColumn: returns state._columns[col.prop]
 			if (column) {
@@ -130,12 +145,12 @@ export const mutations = {
 		})
 	},
 	updateColumns(
-		store,
+		store: any,
 		{
 			emitChange = true,
 			refreshColumnArray = store.state.refreshColumnArray,
 		} = {},
-	) {
+	): void {
 		const { table, state } = store
 		if (table.$ready) {
 			if (refreshColumnArray || didRestorDestroyedColumns(state)) {

packages/kotti-ui/source/kotti-table/logic/disable.js → packages/kotti-ui/source/kotti-table/logic/disable.ts

@@ -1,32 +1,34 @@
+/* eslint-disable @typescript-eslint/explicit-module-boundary-types */
+/* eslint-disable @typescript-eslint/no-explicit-any */
 import negate from 'lodash/negate'
 
 export const defaultState = {
 	enabledRows: [],
 	isAllRowsDisabled: false,
 }
 
-function getDisabledRows(rows, disableRow) {
-	return rows.filter((row, rowIndex) => {
+function getDisabledRows(rows: any, disableRow: any) {
+	return rows.filter((row: any, rowIndex: number) => {
 		return disableRow ? disableRow({ row, rowIndex }) : false
 	})
 }
 
-function getEnabledRows(rows, disableRow) {
+function getEnabledRows(rows: any, disableRow: any) {
 	return getDisabledRows(rows, negate(disableRow))
 }
 
 export const mutations = {
-	updateDisabledRows({ state, table }) {
+	updateDisabledRows({ state, table }: any): void {
 		state.enabledRows = getEnabledRows(state.rows, table.disableRow)
 		state.isAllRowsDisabled = state.enabledRows.length === 0
 	},
 }
 
 export const getters = {
-	isAllRowsDisabled(state) {
+	isAllRowsDisabled(state: any): boolean {
 		return (
 			state.rows.length ===
-			getDisabledRows(state.rows, this.table.disableRow).length
+			getDisabledRows(state.rows, (this as any).table.disableRow).length
 		)
 	},
 }

packages/kotti-ui/source/kotti-table/logic/expand.js → packages/kotti-ui/source/kotti-table/logic/expand.ts

@@ -1,13 +1,15 @@
+/* eslint-disable @typescript-eslint/explicit-module-boundary-types */
+/* eslint-disable @typescript-eslint/no-explicit-any */
 import isEqual from 'lodash/isEqual'
 
 export const defaultState = {
 	expandMultiple: false,
 	expanded: [],
 }
 
-function toggleRowExpansion(state, row) {
+function toggleRowExpansion(state: any, row: any) {
 	const expanded = state.expanded
-	const index = expanded.findIndex((elem) => isEqual(elem, row))
+	const index = expanded.findIndex((elem: any) => isEqual(elem, row))
 	const shouldExpand = index === -1 //if the row is not already included in state.expanded
 
 	if (state.expandMultiple) {
@@ -20,7 +22,7 @@ function toggleRowExpansion(state, row) {
 }
 
 export const mutations = {
-	expandRow(store, row) {
+	expandRow(store: any, row: any) {
 		const { state } = store
 		const isExpanded = toggleRowExpansion(state, row)
 		store.emit('expandChange', [...state.expanded])
@@ -29,7 +31,7 @@ export const mutations = {
 }
 
 export const getters = {
-	isExpanded(state, row) {
-		return state.expanded.some((e) => isEqual(e, row))
+	isExpanded(state: any, row: any) {
+		return state.expanded.some((e: any) => isEqual(e, row))
 	},
 }

packages/kotti-ui/source/kotti-table/logic/filter.js → packages/kotti-ui/source/kotti-table/logic/filter.ts

@@ -1,23 +1,27 @@
+/* eslint-disable @typescript-eslint/explicit-module-boundary-types */
+/* eslint-disable @typescript-eslint/no-explicit-any */
 import { setColumnsArray } from './column'
 
-function getFilteredColumnIndex(state, column) {
-	return state.filteredColumns.findIndex(({ prop }) => prop === column.prop)
+function getFilteredColumnIndex(state: any, column: any) {
+	return state.filteredColumns.findIndex(
+		({ prop }: any) => prop === column.prop,
+	)
 }
 
 export const defaultState = {
 	filteredColumns: [],
 }
 
 export const mutations = {
-	setFilteredColumns(store, columns = store.state.filteredColumns) {
+	setFilteredColumns(store: any, columns: any = store.state.filteredColumns) {
 		setColumnsArray(store.state, 'filteredColumns', ['prop', 'hidden'], columns)
 		store.commit('updateColumns', { emitChange: false })
 	},
 }
 
 export const getters = {}
 
-export function setFilteredColumn(state, column) {
+export function setFilteredColumn(state: any, column: any) {
 	const columnIndex = getFilteredColumnIndex(state, column)
 	if (columnIndex !== -1) {
 		state.filteredColumns[columnIndex] = column

packages/kotti-ui/source/kotti-table/logic/hide.js → packages/kotti-ui/source/kotti-table/logic/hide.ts

@@ -1,21 +1,23 @@
+/* eslint-disable @typescript-eslint/explicit-module-boundary-types */
+/* eslint-disable @typescript-eslint/no-explicit-any */
 import { setColumnsArray } from './column'
 
-function getHiddenColumnIndex(state, column) {
-	return state.hiddenColumns.findIndex(({ prop }) => prop === column.prop)
+function getHiddenColumnIndex(state: any, column: any) {
+	return state.hiddenColumns.findIndex(({ prop }: any) => prop === column.prop)
 }
 
-export function getResolvedHiddenColumns(columns) {
-	return columns.filter(({ _deleted, hidden }) => !_deleted && !hidden)
+export function getResolvedHiddenColumns(columns: any) {
+	return columns.filter(({ _deleted, hidden }: any) => !_deleted && !hidden)
 }
 
-function removeHiddenColumn(state, column) {
+function removeHiddenColumn(state: any, column: any) {
 	const columnIndex = getHiddenColumnIndex(state, column)
 	if (columnIndex !== -1) {
 		state.hiddenColumns.splice(columnIndex, 1)
 	}
 }
 
-export function setHiddenColumn(state, column) {
+export function setHiddenColumn(state: any, column: any) {
 	const columnIndex = getHiddenColumnIndex(state, column)
 	if (columnIndex !== -1) {
 		state.hiddenColumns[columnIndex] = column
@@ -29,7 +31,7 @@ export const defaultState = {
 }
 
 export const mutations = {
-	hide(store, column, hide = !column.hidden) {
+	hide(store: any, column: any, hide: any = !column.hidden) {
 		const { state } = store
 		column.hidden = hide
 
@@ -41,14 +43,14 @@ export const mutations = {
 		store.commit('updateColumns')
 		store.emit('hiddenChange', state.hiddenColumns)
 	},
-	showAll(store) {
-		store.state._columnsArray.forEach((column) => (column.hidden = false))
+	showAll(store: any) {
+		store.state._columnsArray.forEach((column: any) => (column.hidden = false))
 		store.state.hiddenColumns = []
 
 		store.commit('updateColumns')
 		store.emit('hiddenChange', store.state.hiddenColumns)
 	},
-	setHiddenColumns(store, columns = store.state.hiddenColumns) {
+	setHiddenColumns(store: any, columns = store.state.hiddenColumns) {
 		setColumnsArray(store.state, 'hiddenColumns', ['prop', 'hidden'], columns)
 		store.commit('updateColumns', { emitChange: false })
 	},

packages/kotti-ui/source/kotti-table/logic/order.js → packages/kotti-ui/source/kotti-table/logic/order.ts

@@ -1,20 +1,26 @@
+/* eslint-disable @typescript-eslint/explicit-module-boundary-types */
+/* eslint-disable @typescript-eslint/no-explicit-any */
 import pick from 'lodash/pick'
 
 import { setColumnsArray, getColumnIndex, getColumnRealIndex } from './column'
 
-function byOrder(a, b) {
+function byOrder(a: any, b: any) {
 	return a.order < b.order
 		? -1
 		: a.order > b.order
 			? 1
-			: a.orderAdvantage + a.index - (b.orderAdvantage + b.index)
+			: // eslint-disable-next-line @typescript-eslint/restrict-plus-operands
+				a.orderAdvantage + a.index - (b.orderAdvantage + b.index)
 }
 
-export function getOrderedColumns(state) {
-	return state._columnsArray.map((col) => pick(col, ['prop', 'order']))
+export function getOrderedColumns(state: any) {
+	return state._columnsArray.map((col: any) => pick(col, ['prop', 'order']))
 }
 
-export function resolveColumnsOrder({ _columns = {}, _columnsArray = [] }) {
+export function resolveColumnsOrder({
+	_columns = {},
+	_columnsArray = [],
+}: any) {
 	for (const col of _columnsArray) {
 		if (_columns[col.prop]) {
 			// _columnsArray --> _columns (we assign _columnsArray to _columns then later do the opposite)
@@ -24,8 +30,8 @@ export function resolveColumnsOrder({ _columns = {}, _columnsArray = [] }) {
 
 	// _columns --> _columnsArray
 	return Object.values(_columns)
-		.filter(({ _deleted }) => !_deleted)
-		.map((col, index) => {
+		.filter(({ _deleted }: any) => !_deleted)
+		.map((col: any, index) => {
 			return {
 				orderAdvantage: 'order' in col ? 1 : -1,
 				order: typeof col.order === 'number' ? col.order : col.index,
@@ -47,7 +53,7 @@ export const defaultState = {
 }
 
 export const mutations = {
-	orderBefore(store, fromColumn, toColumn) {
+	orderBefore(store: any, fromColumn: any, toColumn: any) {
 		const { state } = store
 		if (fromColumn.id === toColumn.id) return
 		const fromIndex = getColumnIndex(state, fromColumn)
@@ -56,14 +62,14 @@ export const mutations = {
 		const toIndex = getColumnRealIndex(state, toColumn)
 		state._columnsArray.splice(toIndex, 0, fromColumn)
 
-		state._columnsArray.forEach((col, index) => {
+		state._columnsArray.forEach((col: any, index: number) => {
 			col.order = index
 			col.index = index
 		})
 		store.emit('orderChange', getOrderedColumns(state))
 		store.commit('updateColumns')
 	},
-	setOrderedColumns(store, columns) {
+	setOrderedColumns(store: any, columns: any) {
 		setColumnsArray(store.state, 'orderedColumns', ['prop', 'order'], columns)
 		store.commit('updateColumns', {
 			emitChange: false,