use fragments for categories, add optional fragment prop to nova forms

This commit is contained in:
xavcz 2016-11-11 17:36:32 +01:00
parent 51c605942a
commit c2117a6fcc
9 changed files with 50 additions and 18 deletions

View file

@ -35,7 +35,8 @@ class CategoriesEditForm extends Component{
document={this.props.category}
collection={Categories}
mutationName="categoriesEdit"
resultQuery={Categories.graphQLQueries.single}
// resultQuery={Categories.graphQLQueries.single}
fragment={Categories.fragments.full}
successCallback={(category)=>{
this.context.closeCallback();
this.props.flash("Category edited.", "success");

View file

@ -13,7 +13,8 @@ const CategoriesNewForm = (props, context) => {
<NovaForm
collection={Categories}
mutationName="categoriesNew"
resultQuery={Categories.graphQLQueries.single}
// resultQuery={Categories.graphQLQueries.single}
fragment={Categories.fragments.full}
updateQueries={{
getCategoriesList: (prev, {mutationResult}) => {
const newCategory = mutationResult.data.categoriesNew;
@ -22,6 +23,7 @@ const CategoriesNewForm = (props, context) => {
$push: [newCategory]
}
});
// note: 'newCategoriesList' is extended with the category but somehow when the query updates it e
return newCategoriesList;
},
}}

View file

@ -1,4 +1,4 @@
import './containers.js';
import './fragments.js';
import withApp from './containers/withApp.js';
import withPostsList from './containers/withPostsList.js';

View file

@ -1,11 +0,0 @@
import Telescope from 'meteor/nova:lib';
// containers
Telescope.registerComponent("AppContainer", require('./containers/AppContainer.jsx'));
Telescope.registerComponent("PostsListContainer", require('./containers/PostsListContainer.jsx'));
Telescope.registerComponent("CategoriesListContainer", require('./containers/CategoriesListContainer.jsx'));
Telescope.registerComponent("PostsSingleContainer", require('./containers/PostsSingleContainer.jsx'));
Telescope.registerComponent("CommentsListContainer", require('./containers/CommentsListContainer.jsx'));
Telescope.registerComponent("UsersSingleContainer", require('./containers/UsersSingleContainer.jsx'));
Telescope.registerComponent("VoteContainer", require('./containers/VoteContainer.jsx'));

View file

@ -8,13 +8,17 @@ export default function withCategoriesList(component, options) {
return graphql(gql`
query getCategoriesList {
categories {
${Categories.graphQLQueries.single}
...fullCategoryInfo
parent {
...fullCategoryInfo
}
}
}
`, {
options(ownProps) {
return {
variables: {},
fragments: Categories.fragments.full,
// pollInterval: 20000,
};
},

View file

@ -0,0 +1,2 @@
import './fragments/users.js';
import './fragments/categories.js';

View file

@ -0,0 +1,32 @@
import { createFragment } from 'apollo-client';
import gql from 'graphql-tag';
import Categories from 'meteor/nova:categories';
Categories.fragments = {
full: createFragment(gql`
fragment fullCategoryInfo on Category {
_id
name
description
order
slug
image
parent {
# feels weird to repeat the same fields... but we cannot call the fragment on itself?!
_id
name
description
order
slug
image
}
}
`),
essential: createFragment(gql`
fragment essentialCategoryInfo on Category {
_id
name
slug
}
`),
};

View file

@ -1,4 +1,4 @@
import './containers.js';
import './fragments.js';
import withApp from './containers/withApp.js';
import withPostsList from './containers/withPostsList.js';

View file

@ -31,10 +31,11 @@ const FormWithMutation = props => {
ComponentWithMutation = graphql(gql`
mutation ${props.mutationName}($documentId: String, $set: ${collectionName}Input, $unset: ${collectionName}Unset) {
${props.mutationName}(documentId: $documentId, set: $set, unset: $unset) {
${props.resultQuery}
${props.fragment ? `...${props.fragment[0].name.value}` : props.resultQuery}
}
}
`, {
options: (props) => props.fragment ? {fragments: props.fragment} : {},
props: ({ownProps, mutate}) => ({
mutation: ({documentId, set, unset}) => {
return mutate({
@ -50,10 +51,11 @@ const FormWithMutation = props => {
ComponentWithMutation = graphql(gql`
mutation ${props.mutationName}($document: ${collectionName}Input) {
${props.mutationName}(document: $document) {
${props.resultQuery}
${props.fragment ? `...${props.fragment[0].name.value}` : props.resultQuery}
}
}
`, {
options: (props) => props.fragment ? {fragments: props.fragment} : {},
props: ({ownProps, mutate}) => ({
mutation: ({document}) => {
return mutate({