"Tags filtering" functionality

[fromaline]

First off, great library! I use it for my project and it gets work done really good 🙏

I encountered a use case where I need to implement tags for the table. It's a row of buttons above the table with common filters.
For example, if table shows users data, the tags could be "Man" and "Woman".

It's pretty ease to emplement using built in writable primitive:

<script lang="ts">
  const activeTag: 'man' | 'woman' | 'none' = 'none'

  const tableData = writable(data)

  const table = createTable(tableData)

  $: if (activeTag === 'man') {
    tableData.set(data.filter(person => person.gender === 'man'))
  } else if (activeTag === 'woman') {
    tableData.set(data.filter(person => person.gender === 'woman'))
  } else if (activeTag === 'none') {
    tableData.set(data)
  }
</script>

<div>
  <button 
    on:click={() => {
      if (activeTag === 'none') {
        activeTag = 'man'
      } else if (activeTag === 'woman') {
        activeTag = 'man'
      } else if (activeTag === 'man') {
        activeTag = 'none'
      }
    }}
    class:active={activeTag === 'man'}
  >
    Man
  </button>

  <button 
    on:click={() => {
      if (activeTag === 'none') {
        activeTag = 'woman'
      } else if (activeTag === 'man') {
        activeTag = 'woman'
      } else if (activeTag === 'woman') {
        activeTag = 'none'
      }
    }}
    class:active={activeTag === 'woman'}
  >
    Woman
  </button>
</div>

<table {...$tableAttrs}>
  <!-- other stuff -->
</table>

But it would be really cool if there was a plugin for it. I imagine it like that:

<script lang="ts">
  const activeTag: 'man' | 'woman' | 'none' = 'none'

  const tableData = writable(data)

  const table = createTable(tableData, {
    tagFiltering: addTagFiltering({
      fn: (prevData) => {
        if (activeTag === 'man') {
          return data.filter(person => person.gender === 'man')
        } else if (activeTag === 'woman') {
          return data.filter(person => person.gender === 'woman')
        } else if (activeTag === 'none') {
          return data
        }
      }
    })
  })
</script>

Do you think it worth implementing? Or is it waste of time?