I like to help folks with their Electron and React problems, but I often have to repeat the same things over and over again. So here is a short guide to some of the most common questions and issues people have.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import { isEmpty } from "lodash"; | |
| import { useState } from "react"; | |
| /** | |
| * Submits a form. | |
| * @callback Submit | |
| * @param {import("react").SyntheticEvent} event - Form event | |
| * @param {Function} callback - Method called when the form is valid on submit | |
| */ |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| const { readFileSync, writeFileSync } = require("fs"); | |
| try { | |
| const filePath = "./package.json"; | |
| const entryPath = process.env.ENTRY_PATH; | |
| let data = readFileSync(filePath, "utf8"); | |
| data = JSON.parse(data); | |
| if (data.main !== entryPath) { |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import { findAndReplace } from "mdast-util-find-and-replace"; | |
| const commentRegex = /\/\/([^\n\\/]*)\/\//g; // //<value>// | |
| export default function () { | |
| function replaceComment(_match, text) { | |
| return { | |
| type: "span", | |
| data: { | |
| hName: "comment", |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import { useEffect, useState } from "react"; | |
| /** | |
| * Returns like `useState()` but updates the state when the initial value changes. | |
| * @param {any} initialValue - Initial value of the state | |
| * @returns {Array.<any,Function>} State value and setter | |
| */ | |
| export function useStateWithEffect(initialValue) { |
The script will allow creating a new component in the folder src/components. If the given path ends with a component name (detection is made if the last part of the path is in PascalCase), then it will detect the new component created is a sub-component and put it in an subComponents folder. A new export is automatically added (and sorted alphabetically) into the index.js file of the parent folder.
validFoldersβ List of folders where a new component can be createdsubComponentFolderNameβ Name of the folder for sub-components
Initial folder structure:
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * @import { Merge, ConditionalPick, SharedUnionFieldsDeep } from "type-fest"; | |
| */ | |
| /** | |
| * Renames keys from `T` with names specified in `R`. | |
| * @example | |
| * Rename.<{ a: 1, b: 2 } | { a: 3 }, { a: "d" }> | |
| * π‘ { d: 1, b: 2 } | { d: 3 } |