Skip to content

Instantly share code, notes, and snippets.

Avatar
🎯
Focusing

Ryan Collins RyanCCollins

🎯
Focusing
View GitHub Profile
View stackandqueue.js
class Stack {
constructor() {
this.storage = [];
}
push(val) {
this.storage.push(val);
}
pop() {
this.storage.pop();
}
@RyanCCollins
RyanCCollins / 1WithAnimation.tsx
Last active Apr 5, 2017
With Animation HOC; styled-components animation made easy
View 1WithAnimation.tsx
// See original source here: https://github.com/RyanCCollins/the-agency/tree/master/packages/ui/src/WithAnimation
import * as React from 'react';
import { ThemedCssFunction } from 'styled-components';
import Animation from './animation';
import { AnimationType } from './types';
export interface Props {
type?: AnimationType;
isVisible: boolean;
View styled-components-animation.ts
import styled, { css } from 'styled-components';
import { StateProps } from './types';
import { Heading } from 'ui';
function styles({ isVisible }: StateProps) {
const opacity = isVisible
? 1.0
: 0.0;
const translate = isVisible
? 0
View _objects.dropzone.scss
.grommetux-dropzone {
border-width: 2px;
border-color: #333;
border-style: dashed;
border-radius: 4px;
transition: all 0.5s;
}
.grommetux-dropzone__input {
display: none;
View BlogPost-index.ts
import * as React from 'react';
import { graphql } from 'react-apollo';
import { LoadingIndicator, Post, Section } from 'components';
import POST_QUERY from './post.graphql';
import COMMENT_MUTATION from './comments.graphql';
interface IPostComments {
body: string;
author: string;
}
View comment-mutations.ts
// From client/containers/BlogPost/comments.graphql.ts
import gql from 'graphql-tag';
export default gql`
mutation CreateComment($post: ID!, $body: String, $author: String) {
createComment(data:{ post: $post, body: $body, author: $author })
}
`;
// From client/containers/BlogPost/index.tsx
View commet-mutations.ts
import {
GraphQLNonNull,
GraphQLBoolean,
} from 'graphql';
import types from '../../types';
import CommentModel from '../../../db/models/comment';
export default {
type: GraphQLBoolean,
@RyanCCollins
RyanCCollins / index.tsx
Last active Feb 20, 2017
Blog container
View index.tsx
import * as React from 'react';
import { graphql } from 'react-apollo';
import { Headline, LoadingIndicator, PostCard, Section, Box } from 'components';
import POST_QUERY from './posts.graphql';
import { StyledHr } from './styles';
interface IPost {
id: string;
title: string;
image: string;
@RyanCCollins
RyanCCollins / posts.graphql.ts
Created Feb 18, 2017
GraphQL Query for Blog Posts
View posts.graphql.ts
// From client/containers/Blog/posts.graphql.ts
import gql from 'graphql-tag';
export default gql`
query Posts {
posts {
id: _id
title
image
content
View apolloClient.ts
import { ApolloClient, createNetworkInterface } from 'apollo-client';
declare var window: {
__APOLLO_STATE__: string,
};
const uri = process.env.API_URL || 'http://0.0.0.0:1338/api';
const client = new ApolloClient({
networkInterface: createNetworkInterface({