bryanmylee / svelte-headless-table

Unopinionated and extensible data tables for Svelte
https://svelte-headless-table.bryanmylee.com/
487 stars 32 forks source link

`props.sort.order` not updated while using the filter and pagination plugins #148

Open Ennoriel opened 1 year ago

Ennoriel commented 1 year ago

Thanks for your awesome library! :)

I've been struggling to understand where my problem comes from. I am using the filter and pagination plugins in order to use the component asyncronously with a fetch call. At the moment I do not make any fetch call but fake it with a promise/setTimeout. When doing so, the value of props.sort.order is not fully updated (sometimes using it as the condition of an if block works).

here is a REPL with my code: https://svelte.dev/repl/5f845383976b49e3a5edb4a0ad9a1953?version=4.2.0 (the order indication "up" and "down" does not work)

Do you know where this behavior comes from?

There is a workaround using the table state.

codenius commented 1 year ago

I experienced this issue too. Can you share the workaround, while it's not fixed yet?

Ennoriel commented 1 year ago

@codenius You have access to a global sortKeys store: const { sortKeys } = pluginStates.sort;. You can use that to display anything you want

hartwm commented 11 months ago

came here for this

codenius commented 9 months ago

@codenius You have access to a global sortKeys store: const { sortKeys } = pluginStates.sort;. You can use that to display anything you want

What's interesting although, that as soon as I add these to lines inside the script tag, it suddenly all works perfectly fine. There were no additional changes requierd in my case, which indicates a weird reactivity issue under the hood. In another table hover, this trick didn't work.

const { sortKeys } = pluginStates.sort;
$: $sortKeys