Erb

.erb/configs/webpack.config.base.ts

@@ -4,7 +4,7 @@
 
 import TsconfigPathsPlugins from 'tsconfig-paths-webpack-plugin';
 import webpack from 'webpack';
-import { dependencies as externals } from '../../release/app/package.json';
+import { dependencies as externals } from '../../release/app/package.json' with { type: 'json' };
 import webpackPaths from './webpack.paths';
 
 const configuration: webpack.Configuration = {
@@ -23,7 +23,8 @@ const configuration: webpack.Configuration = {
 						// Remove this line to enable type checking in webpack builds
 						transpileOnly: true,
 						compilerOptions: {
-							module: 'esnext',
+							module: 'nodenext',
+							moduleResolution: 'nodenext',
 						},
 					},
 				},
@@ -34,9 +35,7 @@ const configuration: webpack.Configuration = {
 	output: {
 		path: webpackPaths.srcPath,
 		// https://github.com/webpack/webpack/issues/1114
-		library: {
-			type: 'commonjs2',
-		},
+		library: { type: 'commonjs2' },
 	},
 
 	/**
@@ -49,11 +48,7 @@ const configuration: webpack.Configuration = {
 		plugins: [new TsconfigPathsPlugins()],
 	},
 
-	plugins: [
-		new webpack.EnvironmentPlugin({
-			NODE_ENV: 'production',
-		}),
-	],
+	plugins: [new webpack.EnvironmentPlugin({ NODE_ENV: 'production' })],
 };
 
 export default configuration;

.erb/configs/webpack.config.main.dev.ts

@@ -7,7 +7,7 @@ import webpack from 'webpack';
 import { BundleAnalyzerPlugin } from 'webpack-bundle-analyzer';
 import { merge } from 'webpack-merge';
 import checkNodeEnv from '../scripts/check-node-env';
-import baseConfig from './webpack.config.base';
+import baseConfig from './webpack.config.base.ts';
 import webpackPaths from './webpack.paths';
 
 // When an ESLint server is running, we can't set the NODE_ENV so we'll check if it's

.erb/configs/webpack.config.main.prod.ts

@@ -7,7 +7,7 @@ import webpack from 'webpack';
 import { merge } from 'webpack-merge';
 import TerserPlugin from 'terser-webpack-plugin';
 import { BundleAnalyzerPlugin } from 'webpack-bundle-analyzer';
-import baseConfig from './webpack.config.base';
+import baseConfig from './webpack.config.base.ts';
 import webpackPaths from './webpack.paths';
 import checkNodeEnv from '../scripts/check-node-env';
 import deleteSourceMaps from '../scripts/delete-source-maps';

.erb/configs/webpack.config.preload.dev.ts

@@ -2,7 +2,7 @@ import path from 'path';
 import webpack from 'webpack';
 import { merge } from 'webpack-merge';
 import { BundleAnalyzerPlugin } from 'webpack-bundle-analyzer';
-import baseConfig from './webpack.config.base';
+import baseConfig from './webpack.config.base.ts';
 import webpackPaths from './webpack.paths';
 import checkNodeEnv from '../scripts/check-node-env';
 

.erb/configs/webpack.config.renderer.dev.dll.ts

@@ -5,9 +5,9 @@
 import webpack from 'webpack';
 import path from 'path';
 import { merge } from 'webpack-merge';
-import baseConfig from './webpack.config.base';
+import baseConfig from './webpack.config.base.ts';
 import webpackPaths from './webpack.paths';
-import { dependencies } from '../../package.json';
+import { dependencies } from '../../package.json' with { type: 'json' };
 import checkNodeEnv from '../scripts/check-node-env';
 
 checkNodeEnv('development');

.erb/configs/webpack.config.renderer.dev.ts

@@ -8,7 +8,7 @@ import webpack from 'webpack';
 import 'webpack-dev-server';
 import { merge } from 'webpack-merge';
 import checkNodeEnv from '../scripts/check-node-env';
-import baseConfig from './webpack.config.base';
+import baseConfig from './webpack.config.base.ts';
 import webpackPaths from './webpack.paths';
 
 // When an ESLint server is running, we can't set the NODE_ENV so we'll check if it's

.erb/configs/webpack.config.renderer.prod.ts

@@ -12,7 +12,7 @@ import { BundleAnalyzerPlugin } from 'webpack-bundle-analyzer';
 import { merge } from 'webpack-merge';
 import checkNodeEnv from '../scripts/check-node-env';
 import deleteSourceMaps from '../scripts/delete-source-maps';
-import baseConfig from './webpack.config.base';
+import baseConfig from './webpack.config.base.ts';
 import webpackPaths from './webpack.paths';
 
 checkNodeEnv('production');

.erb/scripts/check-build-exists.ts

@@ -2,6 +2,7 @@
 import path from 'path';
 import chalk from 'chalk';
 import fs from 'fs';
+import { TextEncoder, TextDecoder } from 'node:util';
 import webpackPaths from '../configs/webpack.paths';
 
 const mainPath = path.join(webpackPaths.distMainPath, 'main.js');
@@ -22,3 +23,12 @@ if (!fs.existsSync(rendererPath)) {
 		),
 	);
 }
+
+// JSDOM does not implement TextEncoder and TextDecoder
+if (!global.TextEncoder) {
+  global.TextEncoder = TextEncoder;
+}
+if (!global.TextDecoder) {
+  // @ts-ignore
+  global.TextDecoder = TextDecoder;
+}

.erb/scripts/check-native-dep.js

@@ -48,7 +48,7 @@ ${chalk.bold(
  `);
 			process.exit(1);
 		}
-	} catch (e) {
+	} catch {
 		console.log('Native dependencies could not be checked');
 	}
 }

.eslintrc.js

@@ -15,7 +15,7 @@ module.exports = {
 		'@typescript-eslint/no-shadow': 'error',
 		'no-unused-vars': 'off',
 
-		// Added in Electron-Hotplate
+		// Added in Electron-Bones
 		'@typescript-eslint/no-unused-vars': [
 			'warn',
 			{

.github/workflows/publish.yml

@@ -25,7 +25,7 @@ jobs:
       - name: Install Node and NPM
         uses: actions/setup-node@v3
         with:
-          node-version: 18
+          node-version: 22
           cache: npm
 
       - name: Install and build

.github/workflows/test.yml

@@ -17,7 +17,7 @@ jobs:
       - name: Install Node.js and NPM
         uses: actions/setup-node@v3
         with:
-          node-version: 18
+          node-version: 22
           cache: npm
 
       - name: npm install

README.md

@@ -1,4 +1,116 @@
-# Electron Hotplate
+# Electron Bones 🔥
+
+A batteries-included Electron boilerplate with React, TypeScript, and more. Based on the [Electron React Boilerplate](https://github.com/electron-react-boilerplate/electron-react-boilerplate), this project includes a demo app showcasing basic functionality and inter-process communication between the main and renderer processes.
+
+<div align="center">
+
+[![Build Status][github-actions-status]][github-actions-url]
+[![Github Tag][github-tag-image]][github-tag-url]
+
+</div>
+
+## ✨ Features
+
+- 🚀 React for the UI
+- 🖥️ Electron for cross-platform desktop app development
+- 📘 TypeScript for type-safe code
+- 🎨 TailwindCSS for styling
+- 🔌 Inter-process communication (IPC) between main and renderer processes
+- 🌍 Global context for state management
+- 🖼️ Multi-window support (main window and child window)
+- 🔔 App and System-wide Notifications
+- 🔄 Auto Updater
+- 💾 Built-in Store with electron-store
+- 🖱️ Context Menu
+- 🌙 Dark Mode
+- ❌ Error Handler
+- ⌨️ Keyboard Shortcut Manager
+- 📝 Logging
+- 🀱 Menu Bar for macOS, Windows, and Linux
+- 📂 Multi-Window
+- 🖥️ System Tray
+- 🎨 UI components from [Shadcn](https://ui.shadcn.com/)
+
+## 🚀 Getting Started
+
+1. Clone this repository
+
+   ```bash
+   git clone https://github.com/lacymorrow/electron-bones.git
+   ```
+
+2. Go into the repository
+
+   ```bash
+   cd electron-bones
+   ```
+
+3. Install dependencies
+
+   ```bash
+   npm install
+   ```
+
+4. Start the development server
+
+   ```bash
+   npm run start
+   ```
+
+## 📁 Project Structure
+
+- `src/main`: Contains the main process code
+- `src/renderer`: Contains the renderer process code (React components)
+- `src/config`: Contains configuration files
+- `src/utils`: Contains utility functions
+
+## 📜 Available Scripts
+
+- `npm run start`: Start the app in development mode
+- `npm run package`: Build the app for production
+- `npm run lint`: Run the linter
+- `npm run test`: Run tests
+
+## Production
+
+### Auto Update
+
+After publishing your first version, you can enable auto-update by uncommenting the `update` function contents in `src/main/auto-update.ts`.
+
+## Built With
+
+- [Electron](https://electronjs.org/)
+- [React](https://reactjs.org/)
+- [React Router](https://reacttraining.com/react-router/)
+- [Tailwind CSS](https://tailwindcss.com/)
+- [Shadcn](https://ui.shadcn.com/)
+- [TypeScript](https://www.typescriptlang.org/)
+
+## Development
+
+### Tailwind CSS
+
+We use Tailwind CSS for styling. See the [Tailwind CSS docs](https://tailwindcss.com/docs) for more information.
+
+Some Tailwind plugins have been added for convenience:
+
+- [Tailwind Animate](https://github.com/jamiebuilds/tailwindcss-animate) - `tailwindcss-animate`
+- [Tailwind Container Queries](https://github.com/tailwindlabs/tailwindcss-container-queries) - `@tailwindcss/container-queries`
+- Child selectors to target immediate children like `child:w-xl`
+- Don't forget group selectors too: `group` (Parent) `group-hover:bg-gray-100` (Child)
+
+### Shadcn
+
+Shadcn is a UI component library for React. See the [Shadcn docs](https://ui.shadcn.com/) for more information.
+Use `npx shadcn@latest add button ...` to add a component to your project.
+
+_Current installation command (to update all ui components):_
+
+```sh
+npx shadcn@latest add button checkbox dropdown-menu form input menubar radio-group scroll-area select separator sonner switch textarea
+```
+
+_To list components with updates: `npx shadcn@latest diff`_
 
 Based on the [Electron React Boilerplate](https://github.com/electron-react-boilerplate/electron-react-boilerplate), this boilerplate adds UI components from [Shadcn](https://ui.shadcn.com/), styling with [Tailwind CSS](https://tailwindcss.com/), persistance with [electron-store](https://github.com/sindresorhus/electron-store), and a structured [React](https://react.dev/) context that promotes a data flow from the top down: Main process -> Renderer process.
 
@@ -28,12 +140,11 @@ Based on the [Electron React Boilerplate](https://github.com/electron-react-boil
 ## Getting Started
 
 ```bash
-
 # Clone this repository
-git clone https://github.com/lacymorrow/electron-hotplate.git
+git clone https://github.com/lacymorrow/electron-bones.git
 
 # Go into the repository
-cd electron-hotplate
+cd electron-bones
 
 # Install dependencies
 yarn
@@ -42,6 +153,12 @@ yarn
 yarn start
 ```
 
+## Production
+
+### Auto Update
+
+After publishing your first version, you can enable auto-update by uncommenting the `update` function contents in `src/main/auto-update.ts`.
+
 ## BuiltWith
 
 - [Electron](https://electronjs.org/)
@@ -51,7 +168,6 @@ yarn start
 - [Shadcn](https://ui.shadcn.com/)
 - [TypeScript](https://www.typescriptlang.org/)
 
-
 ## Development
 
 ### Tailwind CSS
@@ -78,23 +194,34 @@ npx shadcn-ui@latest add button checkbox dropdown-menu form input menubar radio-
 
 _To list components with updates: `npx shadcn-ui@latest diff`_
 
-## Electron-React-Boilerplate Docs
+### Build for production
 
-See the Electron React Boilerplate [docs and guides here](https://electron-react-boilerplate.js.org/docs/installation)
+```sh
+npm run package
+```
+
+#### Important Notes
 
+- The `src/main/auto-update.ts` file is where the auto-updater is configured. Uncomment the `update` function to enable auto-update after publishing your first version.
+- The app icon will **ALWAYS** be the default Electron icon in development. You will need to build the app with `npm run package` to get a new icon.
 
-### Tutorials
+## 🤝 Contributing
+
+Contributions are welcome! Please feel free to submit a Pull Request.
+
+### Electron-React-Boilerplate
+
+See the Electron React Boilerplate [docs and guides here](https://electron-react-boilerplate.js.org/docs/installation)
 
-- Creating multiple windows: https://github.com/electron-react-boilerplate/electron-react-boilerplate/issues/623#issuecomment-1382717291
+#### Tutorials
 
+- Creating multiple windows: <https://github.com/electron-react-boilerplate/electron-react-boilerplate/issues/623#issuecomment-1382717291>
 
-## License
+## 📄 License
 
-MIT © [Lacy Morrow](https://github.com/lacymorrow)
+This project is licensed under the CC-BY-NC-SA-4.0 License.
 
-[github-actions-status]: https://github.com/lacymorrow/electron-shadcn-boilerplate/workflows/Build/badge.svg
-[github-actions-url]: https://github.com/lacymorrow/electron-shadcn-boilerplate/actions
-[github-tag-image]: https://img.shields.io/github/tag/electron-react-boilerplate/electron-react-boilerplate.svg?label=version
-[github-tag-url]: https://github.com/lacymorrow/electron-shadcn-boilerplate/releases/latest
-[stackoverflow-img]: https://img.shields.io/badge/stackoverflow-electron_react_boilerplate-blue.svg
-[stackoverflow-url]: https://stackoverflow.com/questions/tagged/electron-react-boilerplate
+[github-actions-status]: https://github.com/lacymorrow/electron-bones/workflows/Build/badge.svg
+[github-actions-url]: https://github.com/lacymorrow/electron-bones/actions
+[github-tag-image]: https://img.shields.io/github/tag/lacymorrow/electron-bones.svg?label=version
+[github-tag-url]: https://github.com/lacymorrow/electron-bones/releases/latest