Solid => Form + Table State Sync

[split breach]

I could create a signal with the default field value and synchronize it with the form state, but the state is already managed by the form, isn't it?

I've tried things like this:

  const table = createSolidTable({
    data: layersField().state.value,
    columns,
    getCoreRowModel: getCoreRowModel(),
  });

Solid => Form + Table State Sync

[split breach]

My bad, table with Solid need a getter 🤦

  const table = createSolidTable({
    get data() {
      return layersField().state.value;
    },
    columns,
    getCoreRowModel: getCoreRowModel(),
  });

[opaque relic]

I'm just curious: do you need the signal? Can't you use form.useStore((state) => state.values) like this:

  const formValues = form.useStore((state) => state.values);

  const table = createSolidTable({
    get data() {
      return formValues;
    },
    columns,
    getCoreRowModel: getCoreRowModel(),
  });

[split breach]

I think this work too, i'll try

Well, this isn't working. I suppose the table data needs to be reactive to trigger re-renders.

[opaque relic]

it should be by using the store…

[split breach]

// Not working
const table = createSolidTable({
  get data() {
    return form.useStore((state) => state.values.layers);
  },
  columns,
  getCoreRowModel: getCoreRowModel(),
});

// Working
const table = createSolidTable({
  get data() {
    return form.useStore((state) => state.values.layers)();
  },
  columns,
  getCoreRowModel: getCoreRowModel(),
});

// Not Working
const data = form.useStore((state) => state.values.layers);

const table = createSolidTable({
  get data() {
    return data();
  },
  columns,
  getCoreRowModel: getCoreRowModel(),
});

// Not Working
const data = form.useStore((state) => state.values.layers);

const table = createSolidTable({
  get data() {
    return data;
  },
  columns,
  getCoreRowModel: getCoreRowModel(),
});

It's a “problem” with the way reactivity is handled in Solid, isn't it? I'm not familiar with Solid, so I can't say for sure.

[opaque relic]

Probably 👍 I guess it'll work in React though

[split breach]

Yes probably

[opaque relic]

Thanks for trying it out 🙂