TanStackT
TanStack8mo ago
1 reply
moderate-tomato

Update options.meta

The meta never updates / rerenders when using the table.setOptions function
 header: ({ table, column }) => {
      const loadUnit = table.options.meta?.loadUnit;

      return (
        <div className="flex items-center gap-2">
          <pre>{JSON.stringify(table.options.meta)}</pre>
          <DataTableColumnHeader column={column} title={`Load (${loadUnit})`} />
          <Select
            value={undefined}
            onValueChange={(value) => {
              table.setOptions((prev) => ({
                ...prev,
                meta: {
                  ...prev.meta,
                  loadUnit: value as 'lb' | 'kg',
                },
              }));
            }}
          >
            <SelectTrigger className="w-[100px]">
              <SelectValue placeholder="Select unit" />
            </SelectTrigger>
            <SelectContent align="start">
              {LOAD_UNIT_ENUM.map((unit) => (
                <SelectItem key={unit} value={unit}>
                  {unit}
                </SelectItem>
              ))}
            </SelectContent>
          </Select>
        </div>
      );
    },
Was this page helpful?