Skip to content

Instantly share code, notes, and snippets.

View elsangedy's full-sized avatar
🚀

Munir Ahmed Elsangedy elsangedy

🚀
View GitHub Profile
@rmorse
rmorse / react-router-dom-v.6.02.prompt.blocker.js
Last active June 5, 2024 15:56
Adds back in `useBlocker` and `usePrompt` to `react-router-dom` version 6.0.2 (they removed after the 6.0.0 beta, temporarily)
/**
* These hooks re-implement the now removed useBlocker and usePrompt hooks in 'react-router-dom'.
* Thanks for the idea @piecyk https://github.com/remix-run/react-router/issues/8139#issuecomment-953816315
* Source: https://github.com/remix-run/react-router/commit/256cad70d3fd4500b1abcfea66f3ee622fb90874#diff-b60f1a2d4276b2a605c05e19816634111de2e8a4186fe9dd7de8e344b65ed4d3L344-L381
*/
import { useContext, useEffect, useCallback } from 'react';
import { UNSAFE_NavigationContext as NavigationContext } from 'react-router-dom';
/**
* Blocks all navigation attempts. This is useful for preventing the page from
* changing until some condition is met, like saving form data.
@sibelius
sibelius / devTraining.md
Created January 8, 2021 12:48
How to train your dev team

you should review every pull request of your team

  • each pull request will make understand what everyone in your team is working on
  • it will ensure you keep consistency of file location, and code patterns
  • it will catch bugs/regression early on
  • it will teach the best way to solve the problem

you should ensure consistency of the code base

you should pair programming with all devs of your team

@sibelius
sibelius / usage.tsx
Created July 23, 2019 15:17
useCheckboxString to handle a list of checkboxes in an array of stirngs
const checkboxHandlers = useCheckboxString('myCheckboxList');
{possibleValues.map(value => (
<Checkbox
key={value}
name={value}
label={t(value)}
{...checkboxHandlers(disability)}
/>
))}
@sibelius
sibelius / FormUseFormik.tsx
Last active April 13, 2023 20:09
Example showing how to useFormik and FormikProvider
type Props = {
};
const FormUseFormik = (props: Props) => {
const { enqueueSnackbar } = useSnackbar();
const onSubmit = (values) => {
enqueueSnackbar(`submit: ${JSON.stringify(values)}`, {
preventDuplicate: true,
persist: false,
});
export function cpfMask (value) {
return value
.replace(/\D/g, '')
.replace(/(\d{3})(\d)/, '$1.$2')
.replace(/(\d{3})(\d)/, '$1.$2')
.replace(/(\d{3})(\d{1,2})/, '$1-$2')
.replace(/(-\d{2})\d+?$/, '$1')
}
export function cnpjMask (value) {
@sibelius
sibelius / usePrompt.tsx
Last active October 27, 2022 19:05
Prompt user before leaving route or reload
import { useEffect, useRef } from 'react';
import { useHistory } from 'react-router-dom';
export const usePrompt = (when: boolean, message: string = 'Are you sure you want to quit without saving your changes?') => {
const history = useHistory();
const self = useRef(null);
const onWindowOrTabClose = event => {
if (!when) {
@recurrence
recurrence / snake_naming.ts
Created November 21, 2017 16:34
TypeORM Snake Case Naming Strategy
import { NamingStrategyInterface, DefaultNamingStrategy } from 'typeorm'
import { snakeCase } from 'typeorm/util/StringUtils'
export class SnakeNamingStrategy extends DefaultNamingStrategy implements NamingStrategyInterface {
tableName(className: string, customName: string): string {
return customName ? customName : snakeCase(className)
}
columnName(propertyName: string, customName: string, embeddedPrefixes: string[]): string {
return snakeCase(embeddedPrefixes.join('_')) + (customName ? customName : snakeCase(propertyName))