diff --git a/packages/bbui/src/ProgressBar/ProgressBar.svelte b/packages/bbui/src/ProgressBar/ProgressBar.svelte
index 9219d068e1..41c06b4dd6 100644
--- a/packages/bbui/src/ProgressBar/ProgressBar.svelte
+++ b/packages/bbui/src/ProgressBar/ProgressBar.svelte
@@ -1,33 +1,22 @@
- {Math.round($progress)}%
+ {Math.round(value)}%
{/if}
@@ -51,7 +40,7 @@
class="spectrum-ProgressBar-fill"
class:color-green={color === "green"}
class:color-red={color === "red"}
- style={value || value === 0 ? `width: ${$progress}%` : ""}
+ style="width: {value}%; --duration: {duration}ms;"
/>
@@ -64,4 +53,7 @@
.color-red {
background: #dd2019;
}
+ .spectrum-ProgressBar-fill {
+ transition: width var(--duration) ease-out;
+ }
diff --git a/packages/frontend-core/src/components/grid/controls/ClipboardHandler.svelte b/packages/frontend-core/src/components/grid/controls/ClipboardHandler.svelte
index 5ae120d47a..ab6385bd5e 100644
--- a/packages/frontend-core/src/components/grid/controls/ClipboardHandler.svelte
+++ b/packages/frontend-core/src/components/grid/controls/ClipboardHandler.svelte
@@ -1,20 +1,25 @@
@@ -37,9 +51,17 @@
title="Confirm bulk paste"
confirmText="Continue"
cancelText="Cancel"
- onConfirm={clipboard.actions.paste}
+ onConfirm={performBulkPaste}
size="M"
>
Are you sure you want to paste? This will update multiple values.
+ {#if pasting}
+
+ {/if}
diff --git a/packages/frontend-core/src/components/grid/stores/clipboard.js b/packages/frontend-core/src/components/grid/stores/clipboard.js
index c30e53a4d5..c1a2334708 100644
--- a/packages/frontend-core/src/components/grid/stores/clipboard.js
+++ b/packages/frontend-core/src/components/grid/stores/clipboard.js
@@ -123,7 +123,7 @@ export const createActions = context => {
}
// Pastes the previously copied value(s) into the selected cell(s)
- const paste = async () => {
+ const paste = async progressCallback => {
if (!get(pasteAllowed)) {
return
}
@@ -151,7 +151,7 @@ export const createActions = context => {
}
// Paste the new value
- await pasteIntoSelectedCells(newValue)
+ await pasteIntoSelectedCells(newValue, progressCallback)
} else {
// Multi to single - expand to paste all values
// Get indices of focused cell
@@ -184,14 +184,14 @@ export const createActions = context => {
} else {
// Select the new cells to paste into, then paste
selectedCells.actions.selectRange($focusedCellId, targetCellId)
- await pasteIntoSelectedCells(value)
+ await pasteIntoSelectedCells(value, progressCallback)
}
}
} else {
if (multiCellPaste) {
// Single to multi - duplicate value to all selected cells
const newValue = get(selectedCells).map(row => row.map(() => value))
- await pasteIntoSelectedCells(newValue)
+ await pasteIntoSelectedCells(newValue, progressCallback)
} else {
// Single to single - just update the cell's value
get(focusedCellAPI).setValue(value)
@@ -200,7 +200,7 @@ export const createActions = context => {
}
// Paste the specified value into the currently selected cells
- const pasteIntoSelectedCells = async value => {
+ const pasteIntoSelectedCells = async (value, progressCallback) => {
const $selectedCells = get(selectedCells)
// Find the extent at which we can paste
@@ -219,7 +219,7 @@ export const createActions = context => {
changeMap[rowId][field] = value[rowIdx][colIdx]
}
}
- await rows.actions.bulkUpdate(changeMap)
+ await rows.actions.bulkUpdate(changeMap, progressCallback)
}
return {
diff --git a/packages/frontend-core/src/components/grid/stores/rows.js b/packages/frontend-core/src/components/grid/stores/rows.js
index ad8024b403..6f9794c2da 100644
--- a/packages/frontend-core/src/components/grid/stores/rows.js
+++ b/packages/frontend-core/src/components/grid/stores/rows.js
@@ -524,7 +524,7 @@ export const createActions = context => {
}
}
- const bulkUpdate = async changeMap => {
+ const bulkUpdate = async (changeMap, progressCallback) => {
const rowIds = Object.keys(changeMap || {})
if (!rowIds.length) {
return
@@ -533,8 +533,10 @@ export const createActions = context => {
// Update rows
let updated = []
let failed = 0
- for (let rowId of rowIds) {
+ for (let i = 0; i < rowIds.length; i++) {
+ const rowId = rowIds[i]
if (!Object.keys(changeMap[rowId] || {}).length) {
+ progressCallback?.((i + 1) / rowIds.length)
continue
}
try {
@@ -554,6 +556,7 @@ export const createActions = context => {
failed++
console.error("Failed to update row", error)
}
+ progressCallback?.((i + 1) / rowIds.length)
}
// Update state