Skip to content

Instantly share code, notes, and snippets.


Augusto Calaca AugustoCalaca

View GitHub Profile
View debugRelay.ts
import prettyFormat from 'pretty-format';
const excludeKeys = ['__fragments', '__id', '__fragmentOwner'];
// strip __fragments, __id, __fragmentOwne
export const relayTransform = (key: string, value: string) => {
if (excludeKeys.includes(key)) {
return undefined;
AugustoCalaca /
Created Apr 5, 2021 — forked from sibelius/
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

AugustoCalaca /
Created Apr 5, 2021 — forked from mrousavy/
Memoize!!! 💾 - a react (native) performance guide
In computing, memoization or memoisation
is an optimization technique used primarily
to speed up computer programs by storing
the results of expensive function calls and  
returning the cached result when the same
inputs occur again.                                         
                                                     — wikipedia
AugustoCalaca / NotificationSentSubscription.js
Last active Mar 26, 2021
How to filter who might receive a subscription
View NotificationSentSubscription.js
import { NotificationSentModel } from '@entities';
import { GraphQLID, GraphQLNonNull } from 'graphql';
// import { subscriptionWithClientId } from 'graphql-relay-subscription';
import { withFilter } from 'graphql-subscriptions';
import { fromGlobalToId, subscriptionObjectType } from './utils';
import pubSub, { EVENTS } from '../../../pubSub';
import NotificationSentType from '../NotificationSentType';
const subscriptionAsyncIterator = () => pubSub.asyncIterator(EVENTS.NOTIFICATION.SENT);
AugustoCalaca / test.js
Created Feb 22, 2021 — forked from jmyrland/test.js
Socket-io load test?
View test.js
* Modify the parts you need to get it working.
var should = require('should');
var request = require('../node_modules/request');
var io = require('');
var serverUrl = 'http://localhost';
AugustoCalaca / .ngnix.config
Created Feb 22, 2021
How to config ngnix to use websockets at subscriptions location on server
View .ngnix.config
server {
listen 80;
listen [::]:80;
location / {
proxy_pass http://mydomain:8080;
AugustoCalaca / babel.config.js
Created Jan 12, 2021 — forked from jgcmarins/babel.config.js
Webpack configs for Node.js backends to run both locally and on AWS Lambda
View babel.config.js
module.exports = {
presets: [
targets: {
node: 'current',
AugustoCalaca / base64ToPDF.js
Created Jan 8, 2021
how to convert a base64 to pdf url
View base64ToPDF.js
const base64ToPDF = (base64) => {
const byteString = window.atob(base64);
const arrayBuffer = new ArrayBuffer(byteString.length);
const int8Array = new Uint8Array(arrayBuffer);
for (let i = 0; i < byteString.length; i += 1) {
int8Array[i] = byteString.charCodeAt(i);
const blob = new Blob([int8Array], { type: 'application/pdf' });
const pdfURL = URL.createObjectURL(blob);
AugustoCalaca / FormWithTinymce.tsx
Last active Sep 22, 2020
Example of how to use tinymce as controlled component by formik with text field material-ui
View FormWithTinymce.tsx
import React from 'react';
import { useFormik } from 'formik';
import * as Yup from 'yup';
import Button from '@material-ui/core/Button';
import TextField from '@material-ui/core/TextField';
import EditorField from './EditorField';
type InitialValuesFormikType = {
editor: string;
AugustoCalaca /
Created Sep 11, 2020
Resume about relay fragments

About Fragment

  • Fragment is the building block of the relay
  • Fragment is a selection of fields on a GraphQL Type
  • Fragment allow you to colocate data
  • Relay composes fragments from multiple components into optimized and efficient batches to reduce round-trips to the server
  • Its hard to over-fetch and under-fetch
  • Components can only access data they've asked for - data mask - each one must declare its own data requirements without relying on others
  • Components only re-render when the exact data they're using is updated, preventing unnecessary re-renders
  • In short, colocating data make your components modular, easier to refactor, more performant and less error-prone