From b67966a9fb9f93df6e156bde6c879b618d225dec Mon Sep 17 00:00:00 2001 From: Adria Navarro Date: Fri, 27 Dec 2024 09:23:53 +0100 Subject: [PATCH] Initial typing --- .../stores/{clipboard.js => clipboard.ts} | 60 +++++++++++++------ .../src/components/grid/stores/index.ts | 6 +- .../src/components/grid/stores/ui.ts | 2 + 3 files changed, 49 insertions(+), 19 deletions(-) rename packages/frontend-core/src/components/grid/stores/{clipboard.js => clipboard.ts} (81%) diff --git a/packages/frontend-core/src/components/grid/stores/clipboard.js b/packages/frontend-core/src/components/grid/stores/clipboard.ts similarity index 81% rename from packages/frontend-core/src/components/grid/stores/clipboard.js rename to packages/frontend-core/src/components/grid/stores/clipboard.ts index 1cb75b38b1..a4d117f219 100644 --- a/packages/frontend-core/src/components/grid/stores/clipboard.js +++ b/packages/frontend-core/src/components/grid/stores/clipboard.ts @@ -1,9 +1,30 @@ -import { derived, writable, get } from "svelte/store" +import { derived, writable, get, Writable, Readable } from "svelte/store" import { Helpers } from "@budibase/bbui" import { parseCellID, getCellID } from "../lib/utils" import { NewRowID } from "../lib/constants" +import { Store as StoreContext } from "." -export const createStores = () => { +interface ClipboardStore { + clipboard: Writable<{ value: any; multiCellCopy: boolean }> +} + +interface ClipboardDerivedStore { + copyAllowed: Readable + pasteAllowed: Readable +} + +interface ClipboardActions { + clipboard: ClipboardStore["clipboard"] & { + actions: { + copy: any + paste: any + } + } +} + +export type Store = ClipboardStore & ClipboardDerivedStore & ClipboardActions + +export const createStores = (): ClipboardStore => { const clipboard = writable({ value: null, multiCellCopy: false, @@ -13,7 +34,7 @@ export const createStores = () => { } } -export const deriveStores = context => { +export const deriveStores = (context: StoreContext): ClipboardDerivedStore => { const { clipboard, focusedCellAPI, selectedCellCount, config, focusedRowId } = context @@ -60,7 +81,7 @@ export const deriveStores = context => { } } -export const createActions = context => { +export const createActions = (context: StoreContext): ClipboardActions => { const { clipboard, focusedCellAPI, @@ -92,11 +113,11 @@ export const createActions = context => { const $rowChangeCache = get(rowChangeCache) // Extract value of each selected cell, accounting for the change cache - let value = [] - for (let row of $selectedCells) { + const value = [] + for (const row of $selectedCells) { const rowValues = [] - for (let cellId of row) { - const { rowId, field } = parseCellID(cellId) + for (const cellId of row) { + const { rowId = "", field = "" } = parseCellID(cellId) const row = { ...$rowLookupMap[rowId], ...$rowChangeCache[rowId], @@ -113,7 +134,7 @@ export const createActions = context => { }) } else { // Single value to copy - const value = $focusedCellAPI.getValue() + const value = $focusedCellAPI?.getValue() clipboard.set({ value, multiCellCopy, @@ -130,7 +151,7 @@ export const createActions = context => { } // Pastes the previously copied value(s) into the selected cell(s) - const paste = async progressCallback => { + const paste = async (progressCallback: () => void) => { if (!get(pasteAllowed)) { return } @@ -166,8 +187,8 @@ export const createActions = context => { const { rowId, field } = parseCellID($focusedCellId) const $rowLookupMap = get(rowLookupMap) const $columnLookupMap = get(columnLookupMap) - const rowIdx = $rowLookupMap[rowId].__idx - const colIdx = $columnLookupMap[field].__idx + const rowIdx = $rowLookupMap[rowId!].__idx + const colIdx = $columnLookupMap[field!].__idx || 0 // Get limits of how many rows and columns we're able to paste into const $rows = get(rows) @@ -187,7 +208,7 @@ export const createActions = context => { // Paste into target cell range if (targetCellId === $focusedCellId) { // Single cell edge case - get(focusedCellAPI).setValue(value[0][0]) + get(focusedCellAPI)?.setValue(value[0][0]) } else { // Select the new cells to paste into, then paste selectedCells.actions.selectRange($focusedCellId, targetCellId) @@ -201,13 +222,16 @@ export const createActions = context => { await pasteIntoSelectedCells(newValue, progressCallback) } else { // Single to single - just update the cell's value - get(focusedCellAPI).setValue(value) + get(focusedCellAPI)?.setValue(value) } } } // Paste the specified value into the currently selected cells - const pasteIntoSelectedCells = async (value, progressCallback) => { + const pasteIntoSelectedCells = async ( + value: string[][], + progressCallback: () => any + ) => { const $selectedCells = get(selectedCells) // Find the extent at which we can paste @@ -215,11 +239,13 @@ export const createActions = context => { const colExtent = Math.min(value[0].length, $selectedCells[0].length) // Build change map - let changeMap = {} + let changeMap: Record> = {} for (let rowIdx = 0; rowIdx < rowExtent; rowIdx++) { for (let colIdx = 0; colIdx < colExtent; colIdx++) { const cellId = $selectedCells[rowIdx][colIdx] - const { rowId, field } = parseCellID(cellId) + let { rowId, field } = parseCellID(cellId) + rowId = rowId! + field = field! if (!changeMap[rowId]) { changeMap[rowId] = {} } diff --git a/packages/frontend-core/src/components/grid/stores/index.ts b/packages/frontend-core/src/components/grid/stores/index.ts index 81e0e824b0..b5676ca241 100644 --- a/packages/frontend-core/src/components/grid/stores/index.ts +++ b/packages/frontend-core/src/components/grid/stores/index.ts @@ -1,4 +1,4 @@ -import { Writable } from "svelte/store" +import { Readable, Writable } from "svelte/store" import type { APIClient } from "../../../api/types" import * as Bounds from "./bounds" @@ -65,7 +65,8 @@ export type Store = BaseStore & Users.Store & Menu.Store & Filter.Store & - UI.Store & { + UI.Store & + Clipboard.Store & { // TODO while typing the rest of stores fetch: Writable sort: Writable @@ -83,6 +84,7 @@ export type Store = BaseStore & rowLookupMap: Writable width: Writable fixedRowHeight: Writable + rowChangeCache: Readable } export const attachStores = (context: Store): Store => { diff --git a/packages/frontend-core/src/components/grid/stores/ui.ts b/packages/frontend-core/src/components/grid/stores/ui.ts index 23710668b7..7196723064 100644 --- a/packages/frontend-core/src/components/grid/stores/ui.ts +++ b/packages/frontend-core/src/components/grid/stores/ui.ts @@ -13,6 +13,8 @@ export interface UIStore { focusedCellId: Writable focusedCellAPI: Writable<{ isReadonly: () => boolean + getValue: () => string + setValue: (val: string) => void } | null> selectedRows: Writable> hoveredRowId: Writable