Hacktoberfest 2026: the issues maintainers tagged for October, open and beginner-friendly. Browse Hacktoberfest issues

[Feat]: Filter bar: contains, starts with, ends with, is empty operators for text columns

Open
  • Is something wrong?
#852 2 comments 0 reactions 1 assignee View on GitHub

Maintainers usually reply within 1 day

@Detoy is already working on this.

Since Oct 8, 2026.

Assessment

Difficulty
3/5
Estimated time
1-2 days
Newbie friendliness
72/100
Issue type
Feature
Clarity
Clearly specified
Activity status
Active
Tech stack
react, sql, typescript
Domain
database, frontend

Research direction

Start with src/utils/filterBar.ts and tests/utils/filterBar.test.ts to see how operators are selected and filter clauses are built. Then update src/components/ui/FilterRow.tsx and add locale keys under src/i18n/locales/ if the labels need translation. Done means the text-only operators generate the specified SQL, escape quotes and wildcard characters, hide the value input for empty checks, and pass the tests.

Written by the indexing model from the issue text.

Description

feature request good first issue
🚀 Feature Proposal

Add text-friendly operators to the structured filter bar for string columns: contains, starts with, ends with, is empty and is not empty.

Motivation

Today text columns only offer LIKE / NOT LIKE, so users have to type % wildcards by hand and remember the syntax. "Is empty" should catch both NULL and '' in one step, which is what people usually mean.

Where to start
  • src/utils/filterBar.ts: extend FilterOperator, getOperatorsForType and buildSingleFilterClause.
    • contains → col LIKE '%v%', starts with → 'v%', ends with → '%v'
    • is empty → (col IS NULL OR col = ''), is not empty → the negation
    • escape % and _ inside the value so they match literally
  • src/components/ui/FilterRow.tsx: add the two no-value operators to NO_VALUE_OPS; consider readable labels via i18n instead of raw SQL tokens.
Acceptance criteria
  • The new operators appear for text columns only.
  • Generated SQL is correct; quotes and wildcard characters in the value are escaped.
  • "Is empty" / "is not empty" hide the value input.
  • Unit tests added to tests/utils/filterBar.test.ts.
Contributor notes
  • Follow the repo rules in .rules/ (TypeScript, React, design tokens, accessibility, testing).
  • Any new UI string needs a key in every locale under src/i18n/locales/.
  • Run pnpm lint, pnpm typecheck and pnpm test before opening the PR.
  • Questions? Ask here or on Discord.
Dominant language
TypeScript
Stars
5.1k
Forks
335
Avg merge
1d 22h
Merged PRs (30d)
75

Getting set up

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

More from TabularisDB/tabularis

All issues in TabularisDB/tabularis

Similar issues

More TypeScript issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.