The [documentation website](https://scalable-react-ts-boilerplate.herokuapp.com/) built for this boilerplate is deployed to Heroku. Included is a Procfile that will run the server. The deployment is automated completely. After the install script, the deploy script will run on the server in order to compile the bundle and prepare the build folder for server-rendering.
## Scripts
- `npm run setup:yarn`
- Install the package dependencies via yarn (recomended)
- `npm install`
- Install dependencies (the ol' fashioned way)
- `npm run start`
- Start the dev server
- `npm run build`
- Build the project
- `npm run deploy`
- Create a production bundle for deployment
- `npm run serve`
- Serve the production bundle on port 1337
- `npm run test`
- Run the test suite
- `npm run test:watch`
- Run the test suite in watch mode
- `npm run test:update`
- Update the failing snapshot tests
- `npm run storybook`
- Run the storybook server
## Resources
- [JavaScript Code Quality with Free Tools](https://dev-blog.apollodata.com/javascript-code-quality-with-free-tools-9a6d80e29f2d#.1unvvh8vw)
- [Working with React & TypeScript](http://blog.wolksoftware.com/working-with-react-and-typescript)
- [Setting up a New React / TypeScript Project](http://blog.tomduncalf.com/posts/setting-up-typescript-and-react/)
- [Feature First Architecture](https://medium.com/front-end-hacking/the-secret-to-organization-in-functional-programming-913484e85fc9#.8nerdsqhd)
## Contributing
See here for our [contribution guide](https://github.com/RyanCCollins/scalable-react-typescript-boilerplate/blob/master/CONTRIBUTING.md). We are on slack, please go [here for an invite](https://scalable-react-slack.herokuapp.com/)! We'd love to hear from you!
## License
See here for the [license](https://github.com/RyanCCollins/scalable-react-typescript-boilerplate/blob/master/LICENSE).
## Roadmap
### v1.0.2
- [X] Add CI
- [x] Introduce an async redux workflow
- Redux logic
- [x] Integrate storybook
- [x] Standardize the tslint configuration
- [x] Add more reusable modules, ala box / section
- [x] Refactor reusable modules into uikit
- [x] Remove requires and use es6 imports for all libs
- [x] Add a no any rule and update source to use it
- [ ] Migrate to a multi-module pattern using lerna (in progress)
## Troubleshooting
Make sure to use the right version of node. You can reference the version in the `.nvmrc` file. For help installing and using NVM, please refer to this [gist](https://gist.github.com/RyanCCollins/1a5686ff9dd51b72eb2d4dc70aa6c1f4).
================================================
FILE: config/.storybook/addons.js
================================================
// To get default addons (actions and links)
import '@kadira/storybook/addons';
// To add the knobs addon
import '@kadira/storybook-addon-knobs/register'
================================================
FILE: config/.storybook/config.js
================================================
import { configure, setAddon } from '@kadira/storybook';
import infoAddon from '@kadira/react-storybook-addon-info';
import withPropsCombinations, { setDefaults } from 'react-storybook-addon-props-combinations'
setAddon(withPropsCombinations)
setAddon(infoAddon);
function loadStories() {
require('./stories/index.js');
}
configure(loadStories, module);
================================================
FILE: config/.storybook/stories/index.js
================================================
================================================
FILE: config/.storybook/webpack.config.js
================================================
const path = require('path');
const config = require('../../webpack.config.server.js');
const ROOT_PATH = path.resolve(__dirname, '../../');
module.exports = {
resolve: {
extensions: ['', '.js', '.jsx', '.json', '.css'],
alias: config.resolve.alias,
},
module: {
loaders: [
{ test: /\.css$/, loaders: ['style-loader', 'css-loader'] },
]
}
}
================================================
FILE: config/generators/cli.js
================================================
const componentGenerator = require('./component/index.js');
const SafeString = require('./utils/safeString').SafeString;
const containerGenerator = require('./container/index.js');
module.exports = (plop) => {
plop.setGenerator('component', componentGenerator);
plop.setGenerator('feature', containerGenerator);
plop.addHelper('uppercase', (text) => {
return text.toUpperCase();
});
plop.addHelper('getPath', (p, itemName) => {
const pathParts = p.split('/');
const index = pathParts.indexOf(itemName);
const newPath = pathParts.slice(index + 1, pathParts.length);
return newPath.length < 1 ? `./${newPath}` : `./${newPath.join('/')}/`;
});
plop.addHelper('createImports', (list) => {
const items = list.map((item) => `import ${item} from 'grommet/components/${item}';`).join('\n');
return new SafeString(items);
});
plop.addHelper('curly', (object, open) => (open ? '{' : '}'));
};
================================================
FILE: config/generators/component/es6class.tsx.hbs
================================================
import * as React from 'react';
import Component from './styles';
export interface Props extends React.HTMLPropsextends Action { type: string; payload?: P; } ================================================ FILE: packages/docs/src/client/shared/constants.ts ================================================ export type DEFAULT_ACTION_TYPE = ''; export const DEFAULT_ACTION_TYPE: DEFAULT_ACTION_TYPE = ''; ================================================ FILE: packages/docs/src/client/state.ts ================================================ /* GENERATOR-IMPORT-STATE */ import { initialState as appState, State as AppState } from './containers/App/state'; import { initialState as docsState, State as DocsState } from './containers/Docs/state'; import { initialState as todoAppState, State as TodoAppState } from './containers/TodoApp/state'; import { initialState as blogPostState, State as BlogPostState } from './containers/BlogPost/state'; export interface State { /* GENERATOR-EXPORT-STATE-TYPE */ todoApp: TodoAppState; app: AppState; docs: DocsState; blogPost: BlogPostState; } export const initialState: State = { /* GENERATOR-EXPORT-STATE */ app: appState, docs: docsState, todoApp: todoAppState, blogPost: blogPostState, }; ================================================ FILE: packages/docs/src/client/store.tsx ================================================ import { createStore, applyMiddleware, Middleware, GenericStoreEnhancer, compose } from 'redux'; import { syncHistoryWithStore } from 'react-router-redux'; import { browserHistory } from 'react-router'; import { createLogicMiddleware } from 'redux-logic'; import { rootReducer} from './reducers'; import { initialState as defaultInitialState} from './state'; import apolloClient from './apolloClient'; import rootLogic from './logic'; import axios from 'axios'; const isClient = typeof document !== 'undefined'; declare var window: { __INITIAL_STATE__: {} }; const initialState = isClient ? window.__INITIAL_STATE__ : defaultInitialState; function createThunkMiddleware() { return ({ dispatch, getState }) => (next) => (action) => { if (typeof action === 'function') { return action(dispatch, getState); } return next(action); }; } const dependencies = { httpClient: axios, }; const thunk = createThunkMiddleware(); const logicMiddleware = createLogicMiddleware(rootLogic, dependencies); const apolloClientMiddleware = apolloClient.middleware(); const middlewares: Middleware[] = [ thunk, apolloClientMiddleware, logicMiddleware, ]; const enhancers: GenericStoreEnhancer[] = [ applyMiddleware(...middlewares), ]; const ReduxExtentionComposeName: string = '__REDUX_DEVTOOLS_EXTENSION_COMPOSE__'; const composeEnhancers = process.env.NODE_ENV !== 'production' && typeof window === 'object' && window[ReduxExtentionComposeName] ? window[ReduxExtentionComposeName] : compose; const store = createStore( rootReducer, initialState, composeEnhancers(...enhancers), ); export const history = isClient ? syncHistoryWithStore(browserHistory, store) : undefined; export default store; ================================================ FILE: packages/docs/src/client/test/mockstore.ts ================================================ import configureMockStore from 'redux-mock-store'; import { Middleware } from 'redux'; import { createLogicMiddleware } from 'redux-logic'; import rootLogic from '../logic'; import axios from 'axios'; const dependencies = { httpClient: axios, }; const logicMiddleware = createLogicMiddleware(rootLogic, dependencies); const middlewares: Middleware[] = [ logicMiddleware, ]; const mockStore = configureMockStore(middlewares); export default mockStore; ================================================ FILE: packages/docs/src/client/theming/colorMap.ts ================================================ import { ThemeColorMap } from './types'; const colorMap: ThemeColorMap = { dark1: '#293953', dark2: '#6B4E71', dark3: '#829399', light1: '#34E4EA', light2: '#D6DBB2', light3: '#6D72C3', primary: '#007acc', secondary: '#c05b4d', ok: '#8cc800', warning: '#ffd602', error: '#ff324d', white1: '#fff', white2: '#f3f3f3', white3: '#e6e8ec', offwhite: '#f5f5f5', black1: '#0a0a0a', black2: '#2d2d2d', black3: '#555555', }; export default colorMap; ================================================ FILE: packages/docs/src/client/theming/globalCss.ts ================================================ import { injectGlobal } from 'styled-components'; const globalCss = injectGlobal` * { box-sizing: border-box; } body { overflow: scroll; overflow-x: hidden; padding: 0; margin: 0; font-family: Hind,sans-serif; font-weight: 400; line-height: 1.5; color: #0a0a0a; background: #fff; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } html { font-size: 100%; box-sizing: border-box; overflow-x: hidden; } .markdown-body { max-width: 100% !important; } `; export default globalCss; ================================================ FILE: packages/docs/src/client/theming/index.ts ================================================ import colorMap from './colorMap'; export default colorMap; ================================================ FILE: packages/docs/src/client/theming/types.ts ================================================ export interface ThemeColorMap { dark1: string, dark2: string, dark3: string, light1: string, light2: string, light3: string, primary: string, secondary: string, ok: string, warning: string, error: string, white1: string, white2: string, white3: string, offwhite: string, black1: string, black2: string, black3: string, } ================================================ FILE: packages/docs/src/client/types.ts ================================================ import { Action } from 'redux'; /* GENERATOR-IMPORT */ import * as AppTypes from 'containers/App/types'; import * as TodoAppTypes from 'containers/TodoApp/types'; import * as BlogPostTypes from 'containers/BlogPost/types'; import * as BlogTypes from 'containers/Blog/types'; import * as DocsTypes from 'containers/Docs/types'; import * as FeaturesTypes from 'containers/Features/types'; import * as HomeTypes from 'containers/Home/types'; export { ThemeColorMap } from './theming/types'; export interface PayloadAction
extends Action {
type: string;
payload?: P;
}
export interface FormControlEventTarget extends EventTarget {
value: string;
}
export {
/* GENERATOR-EXPORT */
AppTypes,
TodoAppTypes,
DocsTypes,
BlogPostTypes,
BlogTypes,
FeaturesTypes,
HomeTypes,
};
================================================
FILE: packages/docs/src/server/db/index.ts
================================================
import mongoose from 'mongoose';
import path from 'path';
import PostModel from './models/post';
function seedPosts() {
return [
{
title: 'Welcome!',
content: 'Hey there! Welcome to the blog of Scalable-React-TypeScript! ' +
'This is just an introductory post, but stay tuned for more!',
image: 'https://raw.githubusercontent.com/RyanCCollins/cdn/master/stsb-images/ts-resized-2.png',
},
];
}
function createSeedPosts() {
return new Promise((res, rej) => {
PostModel.find().exec((err, docs) => {
if (docs.length === 0) {
PostModel.create(
seedPosts(),
(err, data) => {
if (err) {
rej(err);
}
res(data);
},
);
}
});
});
}
function createSeedData() {
return new Promise((res, rej) => {
createSeedPosts().then(() => {
res();
}).catch((err) => rej(err));
});
}
const env = require('node-env-file');
env(path.join(process.cwd(), '.env'));
const dbUri = process.env.MONGODB_URI;
mongoose.Promise = global.Promise;
mongoose.connect(dbUri);
mongoose.connection.on('connected', () => {
console.info(`Mongoose connection open to ${dbUri}`);
createSeedData();
});
process.on('SIGINT', () => {
mongoose.connection.close(() => {
console.info('Mongoose connection disconnected through app termination');
process.exit(0);
});
});
================================================
FILE: packages/docs/src/server/db/models/comment.ts
================================================
import mongoose from 'mongoose';
const CommentSchema = new mongoose.Schema({
author: String,
body: String,
post: {
type: String,
ref: 'Post',
},
});
export default mongoose.model('Comment', CommentSchema);
================================================
FILE: packages/docs/src/server/db/models/post.ts
================================================
import mongoose from 'mongoose';
const PostSchema = new mongoose.Schema({
title: {
type: String,
},
image: {
type: String,
},
content: {
type: String,
},
comments: [{ type: String, ref: 'Comment' }],
});
export default mongoose.model('Post', PostSchema);
================================================
FILE: packages/docs/src/server/db/utils/uuid.ts
================================================
// tslint:disable
export default function uuid() {
var i;
var random;
var uuid = '';
for (i = 0; i < 32; i++) {
random = Math.random() * 16 | 0;
if (i === 8 || i === 12 || i === 16 || i === 20) {
uuid += '-';
}
uuid += (i === 12 ? 4 : (i === 16 ? (random & 3 | 8) : random)).toString(16);
}
return uuid;
}
================================================
FILE: packages/docs/src/server/graph/index.ts
================================================
import {
GraphQLObjectType,
GraphQLSchema,
} from 'graphql';
import queries from './queries';
import mutations from './mutations';
const RootQuery: GraphQLObjectType = new GraphQLObjectType({
name: 'Query',
fields: () => queries,
});
const RootMutation: GraphQLObjectType = new GraphQLObjectType({
name: 'Mutation',
fields: () => mutations,
});
export default new GraphQLSchema({
query: RootQuery,
mutation: RootMutation,
});
================================================
FILE: packages/docs/src/server/graph/mutations/comment/createComment.ts
================================================
import {
GraphQLNonNull,
GraphQLBoolean,
} from 'graphql';
import types from '../../types';
import CommentModel from '../../../db/models/comment';
export default {
type: GraphQLBoolean,
args: {
data: {
type: new GraphQLNonNull(types.commentInputType),
},
},
async resolve(_, args, __) {
const model = new CommentModel(args.data);
const newComment = await model.save();
if (!newComment) {
throw new Error('Error saving comment');
}
return true;
},
};
================================================
FILE: packages/docs/src/server/graph/mutations/comment/index.ts
================================================
import createComment from './createComment';
export default {
createComment,
};
================================================
FILE: packages/docs/src/server/graph/mutations/index.ts
================================================
import commentMutations from './comment';
export default {
...commentMutations,
};
================================================
FILE: packages/docs/src/server/graph/queries/comment/comment.ts
================================================
import {
GraphQLNonNull,
GraphQLID,
} from 'graphql';
import types from '../../types/';
import CommentModel from '../../../db/models/comment';
export default {
type: types.commentType,
args: {
id: {
type: new GraphQLNonNull(GraphQLID),
},
},
resolve(_, args, __) {
return CommentModel
.findById(args.id)
.exec();
},
};
================================================
FILE: packages/docs/src/server/graph/queries/comment/comments.ts
================================================
import {
GraphQLList,
GraphQLNonNull,
GraphQLID,
} from 'graphql';
import types from '../../types/';
import CommentModel from '../../../db/models/comment';
export default {
type: new GraphQLList(types.commentType),
args: {
postId: {
type: new GraphQLNonNull(GraphQLID),
},
},
resolve(_, args, __) {
return CommentModel
.find({
post: args.postId,
})
.exec();
},
};
================================================
FILE: packages/docs/src/server/graph/queries/comment/index.ts
================================================
import comment from './comment';
import comments from './comments';
export default {
comment,
comments,
};
================================================
FILE: packages/docs/src/server/graph/queries/index.ts
================================================
import posts from './post';
import comment from './comment';
export default {
...posts,
...comment,
};
================================================
FILE: packages/docs/src/server/graph/queries/post/index.ts
================================================
import post from './post';
import posts from './posts';
export default {
post,
posts,
};
================================================
FILE: packages/docs/src/server/graph/queries/post/post.ts
================================================
import {
GraphQLNonNull,
GraphQLID,
} from 'graphql';
import types from '../../types';
import PostModel from '../../../db/models/post';
export default {
type: types.postType,
args: {
id: {
type: new GraphQLNonNull(GraphQLID),
},
},
resolve(_, args, __) {
return PostModel
.findById(args.id)
.populate('comments')
.exec();
},
};
================================================
FILE: packages/docs/src/server/graph/queries/post/posts.ts
================================================
import {
GraphQLList,
} from 'graphql';
import types from '../../types';
import PostModel from '../../../db/models/post';
export default {
type: new GraphQLList(types.postType),
args: {},
resolve() {
return PostModel
.find()
.exec();
},
};
================================================
FILE: packages/docs/src/server/graph/schema.json
================================================
{
"data": {
"__schema": {
"queryType": {
"name": "Query"
},
"mutationType": null,
"subscriptionType": null,
"types": [
{
"kind": "OBJECT",
"name": "Query",
"description": null,
"fields": [
{
"name": "posts",
"description": null,
"args": [],
"type": {
"kind": "LIST",
"name": null,
"ofType": {
"kind": "OBJECT",
"name": "Post",
"ofType": null
}
},
"isDeprecated": false,
"deprecationReason": null
}
],
"inputFields": null,
"interfaces": [],
"enumValues": null,
"possibleTypes": null
},
{
"kind": "OBJECT",
"name": "Post",
"description": null,
"fields": [
{
"name": "id",
"description": null,
"args": [],
"type": {
"kind": "SCALAR",
"name": "String",
"ofType": null
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "title",
"description": null,
"args": [],
"type": {
"kind": "SCALAR",
"name": "String",
"ofType": null
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "snippet",
"description": null,
"args": [],
"type": {
"kind": "SCALAR",
"name": "String",
"ofType": null
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "recommendations",
"description": null,
"args": [],
"type": {
"kind": "LIST",
"name": null,
"ofType": {
"kind": "OBJECT",
"name": "Recommendation",
"ofType": null
}
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "tags",
"description": null,
"args": [],
"type": {
"kind": "LIST",
"name": null,
"ofType": {
"kind": "OBJECT",
"name": "Tag",
"ofType": null
}
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "uniqueSlug",
"description": null,
"args": [],
"type": {
"kind": "SCALAR",
"name": "String",
"ofType": null
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "image",
"description": null,
"args": [],
"type": {
"kind": "SCALAR",
"name": "String",
"ofType": null
},
"isDeprecated": false,
"deprecationReason": null
}
],
"inputFields": null,
"interfaces": [],
"enumValues": null,
"possibleTypes": null
},
{
"kind": "SCALAR",
"name": "String",
"description": "The `String` scalar type represents textual data, represented as UTF-8 character sequences. The String type is most often used by GraphQL to represent free-form human-readable text.",
"fields": null,
"inputFields": null,
"interfaces": null,
"enumValues": null,
"possibleTypes": null
},
{
"kind": "OBJECT",
"name": "Recommendation",
"description": null,
"fields": [
{
"name": "name",
"description": null,
"args": [],
"type": {
"kind": "SCALAR",
"name": "String",
"ofType": null
},
"isDeprecated": false,
"deprecationReason": null
}
],
"inputFields": null,
"interfaces": [],
"enumValues": null,
"possibleTypes": null
},
{
"kind": "OBJECT",
"name": "Tag",
"description": null,
"fields": [
{
"name": "slug",
"description": null,
"args": [],
"type": {
"kind": "SCALAR",
"name": "String",
"ofType": null
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "name",
"description": null,
"args": [],
"type": {
"kind": "SCALAR",
"name": "String",
"ofType": null
},
"isDeprecated": false,
"deprecationReason": null
}
],
"inputFields": null,
"interfaces": [],
"enumValues": null,
"possibleTypes": null
},
{
"kind": "OBJECT",
"name": "__Schema",
"description": "A GraphQL Schema defines the capabilities of a GraphQL server. It exposes all available types and directives on the server, as well as the entry points for query, mutation, and subscription operations.",
"fields": [
{
"name": "types",
"description": "A list of all types supported by this server.",
"args": [],
"type": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "LIST",
"name": null,
"ofType": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "OBJECT",
"name": "__Type",
"ofType": null
}
}
}
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "queryType",
"description": "The type that query operations will be rooted at.",
"args": [],
"type": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "OBJECT",
"name": "__Type",
"ofType": null
}
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "mutationType",
"description": "If this server supports mutation, the type that mutation operations will be rooted at.",
"args": [],
"type": {
"kind": "OBJECT",
"name": "__Type",
"ofType": null
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "subscriptionType",
"description": "If this server support subscription, the type that subscription operations will be rooted at.",
"args": [],
"type": {
"kind": "OBJECT",
"name": "__Type",
"ofType": null
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "directives",
"description": "A list of all directives supported by this server.",
"args": [],
"type": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "LIST",
"name": null,
"ofType": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "OBJECT",
"name": "__Directive",
"ofType": null
}
}
}
},
"isDeprecated": false,
"deprecationReason": null
}
],
"inputFields": null,
"interfaces": [],
"enumValues": null,
"possibleTypes": null
},
{
"kind": "OBJECT",
"name": "__Type",
"description": "The fundamental unit of any GraphQL Schema is the type. There are many kinds of types in GraphQL as represented by the `__TypeKind` enum.\n\nDepending on the kind of a type, certain fields describe information about that type. Scalar types provide no information beyond a name and description, while Enum types provide their values. Object and Interface types provide the fields they describe. Abstract types, Union and Interface, provide the Object types possible at runtime. List and NonNull types compose other types.",
"fields": [
{
"name": "kind",
"description": null,
"args": [],
"type": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "ENUM",
"name": "__TypeKind",
"ofType": null
}
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "name",
"description": null,
"args": [],
"type": {
"kind": "SCALAR",
"name": "String",
"ofType": null
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "description",
"description": null,
"args": [],
"type": {
"kind": "SCALAR",
"name": "String",
"ofType": null
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "fields",
"description": null,
"args": [
{
"name": "includeDeprecated",
"description": null,
"type": {
"kind": "SCALAR",
"name": "Boolean",
"ofType": null
},
"defaultValue": "false"
}
],
"type": {
"kind": "LIST",
"name": null,
"ofType": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "OBJECT",
"name": "__Field",
"ofType": null
}
}
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "interfaces",
"description": null,
"args": [],
"type": {
"kind": "LIST",
"name": null,
"ofType": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "OBJECT",
"name": "__Type",
"ofType": null
}
}
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "possibleTypes",
"description": null,
"args": [],
"type": {
"kind": "LIST",
"name": null,
"ofType": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "OBJECT",
"name": "__Type",
"ofType": null
}
}
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "enumValues",
"description": null,
"args": [
{
"name": "includeDeprecated",
"description": null,
"type": {
"kind": "SCALAR",
"name": "Boolean",
"ofType": null
},
"defaultValue": "false"
}
],
"type": {
"kind": "LIST",
"name": null,
"ofType": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "OBJECT",
"name": "__EnumValue",
"ofType": null
}
}
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "inputFields",
"description": null,
"args": [],
"type": {
"kind": "LIST",
"name": null,
"ofType": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "OBJECT",
"name": "__InputValue",
"ofType": null
}
}
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "ofType",
"description": null,
"args": [],
"type": {
"kind": "OBJECT",
"name": "__Type",
"ofType": null
},
"isDeprecated": false,
"deprecationReason": null
}
],
"inputFields": null,
"interfaces": [],
"enumValues": null,
"possibleTypes": null
},
{
"kind": "ENUM",
"name": "__TypeKind",
"description": "An enum describing what kind of type a given `__Type` is.",
"fields": null,
"inputFields": null,
"interfaces": null,
"enumValues": [
{
"name": "SCALAR",
"description": "Indicates this type is a scalar.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "OBJECT",
"description": "Indicates this type is an object. `fields` and `interfaces` are valid fields.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "INTERFACE",
"description": "Indicates this type is an interface. `fields` and `possibleTypes` are valid fields.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "UNION",
"description": "Indicates this type is a union. `possibleTypes` is a valid field.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "ENUM",
"description": "Indicates this type is an enum. `enumValues` is a valid field.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "INPUT_OBJECT",
"description": "Indicates this type is an input object. `inputFields` is a valid field.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "LIST",
"description": "Indicates this type is a list. `ofType` is a valid field.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "NON_NULL",
"description": "Indicates this type is a non-null. `ofType` is a valid field.",
"isDeprecated": false,
"deprecationReason": null
}
],
"possibleTypes": null
},
{
"kind": "SCALAR",
"name": "Boolean",
"description": "The `Boolean` scalar type represents `true` or `false`.",
"fields": null,
"inputFields": null,
"interfaces": null,
"enumValues": null,
"possibleTypes": null
},
{
"kind": "OBJECT",
"name": "__Field",
"description": "Object and Interface types are described by a list of Fields, each of which has a name, potentially a list of arguments, and a return type.",
"fields": [
{
"name": "name",
"description": null,
"args": [],
"type": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "SCALAR",
"name": "String",
"ofType": null
}
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "description",
"description": null,
"args": [],
"type": {
"kind": "SCALAR",
"name": "String",
"ofType": null
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "args",
"description": null,
"args": [],
"type": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "LIST",
"name": null,
"ofType": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "OBJECT",
"name": "__InputValue",
"ofType": null
}
}
}
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "type",
"description": null,
"args": [],
"type": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "OBJECT",
"name": "__Type",
"ofType": null
}
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "isDeprecated",
"description": null,
"args": [],
"type": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "SCALAR",
"name": "Boolean",
"ofType": null
}
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "deprecationReason",
"description": null,
"args": [],
"type": {
"kind": "SCALAR",
"name": "String",
"ofType": null
},
"isDeprecated": false,
"deprecationReason": null
}
],
"inputFields": null,
"interfaces": [],
"enumValues": null,
"possibleTypes": null
},
{
"kind": "OBJECT",
"name": "__InputValue",
"description": "Arguments provided to Fields or Directives and the input fields of an InputObject are represented as Input Values which describe their type and optionally a default value.",
"fields": [
{
"name": "name",
"description": null,
"args": [],
"type": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "SCALAR",
"name": "String",
"ofType": null
}
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "description",
"description": null,
"args": [],
"type": {
"kind": "SCALAR",
"name": "String",
"ofType": null
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "type",
"description": null,
"args": [],
"type": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "OBJECT",
"name": "__Type",
"ofType": null
}
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "defaultValue",
"description": "A GraphQL-formatted string representing the default value for this input value.",
"args": [],
"type": {
"kind": "SCALAR",
"name": "String",
"ofType": null
},
"isDeprecated": false,
"deprecationReason": null
}
],
"inputFields": null,
"interfaces": [],
"enumValues": null,
"possibleTypes": null
},
{
"kind": "OBJECT",
"name": "__EnumValue",
"description": "One possible value for a given Enum. Enum values are unique values, not a placeholder for a string or numeric value. However an Enum value is returned in a JSON response as a string.",
"fields": [
{
"name": "name",
"description": null,
"args": [],
"type": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "SCALAR",
"name": "String",
"ofType": null
}
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "description",
"description": null,
"args": [],
"type": {
"kind": "SCALAR",
"name": "String",
"ofType": null
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "isDeprecated",
"description": null,
"args": [],
"type": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "SCALAR",
"name": "Boolean",
"ofType": null
}
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "deprecationReason",
"description": null,
"args": [],
"type": {
"kind": "SCALAR",
"name": "String",
"ofType": null
},
"isDeprecated": false,
"deprecationReason": null
}
],
"inputFields": null,
"interfaces": [],
"enumValues": null,
"possibleTypes": null
},
{
"kind": "OBJECT",
"name": "__Directive",
"description": "A Directive provides a way to describe alternate runtime execution and type validation behavior in a GraphQL document.\n\nIn some cases, you need to provide options to alter GraphQL's execution behavior in ways field arguments will not suffice, such as conditionally including or skipping a field. Directives provide this by describing additional information to the executor.",
"fields": [
{
"name": "name",
"description": null,
"args": [],
"type": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "SCALAR",
"name": "String",
"ofType": null
}
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "description",
"description": null,
"args": [],
"type": {
"kind": "SCALAR",
"name": "String",
"ofType": null
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "locations",
"description": null,
"args": [],
"type": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "LIST",
"name": null,
"ofType": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "ENUM",
"name": "__DirectiveLocation",
"ofType": null
}
}
}
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "args",
"description": null,
"args": [],
"type": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "LIST",
"name": null,
"ofType": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "OBJECT",
"name": "__InputValue",
"ofType": null
}
}
}
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "onOperation",
"description": null,
"args": [],
"type": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "SCALAR",
"name": "Boolean",
"ofType": null
}
},
"isDeprecated": true,
"deprecationReason": "Use `locations`."
},
{
"name": "onFragment",
"description": null,
"args": [],
"type": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "SCALAR",
"name": "Boolean",
"ofType": null
}
},
"isDeprecated": true,
"deprecationReason": "Use `locations`."
},
{
"name": "onField",
"description": null,
"args": [],
"type": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "SCALAR",
"name": "Boolean",
"ofType": null
}
},
"isDeprecated": true,
"deprecationReason": "Use `locations`."
}
],
"inputFields": null,
"interfaces": [],
"enumValues": null,
"possibleTypes": null
},
{
"kind": "ENUM",
"name": "__DirectiveLocation",
"description": "A Directive can be adjacent to many parts of the GraphQL language, a __DirectiveLocation describes one such possible adjacencies.",
"fields": null,
"inputFields": null,
"interfaces": null,
"enumValues": [
{
"name": "QUERY",
"description": "Location adjacent to a query operation.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "MUTATION",
"description": "Location adjacent to a mutation operation.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "SUBSCRIPTION",
"description": "Location adjacent to a subscription operation.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "FIELD",
"description": "Location adjacent to a field.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "FRAGMENT_DEFINITION",
"description": "Location adjacent to a fragment definition.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "FRAGMENT_SPREAD",
"description": "Location adjacent to a fragment spread.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "INLINE_FRAGMENT",
"description": "Location adjacent to an inline fragment.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "SCHEMA",
"description": "Location adjacent to a schema definition.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "SCALAR",
"description": "Location adjacent to a scalar definition.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "OBJECT",
"description": "Location adjacent to an object type definition.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "FIELD_DEFINITION",
"description": "Location adjacent to a field definition.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "ARGUMENT_DEFINITION",
"description": "Location adjacent to an argument definition.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "INTERFACE",
"description": "Location adjacent to an interface definition.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "UNION",
"description": "Location adjacent to a union definition.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "ENUM",
"description": "Location adjacent to an enum definition.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "ENUM_VALUE",
"description": "Location adjacent to an enum value definition.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "INPUT_OBJECT",
"description": "Location adjacent to an input object type definition.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "INPUT_FIELD_DEFINITION",
"description": "Location adjacent to an input object field definition.",
"isDeprecated": false,
"deprecationReason": null
}
],
"possibleTypes": null
}
],
"directives": [
{
"name": "include",
"description": "Directs the executor to include this field or fragment only when the `if` argument is true.",
"locations": [
"FIELD",
"FRAGMENT_SPREAD",
"INLINE_FRAGMENT"
],
"args": [
{
"name": "if",
"description": "Included when true.",
"type": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "SCALAR",
"name": "Boolean",
"ofType": null
}
},
"defaultValue": null
}
]
},
{
"name": "skip",
"description": "Directs the executor to skip this field or fragment when the `if` argument is true.",
"locations": [
"FIELD",
"FRAGMENT_SPREAD",
"INLINE_FRAGMENT"
],
"args": [
{
"name": "if",
"description": "Skipped when true.",
"type": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "SCALAR",
"name": "Boolean",
"ofType": null
}
},
"defaultValue": null
}
]
},
{
"name": "deprecated",
"description": "Marks an element of a GraphQL schema as no longer supported.",
"locations": [
"FIELD_DEFINITION",
"ENUM_VALUE"
],
"args": [
{
"name": "reason",
"description": "Explains why this element was deprecated, usually also including a suggestion for how to access supported similar data. Formatted in [Markdown](https://daringfireball.net/projects/markdown/).",
"type": {
"kind": "SCALAR",
"name": "String",
"ofType": null
},
"defaultValue": "\"No longer supported\""
}
]
}
]
}
}
}
================================================
FILE: packages/docs/src/server/graph/types/comment/comment.ts
================================================
import {
GraphQLObjectType,
GraphQLString,
GraphQLNonNull,
GraphQLID,
} from 'graphql';
export default new GraphQLObjectType({
name: 'Comment',
fields: () => ({
author: { type: GraphQLString },
body: { type: GraphQLString },
post: { type: new GraphQLNonNull(GraphQLID) },
}),
});
================================================
FILE: packages/docs/src/server/graph/types/comment/commentInput.ts
================================================
import {
GraphQLInputObjectType,
GraphQLString,
GraphQLID,
GraphQLNonNull,
} from 'graphql';
export default new GraphQLInputObjectType({
name: 'CommentInput',
fields: () => ({
author: { type: GraphQLString },
body: { type: GraphQLString },
post: { type: new GraphQLNonNull(GraphQLID) },
}),
});
================================================
FILE: packages/docs/src/server/graph/types/index.ts
================================================
import postType from './post/post';
import postInputType from './post/postInput';
import commentType from './comment/comment';
import commentInputType from './comment/commentInput';
export default {
postType,
postInputType,
commentType,
commentInputType,
};
================================================
FILE: packages/docs/src/server/graph/types/post/post.ts
================================================
import {
GraphQLObjectType,
GraphQLList,
GraphQLString,
GraphQLID,
} from 'graphql';
import commentType from '../comment/comment';
export default new GraphQLObjectType({
name: 'Post',
fields: () => ({
_id: { type: GraphQLID },
title: { type: GraphQLString },
content: { type: GraphQLString },
comments: { type: new GraphQLList(commentType) },
image: { type: GraphQLString },
}),
});
================================================
FILE: packages/docs/src/server/graph/types/post/postInput.ts
================================================
import {
GraphQLInputObjectType,
GraphQLString,
} from 'graphql';
export default new GraphQLInputObjectType({
name: 'PostInput',
fields: () => ({
title: { type: GraphQLString },
content: { type: GraphQLString },
image: { type: GraphQLString },
}),
});
================================================
FILE: packages/docs/src/server/graphqlEntry.ts
================================================
import 'babel-polyfill';
import path from 'path';
import fs from 'fs';
import * as express from 'express';
import { graphql } from 'graphql';
import { introspectionQuery } from 'graphql/utilities';
import bodyParser from 'body-parser';
import cors from 'cors';
import { graphiqlExpress, graphqlExpress } from 'graphql-server-express';
import schema from './graph';
function createSchema() {
return new Promise extends Action {
type: string;
payload?: P;
}
================================================
FILE: src/client/shared/constants.ts
================================================
export type DEFAULT_ACTION_TYPE = '';
export const DEFAULT_ACTION_TYPE: DEFAULT_ACTION_TYPE = '';
================================================
FILE: src/client/state.ts
================================================
/* GENERATOR-IMPORT-STATE */
export interface State {
/* GENERATOR-EXPORT-STATE-TYPE */
}
export const initialState: State = {
/* GENERATOR-EXPORT-STATE */
};
================================================
FILE: src/client/store.tsx
================================================
import { createStore, applyMiddleware, Middleware, GenericStoreEnhancer, compose } from 'redux';
import { syncHistoryWithStore } from 'react-router-redux';
import { browserHistory } from 'react-router';
import { createLogicMiddleware } from 'redux-logic';
import { rootReducer } from './reducers';
import { initialState as defaultInitialState} from './state';
import apolloClient from './apolloClient';
import rootLogic from './logic';
import axios from 'axios';
const isClient = typeof document !== 'undefined';
declare var window: { __INITIAL_STATE__: {} };
const initialState = isClient ? window.__INITIAL_STATE__ : defaultInitialState;
function createThunkMiddleware() {
return ({ dispatch, getState }) => (next) => (action) => {
if (typeof action === 'function') {
return action(dispatch, getState);
}
return next(action);
};
}
const dependencies = {
httpClient: axios,
};
const thunk = createThunkMiddleware();
const logicMiddleware = createLogicMiddleware(rootLogic, dependencies);
const apolloClientMiddleware = apolloClient.middleware();
const middlewares: Middleware[] = [
thunk,
apolloClientMiddleware,
logicMiddleware,
];
const enhancers: GenericStoreEnhancer[] = [
applyMiddleware(...middlewares),
];
const ReduxExtentionComposeName: string = '__REDUX_DEVTOOLS_EXTENSION_COMPOSE__';
const composeEnhancers =
process.env.NODE_ENV !== 'production' &&
typeof window === 'object' &&
window[ReduxExtentionComposeName] ?
window[ReduxExtentionComposeName] : compose;
const store = createStore(
rootReducer,
initialState,
composeEnhancers(...enhancers),
);
export const history = isClient ?
syncHistoryWithStore(browserHistory, store) : undefined;
export default store;
================================================
FILE: src/client/test/mockstore.ts
================================================
import configureMockStore from 'redux-mock-store';
import { Middleware } from 'redux';
import { createLogicMiddleware } from 'redux-logic';
import rootLogic from '../logic';
import axios from 'axios';
const dependencies = {
httpClient: axios,
};
const logicMiddleware = createLogicMiddleware(rootLogic, dependencies);
const middlewares: Middleware[] = [
logicMiddleware,
];
const mockStore = configureMockStore(middlewares);
export default mockStore;
================================================
FILE: src/client/theming/colorMap.ts
================================================
import { ThemeColorMap } from './types';
const colorMap: ThemeColorMap = {
dark1: '#293953',
dark2: '#6B4E71',
dark3: '#829399',
light1: '#34E4EA',
light2: '#D6DBB2',
light3: '#6D72C3',
primary: '#007acc',
secondary: '#c05b4d',
ok: '#8cc800',
warning: '#ffd602',
error: '#ff324d',
white1: '#fff',
white2: '#f3f3f3',
white3: '#e6e8ec',
offwhite: '#f5f5f5',
black1: '#0a0a0a',
black2: '#2d2d2d',
black3: '#555555',
};
export default colorMap;
================================================
FILE: src/client/theming/globalCss.ts
================================================
import { injectGlobal } from 'styled-components';
const globalCss = injectGlobal`
* {
box-sizing: border-box;
}
body {
overflow: scroll;
overflow-x: hidden;
padding: 0;
margin: 0;
font-family: Hind,sans-serif;
font-weight: 400;
line-height: 1.5;
color: #0a0a0a;
background: #fff;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
html {
font-size: 100%;
box-sizing: border-box;
overflow-x: hidden;
}
.markdown-body {
max-width: 100% !important;
}
`;
export default globalCss;
================================================
FILE: src/client/theming/index.ts
================================================
import colorMap from './colorMap';
export default colorMap;
================================================
FILE: src/client/theming/types.ts
================================================
export interface ThemeColorMap {
dark1: string,
dark2: string,
dark3: string,
light1: string,
light2: string,
light3: string,
primary: string,
secondary: string,
ok: string,
warning: string,
error: string,
white1: string,
white2: string,
white3: string,
offwhite: string,
black1: string,
black2: string,
black3: string,
}
================================================
FILE: src/client/types.ts
================================================
import { Action } from 'redux';
/* GENERATOR-IMPORT */
import * as LandingTypes from 'features/Landing/types';
import * as LayoutTypes from 'features/Layout/types';
export { ThemeColorMap } from './theming/types';
export interface PayloadAction extends Action {
type: string;
payload?: P;
}
export interface FormControlEventTarget extends EventTarget {
value: string;
}
export {
/* GENERATOR-EXPORT */
LandingTypes,
LayoutTypes,
};
================================================
FILE: src/server/db/index.ts
================================================
import mongoose from 'mongoose';
import path from 'path';
import PostModel from './models/post';
function seedPosts() {
return [
{
title: 'Welcome!',
content: 'Hey there! Welcome to the blog of Scalable-React-TypeScript! ' +
'This is just an introductory post, but stay tuned for more!',
image: 'https://raw.githubusercontent.com/RyanCCollins/cdn/master/stsb-images/ts-resized-2.png',
},
];
}
function createSeedPosts() {
return new Promise((res, rej) => {
PostModel.find().exec((err, docs) => {
if (docs.length === 0) {
PostModel.create(
seedPosts(),
(err, data) => {
if (err) {
rej(err);
}
res(data);
},
);
}
});
});
}
function createSeedData() {
return new Promise((res, rej) => {
createSeedPosts().then(() => {
res();
}).catch((err) => rej(err));
});
}
const env = require('node-env-file');
env(path.join(process.cwd(), '.env'));
const dbUri = process.env.MONGODB_URI;
mongoose.Promise = global.Promise;
mongoose.connect(dbUri);
mongoose.connection.on('connected', () => {
console.info(`Mongoose connection open to ${dbUri}`);
createSeedData();
});
process.on('SIGINT', () => {
mongoose.connection.close(() => {
console.info('Mongoose connection disconnected through app termination');
process.exit(0);
});
});
================================================
FILE: src/server/db/models/post.ts
================================================
import mongoose from 'mongoose';
const PostSchema = new mongoose.Schema({
title: {
type: String,
},
image: {
type: String,
},
content: {
type: String,
},
comments: [{ type: String, ref: 'Comment' }],
});
export default mongoose.model('Post', PostSchema);
================================================
FILE: src/server/db/utils/uuid.ts
================================================
// tslint:disable
export default function uuid() {
var i;
var random;
var uuid = '';
for (i = 0; i < 32; i++) {
random = Math.random() * 16 | 0;
if (i === 8 || i === 12 || i === 16 || i === 20) {
uuid += '-';
}
uuid += (i === 12 ? 4 : (i === 16 ? (random & 3 | 8) : random)).toString(16);
}
return uuid;
}
================================================
FILE: src/server/graph/index.ts
================================================
import {
GraphQLObjectType,
GraphQLSchema,
} from 'graphql';
import queries from './queries';
import mutations from './mutations';
const RootQuery: GraphQLObjectType = new GraphQLObjectType({
name: 'Query',
fields: () => queries,
});
const RootMutation: GraphQLObjectType = new GraphQLObjectType({
name: 'Mutation',
fields: () => mutations,
});
export default new GraphQLSchema({
query: RootQuery,
mutation: RootMutation,
});
================================================
FILE: src/server/graph/mutations/index.ts
================================================
export default {
};
================================================
FILE: src/server/graph/queries/index.ts
================================================
export default {
};
================================================
FILE: src/server/graph/schema.json
================================================
{
"data": {
"__schema": {
"queryType": {
"name": "Query"
},
"mutationType": null,
"subscriptionType": null,
"types": [
{
"kind": "OBJECT",
"name": "Query",
"description": null,
"fields": [
{
"name": "posts",
"description": null,
"args": [],
"type": {
"kind": "LIST",
"name": null,
"ofType": {
"kind": "OBJECT",
"name": "Post",
"ofType": null
}
},
"isDeprecated": false,
"deprecationReason": null
}
],
"inputFields": null,
"interfaces": [],
"enumValues": null,
"possibleTypes": null
},
{
"kind": "OBJECT",
"name": "Post",
"description": null,
"fields": [
{
"name": "id",
"description": null,
"args": [],
"type": {
"kind": "SCALAR",
"name": "String",
"ofType": null
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "title",
"description": null,
"args": [],
"type": {
"kind": "SCALAR",
"name": "String",
"ofType": null
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "snippet",
"description": null,
"args": [],
"type": {
"kind": "SCALAR",
"name": "String",
"ofType": null
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "recommendations",
"description": null,
"args": [],
"type": {
"kind": "LIST",
"name": null,
"ofType": {
"kind": "OBJECT",
"name": "Recommendation",
"ofType": null
}
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "tags",
"description": null,
"args": [],
"type": {
"kind": "LIST",
"name": null,
"ofType": {
"kind": "OBJECT",
"name": "Tag",
"ofType": null
}
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "uniqueSlug",
"description": null,
"args": [],
"type": {
"kind": "SCALAR",
"name": "String",
"ofType": null
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "image",
"description": null,
"args": [],
"type": {
"kind": "SCALAR",
"name": "String",
"ofType": null
},
"isDeprecated": false,
"deprecationReason": null
}
],
"inputFields": null,
"interfaces": [],
"enumValues": null,
"possibleTypes": null
},
{
"kind": "SCALAR",
"name": "String",
"description": "The `String` scalar type represents textual data, represented as UTF-8 character sequences. The String type is most often used by GraphQL to represent free-form human-readable text.",
"fields": null,
"inputFields": null,
"interfaces": null,
"enumValues": null,
"possibleTypes": null
},
{
"kind": "OBJECT",
"name": "Recommendation",
"description": null,
"fields": [
{
"name": "name",
"description": null,
"args": [],
"type": {
"kind": "SCALAR",
"name": "String",
"ofType": null
},
"isDeprecated": false,
"deprecationReason": null
}
],
"inputFields": null,
"interfaces": [],
"enumValues": null,
"possibleTypes": null
},
{
"kind": "OBJECT",
"name": "Tag",
"description": null,
"fields": [
{
"name": "slug",
"description": null,
"args": [],
"type": {
"kind": "SCALAR",
"name": "String",
"ofType": null
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "name",
"description": null,
"args": [],
"type": {
"kind": "SCALAR",
"name": "String",
"ofType": null
},
"isDeprecated": false,
"deprecationReason": null
}
],
"inputFields": null,
"interfaces": [],
"enumValues": null,
"possibleTypes": null
},
{
"kind": "OBJECT",
"name": "__Schema",
"description": "A GraphQL Schema defines the capabilities of a GraphQL server. It exposes all available types and directives on the server, as well as the entry points for query, mutation, and subscription operations.",
"fields": [
{
"name": "types",
"description": "A list of all types supported by this server.",
"args": [],
"type": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "LIST",
"name": null,
"ofType": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "OBJECT",
"name": "__Type",
"ofType": null
}
}
}
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "queryType",
"description": "The type that query operations will be rooted at.",
"args": [],
"type": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "OBJECT",
"name": "__Type",
"ofType": null
}
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "mutationType",
"description": "If this server supports mutation, the type that mutation operations will be rooted at.",
"args": [],
"type": {
"kind": "OBJECT",
"name": "__Type",
"ofType": null
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "subscriptionType",
"description": "If this server support subscription, the type that subscription operations will be rooted at.",
"args": [],
"type": {
"kind": "OBJECT",
"name": "__Type",
"ofType": null
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "directives",
"description": "A list of all directives supported by this server.",
"args": [],
"type": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "LIST",
"name": null,
"ofType": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "OBJECT",
"name": "__Directive",
"ofType": null
}
}
}
},
"isDeprecated": false,
"deprecationReason": null
}
],
"inputFields": null,
"interfaces": [],
"enumValues": null,
"possibleTypes": null
},
{
"kind": "OBJECT",
"name": "__Type",
"description": "The fundamental unit of any GraphQL Schema is the type. There are many kinds of types in GraphQL as represented by the `__TypeKind` enum.\n\nDepending on the kind of a type, certain fields describe information about that type. Scalar types provide no information beyond a name and description, while Enum types provide their values. Object and Interface types provide the fields they describe. Abstract types, Union and Interface, provide the Object types possible at runtime. List and NonNull types compose other types.",
"fields": [
{
"name": "kind",
"description": null,
"args": [],
"type": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "ENUM",
"name": "__TypeKind",
"ofType": null
}
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "name",
"description": null,
"args": [],
"type": {
"kind": "SCALAR",
"name": "String",
"ofType": null
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "description",
"description": null,
"args": [],
"type": {
"kind": "SCALAR",
"name": "String",
"ofType": null
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "fields",
"description": null,
"args": [
{
"name": "includeDeprecated",
"description": null,
"type": {
"kind": "SCALAR",
"name": "Boolean",
"ofType": null
},
"defaultValue": "false"
}
],
"type": {
"kind": "LIST",
"name": null,
"ofType": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "OBJECT",
"name": "__Field",
"ofType": null
}
}
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "interfaces",
"description": null,
"args": [],
"type": {
"kind": "LIST",
"name": null,
"ofType": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "OBJECT",
"name": "__Type",
"ofType": null
}
}
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "possibleTypes",
"description": null,
"args": [],
"type": {
"kind": "LIST",
"name": null,
"ofType": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "OBJECT",
"name": "__Type",
"ofType": null
}
}
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "enumValues",
"description": null,
"args": [
{
"name": "includeDeprecated",
"description": null,
"type": {
"kind": "SCALAR",
"name": "Boolean",
"ofType": null
},
"defaultValue": "false"
}
],
"type": {
"kind": "LIST",
"name": null,
"ofType": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "OBJECT",
"name": "__EnumValue",
"ofType": null
}
}
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "inputFields",
"description": null,
"args": [],
"type": {
"kind": "LIST",
"name": null,
"ofType": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "OBJECT",
"name": "__InputValue",
"ofType": null
}
}
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "ofType",
"description": null,
"args": [],
"type": {
"kind": "OBJECT",
"name": "__Type",
"ofType": null
},
"isDeprecated": false,
"deprecationReason": null
}
],
"inputFields": null,
"interfaces": [],
"enumValues": null,
"possibleTypes": null
},
{
"kind": "ENUM",
"name": "__TypeKind",
"description": "An enum describing what kind of type a given `__Type` is.",
"fields": null,
"inputFields": null,
"interfaces": null,
"enumValues": [
{
"name": "SCALAR",
"description": "Indicates this type is a scalar.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "OBJECT",
"description": "Indicates this type is an object. `fields` and `interfaces` are valid fields.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "INTERFACE",
"description": "Indicates this type is an interface. `fields` and `possibleTypes` are valid fields.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "UNION",
"description": "Indicates this type is a union. `possibleTypes` is a valid field.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "ENUM",
"description": "Indicates this type is an enum. `enumValues` is a valid field.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "INPUT_OBJECT",
"description": "Indicates this type is an input object. `inputFields` is a valid field.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "LIST",
"description": "Indicates this type is a list. `ofType` is a valid field.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "NON_NULL",
"description": "Indicates this type is a non-null. `ofType` is a valid field.",
"isDeprecated": false,
"deprecationReason": null
}
],
"possibleTypes": null
},
{
"kind": "SCALAR",
"name": "Boolean",
"description": "The `Boolean` scalar type represents `true` or `false`.",
"fields": null,
"inputFields": null,
"interfaces": null,
"enumValues": null,
"possibleTypes": null
},
{
"kind": "OBJECT",
"name": "__Field",
"description": "Object and Interface types are described by a list of Fields, each of which has a name, potentially a list of arguments, and a return type.",
"fields": [
{
"name": "name",
"description": null,
"args": [],
"type": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "SCALAR",
"name": "String",
"ofType": null
}
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "description",
"description": null,
"args": [],
"type": {
"kind": "SCALAR",
"name": "String",
"ofType": null
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "args",
"description": null,
"args": [],
"type": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "LIST",
"name": null,
"ofType": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "OBJECT",
"name": "__InputValue",
"ofType": null
}
}
}
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "type",
"description": null,
"args": [],
"type": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "OBJECT",
"name": "__Type",
"ofType": null
}
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "isDeprecated",
"description": null,
"args": [],
"type": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "SCALAR",
"name": "Boolean",
"ofType": null
}
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "deprecationReason",
"description": null,
"args": [],
"type": {
"kind": "SCALAR",
"name": "String",
"ofType": null
},
"isDeprecated": false,
"deprecationReason": null
}
],
"inputFields": null,
"interfaces": [],
"enumValues": null,
"possibleTypes": null
},
{
"kind": "OBJECT",
"name": "__InputValue",
"description": "Arguments provided to Fields or Directives and the input fields of an InputObject are represented as Input Values which describe their type and optionally a default value.",
"fields": [
{
"name": "name",
"description": null,
"args": [],
"type": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "SCALAR",
"name": "String",
"ofType": null
}
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "description",
"description": null,
"args": [],
"type": {
"kind": "SCALAR",
"name": "String",
"ofType": null
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "type",
"description": null,
"args": [],
"type": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "OBJECT",
"name": "__Type",
"ofType": null
}
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "defaultValue",
"description": "A GraphQL-formatted string representing the default value for this input value.",
"args": [],
"type": {
"kind": "SCALAR",
"name": "String",
"ofType": null
},
"isDeprecated": false,
"deprecationReason": null
}
],
"inputFields": null,
"interfaces": [],
"enumValues": null,
"possibleTypes": null
},
{
"kind": "OBJECT",
"name": "__EnumValue",
"description": "One possible value for a given Enum. Enum values are unique values, not a placeholder for a string or numeric value. However an Enum value is returned in a JSON response as a string.",
"fields": [
{
"name": "name",
"description": null,
"args": [],
"type": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "SCALAR",
"name": "String",
"ofType": null
}
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "description",
"description": null,
"args": [],
"type": {
"kind": "SCALAR",
"name": "String",
"ofType": null
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "isDeprecated",
"description": null,
"args": [],
"type": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "SCALAR",
"name": "Boolean",
"ofType": null
}
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "deprecationReason",
"description": null,
"args": [],
"type": {
"kind": "SCALAR",
"name": "String",
"ofType": null
},
"isDeprecated": false,
"deprecationReason": null
}
],
"inputFields": null,
"interfaces": [],
"enumValues": null,
"possibleTypes": null
},
{
"kind": "OBJECT",
"name": "__Directive",
"description": "A Directive provides a way to describe alternate runtime execution and type validation behavior in a GraphQL document.\n\nIn some cases, you need to provide options to alter GraphQL's execution behavior in ways field arguments will not suffice, such as conditionally including or skipping a field. Directives provide this by describing additional information to the executor.",
"fields": [
{
"name": "name",
"description": null,
"args": [],
"type": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "SCALAR",
"name": "String",
"ofType": null
}
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "description",
"description": null,
"args": [],
"type": {
"kind": "SCALAR",
"name": "String",
"ofType": null
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "locations",
"description": null,
"args": [],
"type": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "LIST",
"name": null,
"ofType": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "ENUM",
"name": "__DirectiveLocation",
"ofType": null
}
}
}
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "args",
"description": null,
"args": [],
"type": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "LIST",
"name": null,
"ofType": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "OBJECT",
"name": "__InputValue",
"ofType": null
}
}
}
},
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "onOperation",
"description": null,
"args": [],
"type": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "SCALAR",
"name": "Boolean",
"ofType": null
}
},
"isDeprecated": true,
"deprecationReason": "Use `locations`."
},
{
"name": "onFragment",
"description": null,
"args": [],
"type": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "SCALAR",
"name": "Boolean",
"ofType": null
}
},
"isDeprecated": true,
"deprecationReason": "Use `locations`."
},
{
"name": "onField",
"description": null,
"args": [],
"type": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "SCALAR",
"name": "Boolean",
"ofType": null
}
},
"isDeprecated": true,
"deprecationReason": "Use `locations`."
}
],
"inputFields": null,
"interfaces": [],
"enumValues": null,
"possibleTypes": null
},
{
"kind": "ENUM",
"name": "__DirectiveLocation",
"description": "A Directive can be adjacent to many parts of the GraphQL language, a __DirectiveLocation describes one such possible adjacencies.",
"fields": null,
"inputFields": null,
"interfaces": null,
"enumValues": [
{
"name": "QUERY",
"description": "Location adjacent to a query operation.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "MUTATION",
"description": "Location adjacent to a mutation operation.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "SUBSCRIPTION",
"description": "Location adjacent to a subscription operation.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "FIELD",
"description": "Location adjacent to a field.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "FRAGMENT_DEFINITION",
"description": "Location adjacent to a fragment definition.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "FRAGMENT_SPREAD",
"description": "Location adjacent to a fragment spread.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "INLINE_FRAGMENT",
"description": "Location adjacent to an inline fragment.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "SCHEMA",
"description": "Location adjacent to a schema definition.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "SCALAR",
"description": "Location adjacent to a scalar definition.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "OBJECT",
"description": "Location adjacent to an object type definition.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "FIELD_DEFINITION",
"description": "Location adjacent to a field definition.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "ARGUMENT_DEFINITION",
"description": "Location adjacent to an argument definition.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "INTERFACE",
"description": "Location adjacent to an interface definition.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "UNION",
"description": "Location adjacent to a union definition.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "ENUM",
"description": "Location adjacent to an enum definition.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "ENUM_VALUE",
"description": "Location adjacent to an enum value definition.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "INPUT_OBJECT",
"description": "Location adjacent to an input object type definition.",
"isDeprecated": false,
"deprecationReason": null
},
{
"name": "INPUT_FIELD_DEFINITION",
"description": "Location adjacent to an input object field definition.",
"isDeprecated": false,
"deprecationReason": null
}
],
"possibleTypes": null
}
],
"directives": [
{
"name": "include",
"description": "Directs the executor to include this field or fragment only when the `if` argument is true.",
"locations": [
"FIELD",
"FRAGMENT_SPREAD",
"INLINE_FRAGMENT"
],
"args": [
{
"name": "if",
"description": "Included when true.",
"type": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "SCALAR",
"name": "Boolean",
"ofType": null
}
},
"defaultValue": null
}
]
},
{
"name": "skip",
"description": "Directs the executor to skip this field or fragment when the `if` argument is true.",
"locations": [
"FIELD",
"FRAGMENT_SPREAD",
"INLINE_FRAGMENT"
],
"args": [
{
"name": "if",
"description": "Skipped when true.",
"type": {
"kind": "NON_NULL",
"name": null,
"ofType": {
"kind": "SCALAR",
"name": "Boolean",
"ofType": null
}
},
"defaultValue": null
}
]
},
{
"name": "deprecated",
"description": "Marks an element of a GraphQL schema as no longer supported.",
"locations": [
"FIELD_DEFINITION",
"ENUM_VALUE"
],
"args": [
{
"name": "reason",
"description": "Explains why this element was deprecated, usually also including a suggestion for how to access supported similar data. Formatted in [Markdown](https://daringfireball.net/projects/markdown/).",
"type": {
"kind": "SCALAR",
"name": "String",
"ofType": null
},
"defaultValue": "\"No longer supported\""
}
]
}
]
}
}
}
================================================
FILE: src/server/graph/types/index.ts
================================================
export default {
};
================================================
FILE: src/server/graphqlEntry.ts
================================================
import 'babel-polyfill';
import path from 'path';
import fs from 'fs';
import * as express from 'express';
import { graphql } from 'graphql';
import { introspectionQuery } from 'graphql/utilities';
import bodyParser from 'body-parser';
import cors from 'cors';
import { graphiqlExpress, graphqlExpress } from 'graphql-server-express';
import schema from './graph';
function createSchema() {
return new Promise
{children}
);
case 'h3':
return (
{children}
);
case 'h4':
return (
{children}
);
case 'h5':
return (
{children}
);
default:
return (
{children}
);
}
}
}
export default Heading;
================================================
FILE: packages/openui/src/Heading/styleUtils.ts
================================================
import { Tag } from './index';
import remStringFromPX from '../utils';
const sizeMap = {
h1: 36,
h2: 30,
h3: 24,
h4: 18,
h5: 16,
};
export const calculateSize = (tag: Tag): string => remStringFromPX(sizeMap[tag]);
================================================
FILE: packages/openui/src/Heading/styles.ts
================================================
import styled, { css } from 'styled-components';
import { marginCss } from '../Paragraph/styles';
import { calculateSize } from './styleUtils';
import { Props } from './types';
const truncateCss = (truncate: boolean) => {
if (truncate) {
return css`
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
`;
}
return '';
};
const textTransformCss = (upcase: boolean) => {
if (upcase) {
return css`
text-transform: uppercase;
`;
}
return '';
};
const HeadingStyles = css`
font-size: ${(props: Props) => calculateSize(props.tag)};
text-align: ${(props: Props) => props.textAlign};
color: ${(props: Props) => props.color};
${(props: Props) => truncateCss(props.truncate)};
${(props: Props) => textTransformCss(props.upcase)};
${(props: Props) => marginCss(props.margin)};
`;
export const H1 = styled.h1`
${HeadingStyles}
`;
export const H2 = styled.h2`
${HeadingStyles}
`;
export const H3 = styled.h3`
${HeadingStyles}
`;
export const H4 = styled.h4`
${HeadingStyles}
`;
export const H5 = styled.h5`
${HeadingStyles}
`;
================================================
FILE: packages/openui/src/Heading/types.ts
================================================
export { Props, Tag } from './index';
================================================
FILE: packages/openui/src/Headline/__tests__/__mocks__/headlineProps.mock.ts
================================================
export default {
color: '#fff',
};
================================================
FILE: packages/openui/src/Headline/__tests__/__snapshots__/index.test.tsx.snap
================================================
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`
`;
exports[`
`;
exports[`
`;
exports[`
`;
exports[`
`;
exports[`
`;
exports[`
`;
exports[`
`;
exports[`
`;
================================================
FILE: packages/openui/src/Image/__tests__/index.test.tsx
================================================
import { shallow } from 'enzyme';
import { shallowToJson } from 'enzyme-to-json';
import * as React from 'react';
import Image from '../';
import * as Props from './__mocks__/imageMocks.mock';
describe('