diff --git a/app/components/multiple-uploader.js b/app/components/multiple-uploader.js
index 8426046..19ab921 100644
--- a/app/components/multiple-uploader.js
+++ b/app/components/multiple-uploader.js
@@ -1,26 +1,28 @@
-import {graphql, gql} from 'react-apollo'
+import { graphql, gql } from 'react-apollo'
import uploadsQuery from '../queries/uploads'
-const MultipleUploader = ({mutate}) => {
- const handleChange = ({target}) => {
+const MultipleUploader = ({ mutate }) => {
+ const handleChange = ({ target }) => {
if (target.validity.valid) {
mutate({
variables: {
files: target.files
},
- refetchQueries: [{
- query: uploadsQuery
- }]
+ refetchQueries: [
+ {
+ query: uploadsQuery
+ }
+ ]
})
}
}
- return
+ return
}
export default graphql(gql`
- mutation multipleUpload ($files: [Upload!]!) {
- multipleUpload (files: $files) {
+ mutation multipleUpload($files: [Upload!]!) {
+ multipleUpload(files: $files) {
id
name
type
diff --git a/app/components/section.js b/app/components/section.js
index 7fc4e1c..9d61dcb 100644
--- a/app/components/section.js
+++ b/app/components/section.js
@@ -1,6 +1,8 @@
-export default ({heading, children}) => (
+const Section = ({ heading, children }) =>
- {heading}
+
+ {heading}
+
{children}
-)
+
+export default Section
diff --git a/app/components/single-uploader.js b/app/components/single-uploader.js
index 1c52628..8194571 100644
--- a/app/components/single-uploader.js
+++ b/app/components/single-uploader.js
@@ -1,26 +1,28 @@
-import {graphql, gql} from 'react-apollo'
+import { graphql, gql } from 'react-apollo'
import uploadsQuery from '../queries/uploads'
-const SingleUploader = ({mutate}) => {
- const handleChange = ({target}) => {
+const SingleUploader = ({ mutate }) => {
+ const handleChange = ({ target }) => {
if (target.validity.valid) {
mutate({
variables: {
file: target.files[0]
},
- refetchQueries: [{
- query: uploadsQuery
- }]
+ refetchQueries: [
+ {
+ query: uploadsQuery
+ }
+ ]
})
}
}
- return
+ return
}
export default graphql(gql`
- mutation singleUpload ($file: Upload!) {
- singleUpload (file: $file) {
+ mutation singleUpload($file: Upload!) {
+ singleUpload(file: $file) {
id
name
type
diff --git a/app/components/upload-list.js b/app/components/upload-list.js
index ac9aba2..a13b5ff 100644
--- a/app/components/upload-list.js
+++ b/app/components/upload-list.js
@@ -1,7 +1,7 @@
-import {graphql} from 'react-apollo'
+import { graphql } from 'react-apollo'
import uploadsQuery from '../queries/uploads'
-const UploadList = ({data: {uploads}}) => {
+const UploadList = ({ data: { uploads } }) => {
return (
@@ -14,14 +14,22 @@ const UploadList = ({data: {uploads}}) => {
- {uploads.map(({id, name, type, size, path}) => (
+ {uploads.map(({ id, name, type, size, path }) =>
- | {name} |
- {type} |
- {size} |
- {path} |
+
+ {name}
+ |
+
+ {type}
+ |
+
+ {size}
+ |
+
+ {path}
+ |
- ))}
+ )}
+ html {
+ font-family: sans-serif;
+ }
+ body {
+ margin: 2em;
+ }
+ `}
Apollo upload examples
-
+
Select an file to upload and view the response in the console.
-
- Select multiple files to upload and view the response in the console.
+
+
+ Select multiple files to upload and view the response in the console.
+
-
-))
+
+export default withData(HomePage)
diff --git a/app/queries/uploads.js b/app/queries/uploads.js
index 7f26067..b6f675d 100644
--- a/app/queries/uploads.js
+++ b/app/queries/uploads.js
@@ -1,4 +1,4 @@
-import {gql} from 'react-apollo'
+import { gql } from 'react-apollo'
export default gql`
query uploads {