I am building an **Electron desktop app** using **React, Vite, ShadCN, Jotai, React Query, and SQLite** for state and data management. The app is a **high school library management system** used exclusively by the **school director**. The app will manage **books, students, loans, archives**, and offer **statistics** to show the necessary data in an easy-to-understand format. Below is a detailed breakdown of the project's requirements and architecture:

### **Project Details:**
1. **Authentication**:
   - The app should have a **login page** to authenticate users, only allowing access to the school director.
   - There should also be a **welcome page** for first-time users that helps register the first account.
   - Passwords should be securely hashed using **bcrypt**.

2. **Main Pages**:
   - **Main Page (Dashboard)**: This should display **statistics** related to the system (total books, students, active loans, etc.).
   - **Books Page**: 
     - This page allows for **adding, editing, deleting** books.
     - Books should be organized by **school year** (the system needs to manage different school years).
   - **Students Page**:
     - Add, edit, delete students.
     - Add students via **Excel import** (use the xlsx library for this feature).
   - **Loans Page**:
     - Show both **open** and **completed loans** with their statuses.
     - Ability to **add or delete loans**.
     - Loans should only be created for students who have a **library card**.
   - **Archive Page**:
     - A simple table displaying archived items.
     - Add, edit, and delete archive items.
   - **Statistics Page**:
     - Display key data points in a visually appealing format (use **charts** to represent loan statuses, number of books, etc.).

3. **School Year Management**:
   - Each dataset (books, students, loans) should be associated with a **school year**.
   - Users should be able to select a school year and add/edit/delete the data for that specific year.
   - When switching between school years, all data should update accordingly.

4. **SQLite Database**:
   - Use **SQLite** as the local database to store all data (books, students, loans, archives, users).
   - Each table in the database should include a **school year field** to track which data belongs to which year.
   - Ensure **CRUD operations** for books, students, loans, and archives work properly.

5. **General Requirements**:
   - The app should be **fast** and **lightweight** (use Vite for fast builds).
   - **Electron** should handle the **main process** (window management, database access) and securely pass information to the **React frontend** using **IPC (Inter-Process Communication)**.
   - **Preload scripts** should be used to securely expose APIs for React to interact with the SQLite database.
   - Use **Jotai** for global state management (for user sessions, school year selection, etc.).
   - Use **React Query** to handle data fetching and caching between the frontend and backend.
   - The UI should be styled with **ShadCN** components to ensure a clean, professional interface.

### **Tech Stack**:
1. **Electron**: To build the desktop app and manage local file systems.
2. **React (with Vite)**: For the frontend and faster builds.
3. **ShadCN**: To ensure a modern and clean UI.
4. **Jotai**: To manage global state (such as authentication and school year selection).
5. **React Query**: To handle API fetching and caching for efficient communication with the backend.
6. **SQLite**: For the local database to store and manage books, students, loans, and archives.
7. **bcrypt**: For password hashing and user authentication.
8. **xlsx**: To allow importing student data from Excel files.

### **Detailed Requirements**:
- Explain how to implement **state management** using **Jotai** for user authentication and global school year management.
- Walk through the process of connecting the **SQLite database** to **Electron** and how to set up **IPC** to handle communication between the **main process** (Electron) and the **renderer process** (React).
- Provide instructions for setting up **React Query** to handle data fetching for books, students, and loans.
- Describe how to create **custom hooks** in the React app for various CRUD operations using the Electron API.
- Provide guidance on using **ShadCN** to build reusable components for forms, tables, and charts.
this is the boilerplate i use 
Libs and tools
To develop a Electron app, you probably will need some UI, test, formatter, style or other kind of library or framework, so let me install and configure some of them to you.

Core 🏍️
Electron 32
Vite 5
SWC
DX 🛠️
TypeScript 5
Prettier
Zod
React Query (Tan Stack)
UI 🎨
React
Tailwind CSS
Shadcn UI
Geist as default font
i18next
Lucide
Test 🧪
Jest
Playwright
React Testing Library
Packing and distribution 📦
Electron Forge
Documentation 📚
Storybook
CI/CD 🚀
Pre-configured GitHub Actions workflow, for test with Playwright
Project preferences 🎯
Use Context isolation
titleBarStyle: hidden (Using custom title bar)
Geist as default font
Some default styles was applied, check the styles directory
If you don't know some of these libraries or tools, I recommend you to check their documentation to understand how they work and how to use them.

Directory structure
.
└── ./src/
    ├── ./src/assets/
    │   └── ./src/assets/fonts/
    ├── ./src/components/
    │   └── ./src/components/ui/
    ├── ./src/helpers/
    │   └── ./src/helpers/ipc/
    ├── ./src/layout/
    ├── ./src/lib/
    ├── ./src/pages/
    ├── ./src/stories/
    ├── ./src/style/
    └── ./src/tests/
src/: Main directory
assets/: Store assets like images, fonts, etc.
components/: Store UI components
ui/: Store Shadcn UI components (this is the default direcotry used by Shadcn UI)
helpers/: Store IPC related functions to be called in the renderer process
ipc/: Directory to store IPC context and listener functions
Some implementations are already done, like theme and window for the custom title bar
layout/: Directory to store layout components
lib/: Store libraries and other utilities
pages/: Store app's pages
stories/: Store Storybook stories
style/: Store global styles
tests/: Store tests (from Jest and Playwright)
NPM script
To run any of those scripts:

npm run <script>
start: Start the app in development mode
package: Package your application into a platform-specific executable bundle and put the result in a folder.
make: Generate platform-specific distributables (e.g. .exe, .dmg, etc) of your application for distribution.
publish: Electron Forge's way of taking the artifacts generated by the make command and sending them to a service somewhere for you to distribute or use as updates.
prett: Run Prettier to format the code
storybook: Start Storybook
build-storybook: Run the Storybook's build command
test: Run the default unit-test script (Jest)
test:watch: Run the default unit-test script in watch mode (Jest)
test:unit: Run the Jest tests
test:e2e: Run the Playwright tests
test:all: Run all tests (Jest and Playwright)
The test scripts involving Playwright require the app be builded before running the tests. So, before run the tests, run the package, make or publish script.

**
stay consist with the folder structure , and there is no testing , and give me the full and correct sql schema , i use better-sqlite and fix the school year issue it should be in all tables