[Feature Request] LinkedQueryParam | Support signal keys

[kyjus25]

Background

I am attempting to use linkedQueryParam in my generic table component to record the search input string as a query param. The code looks like this:

protected globalFilter = linkedQueryParam<string>('globalFilter', {
  parse: (value) => value || '',
  stringify: (value) => value || null,
});

If I have multiple tables on the same page, I want them to each record their query param independent of each other so that they do not incorrectly share globalFilter values as the tables may be unrelated.

I have a name() signal that I use for other parts of the table (such as for the placeholder input text "Search ...", or for the CSV file name when exporting the table), and I would like to set the linkedQueryParam key to a computed value based on the name so that the query params can coexist.

Proposed Solution

Allow the key parameter to accept a signal/computed value so that the following could be possible (undefined would be ignored and would no-op until a value becomes available):

public name = input.required<string>();

private filterQueryName = computed<string | undefined>(() => {
  if (!this.name()) return undefined;
  return `${this.name()}Filter`;
});

protected globalFilter = linkedQueryParam<string>(this.filterQueryName(), {
  parse: (value) => value || '',
  stringify: (value) => value || null,
});

Current Behavior

If you attempt to use an input signal (such as this.name()), the query param key becomes the text "undefined" because the signal has not been initialized yet