Playground: refactor component picker plugin

[thorn0]

No description provided.

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
lexical	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Sep 20, 2023 11:19am
lexical-playground	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Sep 20, 2023 11:19am

[acywatson]

Seems fine - what's the aim here?

[thorn0]

@acywatson I was reading through this code and noticed a bunch of small things.
Commit 1: local simplifications without moving code. E.g. getting rid of ts-ignore comments and redundancies like new RegExp(/foo/). Also it fixes a bug with filtering options by keywords.
Commit 2 extracts functions out of the component because shorter functions are easier to read and because useCallback isn't really needed when the function isn't passed to a prop.

[thorn0]

This is a bug fix (parens were missing around the ternary).

[fantactuka]

keywords is not nullable so ?. is redundant

[fantactuka]

Full and partial table matchers can be replaced with a single one:

const tableMatch = queryString.match(/^(\d{1,2})x?(\d{1,2})?$/);

if (tableMatch !== null) {
  const row = Number(tableMatch[1]);
  const cols = tableMatch[2]
    ? [Number(tableMatch[2])]
    : [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

  return cols.map(col => ({
    icon: <i className="icon table" />,
    label: `${row}x${col} Table`,
    keywords: ['table'],
    onSelect: (_: string) => {
      ...
    },
  }));
}

[fantactuka]

LG!