add missing favicon and update README

also: use eslint configuration recommended by vite

Author: severo

apps/hightable-demo/README.md

@@ -1,50 +1,18 @@
-# React + TypeScript + Vite
+# HighTable demo
 
-This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
+This is an example project showing how to use [hightable](https://github.com/hyparam/hightable).
 
-Currently, two official plugins are available:
+## Build
 
-- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh
-- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
-
-## Expanding the ESLint configuration
-
-If you are developing a production application, we recommend updating the configuration to enable type aware lint rules:
-
-- Configure the top-level `parserOptions` property like this:
-
-```js
-export default tseslint.config({
-  languageOptions: {
-    // other options...
-    parserOptions: {
-      project: ['./tsconfig.node.json', './tsconfig.app.json'],
-      tsconfigRootDir: import.meta.dirname,
-    },
-  },
-})
+```bash
+cd apps/hightable-demo
+npm i
+npm run build
 ```
 
-- Replace `tseslint.configs.recommended` to `tseslint.configs.recommendedTypeChecked` or `tseslint.configs.strictTypeChecked`
-- Optionally add `...tseslint.configs.stylisticTypeChecked`
-- Install [eslint-plugin-react](https://github.com/jsx-eslint/eslint-plugin-react) and update the config:
-
-```js
-// eslint.config.js
-import react from 'eslint-plugin-react'
+The build artifacts will be stored in the `dist/` directory and can be served using any static server, eg. `http-server`:
 
-export default tseslint.config({
-  // Set the react version
-  settings: { react: { version: '18.3' } },
-  plugins: {
-    // Add the react plugin
-    react,
-  },
-  rules: {
-    // other rules...
-    // Enable its recommended rules
-    ...react.configs.recommended.rules,
-    ...react.configs['jsx-runtime'].rules,
-  },
-})
+```bash
+npm i -g http-server
+http-server dist/
 ```

apps/hightable-demo/eslint.config.js

@@ -1,19 +1,27 @@
 import js from '@eslint/js'
-import globals from 'globals'
+import react from 'eslint-plugin-react'
 import reactHooks from 'eslint-plugin-react-hooks'
 import reactRefresh from 'eslint-plugin-react-refresh'
+import globals from 'globals'
 import tseslint from 'typescript-eslint'
 
 export default tseslint.config(
   { ignores: ['dist'] },
   {
-    extends: [js.configs.recommended, ...tseslint.configs.recommended],
-    files: ['**/*.{ts,tsx}'],
+    extends: [js.configs.recommended, ...tseslint.configs.strictTypeChecked, ...tseslint.configs.stylisticTypeChecked],
+    // Set the react version
+    settings: { react: { version: '18.3' } },
+    files: ['src/**/*.{ts,tsx}'],
     languageOptions: {
       ecmaVersion: 2020,
       globals: globals.browser,
+      parserOptions: {
+        project: './tsconfig.json',
+        tsconfigRootDir: import.meta.dirname,
+      },
     },
     plugins: {
+      react,
       'react-hooks': reactHooks,
       'react-refresh': reactRefresh,
     },
@@ -23,6 +31,10 @@ export default tseslint.config(
         'warn',
         { allowConstantExport: true },
       ],
+      ...react.configs.recommended.rules,
+      ...react.configs['jsx-runtime'].rules,
+
+      '@typescript-eslint/restrict-template-expressions': 'off',
     },
   },
 )

apps/hightable-demo/package.json

@@ -20,6 +20,7 @@
     "@types/react-dom": "^18.3.1",
     "@vitejs/plugin-react": "^4.3.3",
     "eslint": "^9.13.0",
+    "eslint-plugin-react": "^7.37.2",
     "eslint-plugin-react-hooks": "^5.0.0",
     "eslint-plugin-react-refresh": "^0.4.14",
     "globals": "^15.11.0",

apps/hightable-demo/public/favicon.png

@@ -7,21 +7,21 @@ function lorem(rand: number, length: number): string {
 }
 
 function delay<T>(value: T, ms: number): Promise<T> {
-  return new Promise(resolve => setTimeout(() => resolve(value), ms))
+  return new Promise(resolve => setTimeout(() => { resolve(value);}, ms))
 }
 
 const header = ['ID', 'Name', 'Age', 'UUID', 'Text', 'JSON']
 const mockData = {
   header,
   numRows: 10000,
   rows(start: number, end: number) {
-    const arr: Array<Record<string, ReturnType<typeof wrapPromise<string | number>>>> = []
+    const arr: Record<string, ReturnType<typeof wrapPromise<string | number>>>[] = []
     for (let i = start; i < end; i++) {
       const rand = Math.abs(Math.sin(i + 1))
       const uuid = rand.toString(16).substring(2)
       const partial = {
         ID: i + 1,
-        Name: 'Name' + i,
+        Name: `Name${i}`,
         Age: 20 + i % 80,
         UUID: uuid,
         Text: lorem(rand, 100),