multi buffer support in editor

[argshook]

This PR implements support for multiple editor tabs

• at least 1 tab is always visible
• open tab with
  • click + next to last tab
  • alt + t keyboard shortcut
  • menu (F1) entry "add new tab"
• close tab with
  • click x on tab
  • alt + w keyboard shortcut
  • menu (F1) entry "close active tab"
• tab content (internally called buffer) is saved to browsers IndexedDB
  (not localStorage anymore). This way no need to worry about 5MB
  browser storage limit, user can have as many tabs with as much content
  as they like
• full editor view state is saved and restored. Previously only cursor
  position was saved. In addition to those, this PR now saves and
  restores text selection, scroll position and code folds
• there's now a nice infra for managing buffers. Implementing things
  like "reopen closed tabs" and "tab drawer" will be trivial

[bluestreak01]

there is tab flicker when new tab is added:

QuestDB.Console.-.Google.Chrome.2022-10-27.11-09-19.mp4

[bluestreak01]

Not a fan of horizonal scrollbar:

[bluestreak01]

when there are too many tabs, UX is terrible:

QuestDB.Console.-.Google.Chrome.2022-10-27.11-14-30.mp4

Compare this to Chrome UX at the same position:

New.Tab.-.Google.Chrome.2022-10-27.11-16-14.mp4

[bluestreak01]

there is scroll bug - text I cannot access in editor:

[bluestreak01]

let me summarise my feedback

ergonomics of the editor(s)

• very good overall, nothing major. Editor content is memorised, so is cursor and scroll position.
• small resize issue, if you move horizontal splitter up and down, in certain positions editor doesn't resize correctly

ergonomics of the tabs

• look and feel should be consistent with tabs that switch between grid and charts. In fact these should not be copies but rather full on button reuse if possible. I hope react allows for that
• I increasingly convince myself that google chrome's tab ergonomics are the best (and most proven)

• new tab button should perhaps be more pronounced, including pronunciation of the hover. It should be entered
• when tabs fill all available horizontal space "new tab" button should remain in place (it does already) and be perfectly entered (it isn't entered)
• when space if filled and new tab is added, new and existing tabs should resize (shrink)
• tabs should keep shrinking progressively. After some point lose text and keep shrinking icon until size at minimum
• when tabs reach their absolute min size - the real estate of tabs should no longer change
• ergonomics of tab close button are very good, close button stays in place while space is filled
• tab resize should be animated (see how does chrome do animation)
• opening and closing tabs should be animated in opposite directions (see chrome)
• we can attempt to style all our tabs like chrome (https://adamschwartz.co/chrome-tabs/)

I am happy to help with all of this, but I will need pointers on how to do this in react efficiently. Perhaps some time to walk me thru the relevant code base ?

[argshook]

@bluestreak01 thanks, Vlad, this is really helpful! I'll gromulate these points in my head and will get back to you