Skip to content

Instantly share code, notes, and snippets.

View parris's full-sized avatar

Parris Khachi parris

  • Discord
  • San Francisco
View GitHub Profile
@parris
parris / Nginx config for NextJS + Websocket server
Last active December 14, 2023 18:59
Nginx config for NextJS + Websocket server
worker_processes 1;
events {
worker_connections 1024;
}
http {
sendfile off;
keepalive_timeout 65;
@parris
parris / Drag-Drop+Reparenting-Solution-React.md
Last active November 15, 2018 03:15
Drag/Drop + Reparenting in React

React has fairly good support for most drag/drop scenarios except for the case where the dragged component will change parent elements. In that case, touchmove events will stop firing. Without React you'd normally just do something more imparative and just manually move an object around without destory it. In React you likely rely more on state/props to render your scenes; therefore, things become vaguely intractable. Even if your touchmove events are attached to document.body or window (etc) your touchmove event will still not fire.

I've read some discussions on the matter here:

  1. facebook/react#3965
  2. facebook/react#13113

Solution

I recently needed to address this in a codebase I work on. I just wanted to report some findings and success I had working around this particular issue. I found this workaround (and I have no idea why it works) https://stackoverflow.com/questions/33298828/touch-move-event-dont-fire-after-touch-start-target-is-removed

@parris
parris / Delete all Facebook test users (node js)
Last active August 20, 2018 17:52
Facebook has a 2000 person limit on test users and sometimes you'll consume all of them. There is nothing in the UI that lets you delete all of them. This script will help you do so in an automated way.
/**
* This will delete facebook test users for the specified appId.
* Usage node ./script/dumpFacebookTestUsers.js [appId] [appSecret]
*
* Copyright 2018 Brigade and Parris Khachi
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
create type user_role as enum ('hatch_anonymous', 'hatch_contributor', 'hatch_admin');
create type group_member_role as enum ('group_person', 'group_admin');
create table person (
id serial not null
constraint person_pkey
primary key
);
create table "group" (
@parris
parris / Login.js
Last active January 15, 2018 23:55
Fervor + PostgraphQL/Postgraphile + Knex Authentication Example
// src/apps/Login.js
import { React, Form, clientCookies, gql } from 'fervor/lib';
import Template from '../components/Template';
import styles from './styles/about.scss';
const authenticate = gql`
mutation Authenticate($login: AuthenticateInput!) {
authenticate(input: $login) {
jwtToken
@parris
parris / logout.spec.coffee
Created August 4, 2014 05:47
Example Mocha ReactJS + CoffeeScript Test
Parse = require '../../core/parse'
TestUtils = require('react/addons').addons.TestUtils
logoutView = require './logout'
mediator = require '../../core/mediator'
describe 'LogoutView', ->
beforeEach ->
@container = @document.createElement 'div'
@parris
parris / spec_helper.coffee
Created August 4, 2014 05:43
JSDom + React + Mocha + Sinon
jsdom = require 'jsdom'
require 'mocha-sinon'
# move into beforeEach and flip global.window.close on to improve
# cleaning of environment during each test and prevent memory leaks
document = jsdom.jsdom('<html><body></body></html>', jsdom.level(1, 'core'))
beforeEach ->
@document = document
@parris
parris / browserify.coffee
Created August 4, 2014 05:31
Gulp using coffee-reactify
gulp = require 'gulp'
browserify = require 'gulp-browserify'
rename = require 'gulp-rename'
gulp.task 'js', ->
gulp.src('./public/src/app.coffee', { read: false })
.pipe(browserify({
transform: ['coffee-reactify'],
extensions: ['.coffee'],
}))
@parris
parris / mocha.opts
Created August 4, 2014 04:17
ReactJS Mocha.opts
--require should
--reporter dot
--ui bdd
--debug
--compilers coffee:coffee-react/register
--recursive
define(function(require) {
var Backbone = require(‘backbone’),
backboneCanvasMixin = require(‘components/shapes/mixins/backbone_raphael_mixin’),
isMovable = require(‘components/shapes/mixins/is_movable’)
isRotatable = require(‘components/shapes/mixins/is_rotatable’)
// … and more ;
return Backbone.View.extend({ … })
.mixin(backboneCanvasMixin)