Skip to content

Instantly share code, notes, and snippets.

View gustavoguichard's full-sized avatar
🏠
Working from home

Guga Guichard gustavoguichard

🏠
Working from home
View GitHub Profile
const useOpenExternalLinksInNewTab = (el = typeof document === 'undefined' ? null : document) => {
useEffect(() => {
if (el && typeof window !== 'undefined') {
const links = el.querySelectorAll(
`a[href*="//"]:not([href*="${window.location.host}"])`,
)
links.forEach((link) => {
link.setAttribute('target', '_blank')
link.setAttribute('rel', 'noopener')
})
@gustavoguichard
gustavoguichard / Masonry.js
Created November 10, 2018 00:16
Masonry react component
import React, { cloneElement, memo } from 'react'
import times from 'lodash/times'
const Masonry = ({ columns, children, ...props }) => (
<div {...props} className="masonry-tile">
{times(columns, index => (
<div className="vert-tile" key={`tile-${index}`}>
{React.Children.toArray(children)
.filter(
(child, filterIndex) =>
@gustavoguichard
gustavoguichard / redux.js
Last active September 18, 2018 03:55
Minimal todo app with Redux from scratch
const { Component } = React
// Model
let nextTodoID = 0
// Update
@gustavoguichard
gustavoguichard / ImageUploaderEs6.js
Last active December 28, 2017 09:23
React + Rails image uploader component
import React, { Proptypes, Component } from 'react'
import { classNames } from 'neighborly-components'
class ImageUploader extends Component {
static propTypes = {
associations: PropTypes.string,
fieldName: PropTypes.string.isRequired,
label: PropTypes.string,
message: PropTypes.string,
model: PropTypes.string.isRequired
@gustavoguichard
gustavoguichard / colors.js
Created August 25, 2017 17:00
Set of utilities for dealing with colors
import { chunk, join, map, repeat } from 'lodash'
const repeatArray = (array, size) => map(array, repeatVal(2))
const joinChunk = (array, size) => map(chunk(array, size), joinValues)
const repeatVal = size => val => repeat(val, size)
const hexToDec = hex => parseInt(hex, 16)
const joinValues = arr => join(arr, '')
export const hexToRGBA = (hex, alpha = 1) => {
const validColor =
@gustavoguichard
gustavoguichard / Todo.elm
Last active May 12, 2016 02:08
Minimal todo app with Elm
module Todo exposing (..)
import Html exposing (..)
import Html.App as App
import Html.Attributes exposing (..)
import Html.Events exposing (..)
-- Model
@gustavoguichard
gustavoguichard / SmartGrid.js
Last active May 10, 2016 19:37
BS SmartGrid
import React, { cloneElement, PropTypes } from 'react'
import { map, chunk, uniqueId } from 'lodash'
export const SmartGrid = ({ columns = 3, minWidth = 'sm', children }) => {
const cols = parseInt(12 / columns, 10)
const join = (...classes) => classes.join(' ')
return (
<div>
{map(chunk(children, columns), (kids, index) =>
<div className="row" key={index}>
@gustavoguichard
gustavoguichard / booking.js
Last active January 4, 2016 10:29
booking assignment
jQuery(function() {
var json = [{name: "Moscow", count: 12, content: "<p>Moscow is the capital city and the most populous federal subject of <b>Russia</b>. The city is a major political, economic, cultural and scientific center in Russia and in Eurasia.</p>"}, {name: "Amsterdam", count: 25, content: "<p>Amsterdam is the capital and most populous city of the <b>Netherlands</b>. Its status as the Dutch capital is mandated by the Constitution of the Netherlands though it is not the seat of the Dutch government, which is at the Hague. </p>"}, {name: "Lisbon", count: 15, content: "<p>Lisbon is the largest city and capital of <b>Portugal</b> with a population of 547,631 within its administrative limits on a land area of 84.8 square kilometers.</p>"}, {name: "Berlin", count: 19, content: "<p>Berlin is the capital city of <b>Germany</b> and one of the 16 states of Germany. With a population of 3.3 million people, Berlin is Germany's largest city and is the second most populous city proper and the seventh most popul
@gustavoguichard
gustavoguichard / campus.coffee
Created January 8, 2014 13:31
Campus Page Code
jQuery ->
######################################
# BACKBONE CODE
######################################
# INITIALIZES Campus OBJ SO WE CAN CREATE ALL THE COMPONENTS ON IT
Campus = {}
######################################
# CODE FOR THE SIDEBAR AND MAP
######################################
@gustavoguichard
gustavoguichard / seeds.rb
Created December 3, 2013 23:58
Seed example
# utf-8
# Migrate data from old database
old_database = File.read(Rails.root.join('db/old_database.sql'))
ActiveRecord::Base.connection.execute old_database
convert_old_data = File.read(Rails.root.join('db/convert_old_data.sql'))
ActiveRecord::Base.connection.execute convert_old_data
# Create first access tokens
User.all.each do |u|
u.first_access_token = u.id.to_s + Devise.friendly_token