Skip to content

Instantly share code, notes, and snippets.

import React from 'react'
import { number, string } from 'prop-types'
const Spinner = ({ size, ratio, color }) => {
const c = size / 2
const r = size / 4
const d = size / ratio
return (
<svg width={size} height={size} className="spin">
@didierfranc
didierfranc / functions.fish
Last active December 12, 2018 11:31
Fish cool functions 🐠
# Display the current branch
function fish_right_prompt
echo (git rev-parse --abbrev-ref HEAD 2> /dev/null)
end
@didierfranc
didierfranc / gpg.sh
Last active March 18, 2019 11:14
GPG setup script
# Mac only
brew install gpg
gpg --passphrase '' --pinentry loopback --quick-generate-key "Didier Franc <[email protected]>"
gpg --export --armor | pbcopy
git config --global user.signingkey `gpg --list-secret-keys --keyid-format LONG | grep sec | cut -c 15-30`
git config --global commit.gpgsign true
@didierfranc
didierfranc / paginationToCursor.js
Created September 5, 2018 08:22
Use cursor with good old paginated web service
const get = require("./api")
const getAfter = async (limit, after) => {
const vindex = parseInt(after.split(":")[0])
const page = Math.floor(vindex / limit) + 1
const modulo = vindex % limit
const setId = page => (id, index) => {
const vindex = (page - 1) * limit + index + 1
@didierfranc
didierfranc / relay.js
Created July 2, 2018 12:47
Get data from Relay store
// relay initialization
import { Environment, Network, RecordSource, Store } from 'relay-runtime'
const network = Network.create(...)
export const store = new Store(source)
export default new Environment({ network, store })
// app
// Legacy code
const messages = []
const getMessages = async () => {
messages = await fetch('/messages').then(r => r.json())
}
// Make it live
const ws = new WebSocket(`wss://socket.cool/${app}/${channel}/${uid}`)
ws.onmessage = getMessages
// import() makes your old es6 import async
// it simply return a ... Promise 😻
import MyComponent from './MyComponent'
import('./MyComponent').then(MyComponent => ...)
// You can name your chunks if you want 😘
import(/* webpackChunkName: "my-component" */ './MyComponent')
import Async from 'react-code-splitting'
import Login from './Login'
import Signup from './Signup'
import Header from './Header'
const Home = () => <Async load={import('./Home')} />
const App = ({ user }) => (
<Body>
<Header />
import Login from './Login'
import Signup from './Signup'
import Header from './Header'
class Home extends React.Component {
componentWillMount = () => {
import('./Home').then(Component => {
this.Component = Component
this.forceUpdate()
})
import Login from './Login'
import Signup from './Signup'
import Header from './Header'
import Home from './Home'
const App = ({ user }) => (
<Body>
<Header />
{user.loggedIn ? <Route path="/" component={Home} /> : <Redirect to="/login" />}
<Route path="/signup" component={Signup} />