build(ui): migrate from CRA/Jest to Vite/Vitest (#3311)

* feat: create vite project

* feat: it's alive!

* feat: `make dev` working!

* feat: replace custom serviceWorker with vite plugin

* test: replace Jest with Vitest

* fix: run prettier

* fix: skip eslint for now.

* chore: remove ui.old folder

* refactor: replace lodash.pick with simple destructuring

* fix: eslint errors (wip)

* fix: eslint errors (wip)

* fix: display-name eslint errors (wip)

* fix: no-console eslint errors (wip)

* fix: react-refresh/only-export-components eslint errors (wip)

* fix: react-refresh/only-export-components eslint errors (wip)

* fix: react-refresh/only-export-components eslint errors (wip)

* fix: react-refresh/only-export-components eslint errors (wip)

* fix: build

* fix: pwa manifest

* refactor: pwa manifest

* refactor: simplify PORT configuration

* refactor: rename simple JS files

* test: cover playlistUtils

* fix: react-image-lightbox

* feat(ui): add sourcemaps to help debug issues

ui/src/common/MultiLineTextField.test.js

@@ -1,28 +0,0 @@
-import * as React from 'react'
-import { render, cleanup, screen } from '@testing-library/react'
-import { MultiLineTextField } from './MultiLineTextField'
-
-describe('<MultiLineTextField />', () => {
-  afterEach(cleanup)
-
-  it('should render each line in a separated div', () => {
-    const record = { comment: 'line1\nline2' }
-    render(<MultiLineTextField record={record} source={'comment'} />)
-    expect(screen.queryByTestId('comment.0').textContent).toBe('line1')
-    expect(screen.queryByTestId('comment.1').textContent).toBe('line2')
-  })
-
-  it.each([null, undefined])(
-    'should render the emptyText when value is %s',
-    (body) => {
-      render(
-        <MultiLineTextField
-          record={{ id: 123, body }}
-          emptyText="NA"
-          source="body"
-        />,
-      )
-      expect(screen.getByText('NA')).toBeInTheDocument()
-    },
-  )
-})