Skip to content

Instantly share code, notes, and snippets.

View ever-dev's full-sized avatar
🏠
Working from home

Ever Dev ever-dev

🏠
Working from home
View GitHub Profile
@ever-dev
ever-dev / router.js
Created November 19, 2020 15:03
Render React routes with layouts and guards
import React, {
Suspense,
Fragment,
lazy
} from 'react';
import {
Switch,
Redirect,
Route
} from 'react-router-dom';
@ever-dev
ever-dev / create-confirmation.tsx
Last active January 6, 2021 08:49
Create a function that renders a dialog when calling a function.
import * as React from "react";
import * as ReactDOM from "react-dom";
import { ConfirmDialog } from "./dialog";
export function renderConfirmDialog(
title: string,
subTitle: string,
confirmLabel: string,
cancelLabel: string,
): Promise<boolean> {
@ever-dev
ever-dev / index.tsx
Last active March 5, 2021 22:00
Gear loading spinner React & TailwindCSS
import "./styles.less";
export default function LoadingScreen() {
return (
<div className="tw-w-screen tw-h-screen tw-flex tw-items-center tw-justify-center">
<div className="loading tw-relative">
<div className="gear one">
<svg id="blue" viewBox="0 0 100 100" fill="#94DDFF">
<path d="M97.6,55.7V44.3l-13.6-2.9c-0.8-3.3-2.1-6.4-3.9-9.3l7.6-11.7l-8-8L67.9,20c-2.9-1.7-6-3.1-9.3-3.9L55.7,2.4H44.3l-2.9,13.6c-3.3,0.8-6.4,2.1-9.3,3.9l-11.7-7.6l-8,8L20,32.1c-1.7,2.9-3.1,6-3.9,9.3L2.4,44.3v11.4l13.6,2.9c0.8,3.3,2.1,6.4,3.9,9.3l-7.6,11.7l8,8L32.1,80c2.9,1.7,6,3.1,9.3,3.9l2.9,13.6h11.4l2.9-13.6c3.3-0.8,6.4-2.1,9.3-3.9l11.7,7.6l8-8L80,67.9c1.7-2.9,3.1-6,3.9-9.3L97.6,55.7z M50,65.6c-8.7,0-15.6-7-15.6-15.6s7-15.6,15.6-15.6s15.6,7,15.6,15.6S58.7,65.6,50,65.6z" />
</svg>
@ever-dev
ever-dev / demo.js
Last active September 7, 2021 14:55
Run processes in parallel or series by limiting the number of concurrently running processes.
import ProcessExecuteService from './processExecuteService.js';
const process = new ProcessExecuteService(
2,
[
// parallel
[
// series
[
@ever-dev
ever-dev / useChangesEffect.js
Last active January 28, 2022 13:40
Useful hooks - useStateWithCallback, useChanagesEffect
const useChangesEffect = (callback, dependencies, dependencyNames = null) => {
const prevValues = useRef(dependencies);
useEffect(() => {
const changes = [];
for (let i = 0; i < prevValues.current.length; i++) {
if (!shallowEqual(prevValues.current[i], dependencies[i])) {
changes.push(dependencyNames ? dependencyNames[i] : i);
}
}
@ever-dev
ever-dev / GetDictValue.d.ts
Created May 14, 2022 02:39
Type-safety for dictionaries
type GetDictValue<T extends string, O> = T extends `${infer A}.${infer B}`
? A extends keyof O
? GetDictValue<B, O[A]>
: never
: T extends keyof O
? O[T]
: never;
@ever-dev
ever-dev / waitForElementLoad.js
Created June 14, 2022 15:36
Wait for element to be loaded using MutationObserver
function waitForElementLoad(selector) {
return new Promise((resolve, reject) => {
let el = document.querySelector(selector);
if (el) {
resolve(el);
return;
}
new MutationObserver((mutationRecords, observer) => {
// Query for elements matching the specified selector
Array.from(document.querySelectorAll(selector)).forEach(element => {