Skip to content

Instantly share code, notes, and snippets.

View ptcampbell's full-sized avatar
🌲
(◍•﹏•)

Patrick Campbell ptcampbell

🌲
(◍•﹏•)
View GitHub Profile
@schabluk
schabluk / ract-dropzone-image.js
Created February 10, 2017 11:55
React-Dropzone get image width, height and base64 data
onDrop = (acceptedFiles, rejectedFiles) => {
const file = acceptedFiles.find(f => f)
const i = new Image()
i.onload = () => {
let reader = new FileReader()
reader.readAsDataURL(file)
reader.onload = () => {
console.log({
src: file.preview,
{% layout none %}
{% paginate collections by 50 %}
{
"collections": [{% for collection in collections %}
{
{% if collection.image %}"image": "{{ collection.image }}",{% endif %}
"body_html": "{{ collection.description | url_escape }}",
"handle": "{{ collection.handle }}",
"id": {{ collection.id }},
@fgilio
fgilio / axios-catch-error.js
Last active April 11, 2024 19:02
Catch request errors with Axios
/*
* Handling Errors using async/await
* Has to be used inside an async function
*/
try {
const response = await axios.get('https://your.site/api/v1/bla/ble/bli');
// Success 🎉
console.log(response);
} catch (error) {
// Error 😨
@kitze
kitze / store-wrapper.js
Last active April 28, 2022 13:45
mobx store wrapper for storybook
import React from 'react';
import {Provider} from 'mobx-react';
const stub = () => true;
export const exampleStore = {
app: {},
auth: {
checkAuth: stub
},
@alexvcasillas
alexvcasillas / store-union-test.js
Last active June 10, 2018 22:34
Types Union Thing
import { types } from 'mobx-state-tree';
const ItemUI = types.model(
'ItemUI',
{
id: types.identifier(),
position: types.optional(types.frozen, { x: 0, y: 0 }),
text: types.string,
width: types.string,
height: types.string,
<?php
namespace App\Providers;
use Illuminate\Support\ServiceProvider;
use Aws\S3\S3Client;
use League\Flysystem\AwsS3v3\AwsS3Adapter;
use League\Flysystem\Filesystem;
use Storage;
class DOSpacesStorageServiceProvider extends ServiceProvider
{
/**
@dotspencer
dotspencer / google-wifi-setup-centurylink.md
Last active October 3, 2023 01:53
How to use Google WiFi with CenturyLink Internet (ZyXEL C3000Z, 80mbps, modem bridge)
import { useState, useEffect } from 'react';
function App() {
const columnCount = useMedia(
// Media queries
['(min-width: 1500px)', '(min-width: 1000px)', '(min-width: 600px)'],
// Column counts (relates to above media queries by array index)
[5, 4, 3],
// Default column count
2
// Usage
function App() {
const [darkMode, setDarkMode] = useDarkMode();
return (
<div>
<div className="navbar">
<Toggle darkMode={darkMode} setDarkMode={setDarkMode} />
</div>
<Content />
@reecelucas
reecelucas / useScrollDirection.js
Last active September 8, 2021 20:07
React hook to detect scroll direction, based on the API of https://github.com/dollarshaveclub/scrolldir
const SCROLL_UP = "up";
const SCROLL_DOWN = "down";
const useScrollDirection = ({
initialDirection,
thresholdPixels,
off
} = {}) => {
const [scrollDir, setScrollDir] = useState(initialDirection);