Chore bump daisy UI to latest, eslint changes

.eslintrc.cjs

@@ -3,7 +3,7 @@ module.exports = {
     browser: true,
     es2021: true,
   },
-  plugins: ['@typescript-eslint', 'react', 'react-refresh'],
+  plugins: ['simple-import-sort', 'react', 'react-refresh', 'node-import'],
   extends: [
     'eslint:recommended',
     'plugin:@typescript-eslint/strict-type-checked',
@@ -68,5 +68,21 @@ module.exports = {
       'warn',
       { allowConstantExport: true },
     ],
+
+    // stylistic
+    'object-shorthand': ['error', 'always'],
+    'func-style': ['error', 'expression'],
+    'simple-import-sort/imports': 'error',
+    'simple-import-sort/exports': 'error',
+    'node-import/prefer-node-protocol': 'error',
+    'import/consistent-type-specifier-style': ['error', 'prefer-inline'],
+    '@typescript-eslint/consistent-type-exports': 'error',
+    '@typescript-eslint/consistent-type-imports': 'error',
   },
+  ignorePatterns: [
+    'node_modules/',
+    'dist/',
+    'coverage/',
+    'vite.config.ts.*.mjs',
+  ],
 }

README.md

@@ -36,7 +36,7 @@ degit jimmy-guzman/react-starter
 
 ## Getting Started
 
-Make sure you're using [node 20](https://nodejs.dev/en/about/releases), I recommend using [fnm](https://github.com/Schniz/fnm) which will allow to simply run:
+Make sure you're using [node 20](https://nodejs.dev/en/about/releases), I recommend using [fnm](https://github.com/Schniz/fnm) which will allow you to simply run:
 
 ```
 fnm use
@@ -48,6 +48,12 @@ First install dependencies with [pnpm](https://pnpm.io/installation), by running
 pnpm install
 ```
 
+And to download new browsers for Playwright, run the following command:
+
+```
+pnpm exec playwright install
+```
+
 Then to run the development server, run the following command:
 
 ```

e2e/app.spec.ts

@@ -1,4 +1,4 @@
-import { test, expect } from '@playwright/test'
+import { expect, test } from '@playwright/test'
 
 test('has title', async ({ page }) => {
   await page.goto('http://localhost:5173/')

package.json

@@ -36,17 +36,19 @@
     "@vitejs/plugin-react-swc": "3.5.0",
     "@vitest/coverage-v8": "0.34.6",
     "autoprefixer": "10.4.16",
-    "daisyui": "3.9.3",
+    "daisyui": "4.4.2",
     "eslint": "8.54.0",
     "eslint-config-prettier": "9.0.0",
     "eslint-import-resolver-typescript": "3.6.1",
     "eslint-plugin-import": "2.29.0",
     "eslint-plugin-jest": "27.6.0",
     "eslint-plugin-jest-dom": "5.1.0",
     "eslint-plugin-jsx-a11y": "6.8.0",
+    "eslint-plugin-node-import": "1.0.4",
     "eslint-plugin-react": "7.33.2",
     "eslint-plugin-react-hooks": "4.6.0",
     "eslint-plugin-react-refresh": "0.4.4",
+    "eslint-plugin-simple-import-sort": "10.0.0",
     "eslint-plugin-testing-library": "6.1.2",
     "gitzy": "4.0.0",
     "jsdom": "22.1.0",

src/App.tsx

@@ -6,11 +6,11 @@ import typeScriptLogo from './assets/typescript.svg'
 import viteLogo from './assets/vite.svg'
 import { Logo } from './components/Logo'
 
-function App() {
+export default function App() {
   const [count, setCount] = useState(0)
 
   return (
-    <div className='container prose mx-auto p-4 text-center'>
+    <div className='container prose dsy-prose mx-auto p-4 text-center'>
       <div className='mb-8 flex items-center justify-center gap-8'>
         <Logo name='Vite' link='https://vitejs.dev' imgSrc={viteLogo} />
         <Logo name='React' link='https://react.dev' imgSrc={reactLogo} />
@@ -28,7 +28,7 @@ function App() {
       <h1>Vite + React + TypeScript + tailwindcss</h1>
       <div>
         <button
-          className='btn'
+          className='dsy-btn'
           onClick={() => {
             setCount((prevCount) => prevCount + 1)
           }}
@@ -52,5 +52,3 @@ function App() {
     </div>
   )
 }
-
-export default App

src/main.tsx

@@ -1,15 +1,16 @@
-import React from 'react'
+import './index.css'
+
+import { StrictMode } from 'react'
 import { createRoot } from 'react-dom/client'
 
 import App from './App'
-import './index.css'
 
 const root = document.getElementById('root')
 
 if (root) {
   createRoot(root).render(
-    <React.StrictMode>
+    <StrictMode>
       <App />
-    </React.StrictMode>
+    </StrictMode>
   )
 }

src/test/utils.tsx

@@ -16,5 +16,5 @@ const customRender = (ui: React.ReactElement, options = {}) => {
   }
 }
 
-export { screen, renderHook, within } from '@testing-library/react'
+export { renderHook, screen, within } from '@testing-library/react'
 export { customRender as render }

tailwind.config.js

@@ -10,6 +10,7 @@ export default {
   daisyui: {
     // see https://daisyui.com/docs/themes/ for further customization
     themes: ['dark'],
+    prefix: 'dsy-',
     logs: false,
   },
   plugins: [typography, daisyui],

vite.config.ts

@@ -1,4 +1,4 @@
-import path from 'path'
+import path from 'node:path'
 
 import react from '@vitejs/plugin-react-swc'
 import { defineConfig } from 'vite'