Skip to content

Instantly share code, notes, and snippets.

🦈
give me a feedback https://entria.feedback.house/sibelius

Sibelius Seraphini sibelius

🦈
give me a feedback https://entria.feedback.house/sibelius
Block or report user

Report or block sibelius

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
@sibelius
sibelius / consoleAll.ts
Created Nov 18, 2019
consoleAll will pretty print your object showing all nested properties
View consoleAll.ts
import prettyFormat from 'pretty-format';
export const consoleAll = (val: any) => {
// eslint-disable-next-line
console.log(prettyFormat(val));
};
@sibelius
sibelius / filterPassword.ts
Created Nov 18, 2019
filterPassword from objects before logging them
View filterPassword.ts
export const filterPassword = (obj: object) => {
return Object.keys(obj).reduce((acc, key) => {
const value = obj[key];
if (Array.isArray(value)) {
return {
...acc,
[key]: value,
}
}
@sibelius
sibelius / relay.config.js
Created Nov 17, 2019
Relay Config that works well with monorepo, you can spread your fragments in many packages
View relay.config.js
module.exports = {
schema: './data/schema.graphql',
language: 'typescript',
src: '../.',
include: [
'./web/src/**',
'./shared/src/**',
],
};
@sibelius
sibelius / useControlledState.tsx
Last active Nov 15, 2019
useControlledState to provide a uncontrolled and controlled api for your components
View useControlledState.tsx
import { useState } from 'react';
export const useControlledState = <T extends any>(value: T, onChange?: (value: T) => void) => {
const [uncontrolledValue, setUncontrolledValue] = useState(value);
if (typeof onChange === 'function') {
// Controlled version
return [value, onChange];
}
// Uncontrolled version
return [uncontrolledValue, setUncontrolledValue];
@sibelius
sibelius / useSubmit.tsx
Created Oct 31, 2019
useSubmit hook to make sure you don't call onSubmit twice
View useSubmit.tsx
import { useState, useRef, useCallback } from 'react';
export const useSubmit = (fun: Function) => {
const [isPending, setIsPending] = useState<boolean>(false);
const pendingRef = useRef(null);
const submit = useCallback((...args) => {
if (pendingRef.current) {
return;
}
@sibelius
sibelius / runMigrations.ts
Created Oct 14, 2019
run migrations using require.context
View runMigrations.ts
export const runMigrations = async () => {
const req = require.context('./migrations', false, /.(t|j)s$/);
for (const filename of req.keys()) {
const migration = req(filename);
await migration.default(loggerMigration);
}
}
View datefnsFormat.ts
import moment from 'moment';
export const formatFns = (date: Date | string | number, fmt: string) => {
return moment(date).format(fmt);
}
@sibelius
sibelius / runWithPriority.tsx
Last active Oct 13, 2019
Change React Scheduler priority
View runWithPriority.tsx
const Scheduler = require('scheduler');
Scheduler.unstable_runWithPriority(Scheduler.unstable_NormalPriority, () => {
refetch({
id: user.id,
});
});
@sibelius
sibelius / createQueryRendererSuspense.tsx
Created Sep 25, 2019
createQueryRendererSuspense helper to make it easy add ErrorBoundaryWithRetry and Suspense handling
View createQueryRendererSuspense.tsx
export const createQueryRendererSuspense = (Component: React.ComponentType<any>) => {
const QueryRendererWrapper = props => {
return (
<ErrorBoundaryWithRetry fallback={(error, retry) => <ErrorView error={error} retry={retry} />}>
<React.Suspense fallback={<LoadingView />}>
<Component {...props} />
</React.Suspense>
</ErrorBoundaryWithRetry>
);
};
@sibelius
sibelius / ErrorBoundaryWithRetry.tsx
Created Sep 19, 2019
ErrorBoundaryWithRetry to be used with relay useQuery hook
View ErrorBoundaryWithRetry.tsx
class ErrorBoundaryWithRetry extends React.Component<Props, State> {
state = {error: null};
static getDerivedStateFromError(error): State {
return {error: error};
}
_retry = () => {
this.setState({error: null});
}
You can’t perform that action at this time.