Fix issue with dates and blur grids when interacting with header cells

This commit is contained in:
Andrew Kingston 2024-04-25 14:26:01 +01:00
parent 8ac58fc0e7
commit 55014e304e
4 changed files with 16 additions and 7 deletions

View File

@ -179,6 +179,11 @@ export const stringifyDate = (
const day = `${value.date()}`.padStart(2, "0") const day = `${value.date()}`.padStart(2, "0")
return `${year}-${month}-${day}T00:00:00.000` return `${year}-${month}-${day}T00:00:00.000`
} }
// Otherwise use a normal ISO string with time and timezone
else {
return value.toISOString()
}
} }
// Formats a dayjs date according to schema flags // Formats a dayjs date according to schema flags

View File

@ -104,6 +104,7 @@
} }
const onMouseDown = e => { const onMouseDown = e => {
ui.actions.blur()
if ((e.touches?.length || e.button === 0) && orderable) { if ((e.touches?.length || e.button === 0) && orderable) {
timeout = setTimeout(() => { timeout = setTimeout(() => {
reorder.actions.startReordering(column.name, e) reorder.actions.startReordering(column.name, e)

View File

@ -3,10 +3,10 @@
import { Icon } from "@budibase/bbui" import { Icon } from "@budibase/bbui"
import GridPopover from "../overlays/GridPopover.svelte" import GridPopover from "../overlays/GridPopover.svelte"
const { visibleColumns, scroll, width, subscribe } = getContext("grid") const { visibleColumns, scroll, width, subscribe, ui } = getContext("grid")
let anchor let anchor
let open = false let isOpen = false
$: columnsWidth = $visibleColumns.reduce( $: columnsWidth = $visibleColumns.reduce(
(total, col) => (total += col.width), (total, col) => (total += col.width),
@ -15,8 +15,13 @@
$: end = columnsWidth - 1 - $scroll.left $: end = columnsWidth - 1 - $scroll.left
$: left = Math.min($width - 40, end) $: left = Math.min($width - 40, end)
const open = () => {
ui.actions.blur()
isOpen = true
}
const close = () => { const close = () => {
open = false isOpen = false
} }
onMount(() => subscribe("close-edit-column", close)) onMount(() => subscribe("close-edit-column", close))
@ -29,11 +34,11 @@
bind:this={anchor} bind:this={anchor}
class="add" class="add"
style="left:{left}px" style="left:{left}px"
on:click={() => (open = true)} on:click={open}
> >
<Icon name="Add" /> <Icon name="Add" />
</div> </div>
{#if open} {#if isOpen}
<GridPopover <GridPopover
{anchor} {anchor}
align={$visibleColumns.length ? "right" : "left"} align={$visibleColumns.length ? "right" : "left"}

View File

@ -32,7 +32,6 @@ export const createActions = context => {
scroll, scroll,
bounds, bounds,
stickyColumn, stickyColumn,
ui,
maxScrollLeft, maxScrollLeft,
width, width,
} = context } = context
@ -45,7 +44,6 @@ export const createActions = context => {
const $visibleColumns = get(visibleColumns) const $visibleColumns = get(visibleColumns)
const $bounds = get(bounds) const $bounds = get(bounds)
const $stickyColumn = get(stickyColumn) const $stickyColumn = get(stickyColumn)
ui.actions.blur()
// Generate new breakpoints for the current columns // Generate new breakpoints for the current columns
let breakpoints = $visibleColumns.map(col => ({ let breakpoints = $visibleColumns.map(col => ({