Skip to content

Instantly share code, notes, and snippets.

View styled-components-vs-css-prop.js
// styled component version
const Container = styled.div`
/*all of the styles*/
`
function MyComponent() {
return <Container>{/*other stuff*/}</Container>
}
// css prop version
View machine.js
const INITIAL_CONDITIONS_FAILED = 'INITIAL_CONDITIONS_FAILED'
const INITIAL_CONDITIONS_MET = 'INITIAL_CONDITIONS_MET'
const CHECK_IF_SCHEDULE_IS_VALID = 'CHECK_IF_SCHEDULE_IS_VALID'
const UPDATE_SCHEDULE_ID = 'UPDATE_SCHEDULE_ID'
// visualization of the state machine: https://xstate.js.org/viz/?gist=c33367d493886a6f93e149c530ce8cb1
const startOptimizationMachine = Machine(
{
id: 'startOptimizationMachine',
initial: 'disabled',
View machine.js
const autoSaveMachine = Machine(
{
id: 'autoSaveMachine',
initial: 'saved',
states: {
saved: {
on: {
HAS_UNSAVED_DATA: 'waitingToSave'
View machine.js
const initialContext = {
displayName: '',
email: ''
}
const userMachine = Machine(
{
id: 'user',
initial: 'unchecked',
context: initialContext,
View machine.js
// this machine expects an authenticate service to be passed in
// and handles where a user is in the authentication process.
// `logedIn` is marked as final state because once logged in
// the auth-context will be updated by firebase and so the user
// will automatically be navigated away from this component
const authenticationMachine = Machine(
{
id: 'authentication',
initial: 'loggedOut',
context: {
View machine.js
// taken from https://www.w3resource.com/javascript/form/email-validation.php
const emailReg = /^\w+([.-]?\w+)*@\w+([.-]?\w+)*(\.\w{2,3})+$/;
// taken from https://stackoverflow.com/questions/19605150/regex-for-password-must-contain-at-least-eight-characters-at-least-one-number-a
const passwordReg = /^(?=.*[A-Za-z])(?=.*\d)(?=.*[@$!%*#?&])[A-Za-z\d@$!%*#?&]{8,}$/;
function mockAuthenticate(email, password, ms = 1500) {
return new Promise((resolve, reject) => {
setTimeout(() => {
if (Math.random() < 0.5) resolve(email);
View machine.js
// Available variables:
// - Machine
// - interpret
// - assign
// - send
// - sendParent
// - spawn
// - raise
// - actions
View machine.js
// Available variables:
// - Machine
// - interpret
// - assign
// - send
// - sendParent
// - spawn
// - raise
// - actions
View oxea_bishop_qr_codes.csv
title id
Bill's Pump P-201 0SMXdqEPUWGzhgMzJ2UX
16E1 Brine Exchanger 2Ghc9mqNC4J7xUBusiZg
Demo Pump P-0100 4frqz1OOo6FAY2dpnzP3
C Ditch 4mivCBjk9B4FsMYQ9dWL
V-1267 5z7NEvpQgsYwF5hFt2ix
16Z1 C Refrigeration Compressor 85RdTIPCLYvrJ0Ma5ybG
Leveling Pond 8doLIoXUMKA7fGIRf2hh
xxxxx 97z1kTNJB9W2oT9R28tG
16P1-2 Chilled Brine Pump AI4wFNxUTKaJBRuOeKsL
View machine.js
const incrementTime = assign({
time: (context, e) => context.time + 1
});
// Guard to check if the max count was reached
function maxCountReached(context, event) {
return context.time >= 3;
}
const timerMachine = Machine(