Skip to content

Instantly share code, notes, and snippets.

View sandwichsudo's full-sized avatar

Gilly Ames sandwichsudo

3 followers · 1 following
  • Octopus Energy
View GitHub Profile
@sandwichsudo
sandwichsudo / machine.js
Created August 13, 2021 11:56
Generated by XState Viz: https://xstate.js.org/viz
const machine = Machine(
{
id: 'call',
context: {
participants: [],
color: '#fff',
},
initial: 'idle',
states: {
idle: {
@sandwichsudo
sandwichsudo / machine.js
Last active July 30, 2021 14:54
Generated by XState Viz: https://xstate.js.org/viz
const door = Machine({
id: 'door',
initial: 'idle',
states: {
idle: {
context: {
participants: [],
},
@sandwichsudo
sandwichsudo / InfiniteScroll.jsx
Last active July 16, 2019 14:30
React Infinite scroll component (design for use with ApolloClient/Relay Pagination)
/**
* Credit: https://medium.com/@alfianlosari/graphql-cursor-infinite-scroll-pagination-with-react-apollo-client-and-github-api-fafbc510b667
* This component will call the onLoadMore prop when you scroll to the bottom of the page or click
* the button, and pass the fetched data to the component you give it
* */
import React, { Component, Fragment } from 'react';
import PropTypes from 'prop-types';
class InfiniteScroll extends Component {
@sandwichsudo
sandwichsudo / RepoSearchReducer.js
Last active July 27, 2017 14:29
Reducer case to update the error when request completes.
// src/containers/RepoSearchPage/reducer/RepoSearchReducer.js
import { actionTypes } from '../RepoSearchConstants';
const initialState = {
results: [],
error: ''
};
export default (state = initialState, action) => {
@sandwichsudo
sandwichsudo / RepoSearchReducer.spec.js
Last active July 27, 2017 14:30
Add test to update error in state.
// src/containers/RepoSearchPage/reducer/RepoSearchReducer.spec.js
import RepoSearchReducer from './RepoSearchReducer';
import { actionTypes } from '../RepoSearchConstants';
const initialState = {
results: [],
error: '',
};
@sandwichsudo
sandwichsudo / RepoSearchActions.js
Last active July 27, 2017 14:30
New action structure
// src/containers/RepoSearchPage/actions/RepoSearchActions.js
import searchService from '../../../services/search/searchService';
import { actionTypes } from '../RepoSearchConstants';
export const fetchRepos = () => async (dispatch) => {
let error = '';
try {
const { items } = await searchService.repoSearch();
dispatch({
@sandwichsudo
sandwichsudo / RepoSearchActions.spec.js
Last active July 27, 2017 14:31
Add test for action with error flow
// src/containers/RepoSearchPage/actions/RepoSearchActions.spec.js
import { fetchRepos } from './RepoSearchActions';
import searchService from '../../../services/search/searchService';
import { actionTypes } from '../RepoSearchConstants';
jest.mock('../../../services/search/searchService');
describe('repo search actions', () => {
describe('fetchRepos', () => {
@sandwichsudo
sandwichsudo / RepoSearchPage.js
Last active July 27, 2017 14:32
Add error to the state
// src/containers/RepoSearchPage/page/RepoSearchPage.js
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { connect } from 'react-redux';
import { bindActionCreators } from 'redux';
import RepoResultsList from '../components/RepoResultsList/RepoResultsList';
import * as RepoSearchActions from '../actions/RepoSearchActions';
export class RepoSearchPage extends Component {
@sandwichsudo
sandwichsudo / RepoSearchPage.js
Last active July 27, 2017 14:32
Call api when component mounts
// src/containers/RepoSearchPage/page/RepoSearchPage.js
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { connect } from 'react-redux';
import { bindActionCreators } from 'redux';
import RepoResultsList from '../components/RepoResultsList/RepoResultsList';
import * as RepoSearchActions from '../actions/RepoSearchActions';
export class RepoSearchPage extends Component {
@sandwichsudo
sandwichsudo / RepoSearchPage.js
Last active July 27, 2017 14:33
Test for calling API when component mounts
// src/containers/RepoSearchPage/page/RepoSearchPage.js
// export the class to test in isolation
export class RepoSearchPage extends Component {
constructor(props) {
super(props);
}
...