Skip to content

Instantly share code, notes, and snippets.


Jesus Manuel Olivas jmolivas

View GitHub Profile
adrian-afergon / product.provider.js
Created Sep 15, 2020
This gist represent how to consume a GraphQL service using the porposal of React Layers
View product.provider.js
export const ProductContext = React.createContext({
product: {}
const ProductAdapter = ({ handle, children }) => {
const { productRepository } = React.useContext(DependenciesContext)
const [product, setProduct] = React.useState()
React.useEffect(() => {
deanc / use-auth.jsx
Last active Dec 30, 2019 — forked from gragland/use-auth.jsx
React Hook recipe from
View use-auth.jsx
import React, { useState, useEffect, useContext, createContext } from "react";
import * as firebase from "firebase/app";
import "firebase/auth";
import firebaseConfig from "../config/firebase";
// Add your Firebase credentials
const AuthContext = createContext();
mglaman / drush-loop.php
Created Jul 7, 2019
ReactPHP Drupal Tasks
View drush-loop.php
<?php declare(strict_types=1);
require __DIR__ . '/../vendor/autoload.php';
function run_command(string $command): void {
$loop = React\EventLoop\Factory::create();
$process = new React\ChildProcess\Process($command);
$process->on('exit', function ($exitCode) use ($command) {
// Trigger alerts that the command finished.
johndevs / get-all-files.gql
Last active Mar 19, 2022
Github GraphQL - Get all file contents in repository
View get-all-files.gql
# Provide $query as a variable.
# The query is the same as you would enter into the search field e.g. "org:johndevs in:name feedreader"
query GetFilesQuery($branch: GitObjectID, $query: String!) {
search(first: 1, type: REPOSITORY, query: $query) {
edges {
node {
... on Repository {
object(expression: "master:", oid: $branch) {
... on Tree {
CurtisL /
Created Mar 12, 2019
Dynamic ACF Gutenberg Blocks for v5.8

Dynamic ACF Gutenberg Blocks

When ACF v5.8 drops we'll have the ability to create gutenberg blocks from ACF Field Groups. This set of functions will add additional field group options to dynamcily register blocks with various block customization settings.

All you have to do is create your field groups and template.


jackbravo / MediaLibraryController.php
Created Nov 28, 2018
Example to launch media library with a custom input
View MediaLibraryController.php
namespace Drupal\layout_manager\Controller;
use Drupal\Core\Controller\ControllerBase;
use Drupal\Core\Field\FieldStorageDefinitionInterface;
use Drupal\Core\Url;
* Controller to render basic html for client side application.
tonnguyen / cache.middleware.js
Created Feb 13, 2018
A cache middleware for redux
View cache.middleware.js
const cache = store => next => action => {
// handle FETCH action only
if (action.type !== 'FETCH') {
return next(action);
// check if cache is available
const data = window['__data'];
if (!data) {
// forward the call to live middleware

Libraries and Tools for React

Components and Component Libraries

If you're developing an application based on React it can be helpful if you don't need to develop all the basic UI components yourself. Here you can find a list with various components, component libraries and complete design systems developed with and for React.

Component libraries and Design Systems

Brands (official design systems by various companies and products)

View ProcessWaitingQueueCommand.php
namespace Drupal\waiting_queue\Command;
use Symfony\Component\Console\Input\InputInterface;
use Symfony\Component\Console\Output\OutputInterface;
use Symfony\Component\Console\Command\Command;
use Drupal\Console\Core\Command\Shared\ContainerAwareCommandTrait;
use Drupal\Console\Core\Style\DrupalStyle;
use Drupal\Console\Annotations\DrupalCommand;
miguelmota / index.html
Last active Apr 29, 2022
Hugo render from JSON file data
View index.html
<!-- posts.json must be at root level -->
{{ $items := getJSON "posts.json" }}
{{ range $item := $items }}
<a href="{{ $item.url }}">{{ $ }}</a>
{{ end }}