diff --git a/demo/App.tsx b/demo/App.tsx index df277fa..54a72ea 100644 --- a/demo/App.tsx +++ b/demo/App.tsx @@ -4,7 +4,6 @@ import { createStyles, Theme, WithStyles, withStyles } from '@material-ui/core/s import { AppBar, Toolbar, Typography, IconButton, Badge } from '@material-ui/core'; import ShoppingCart from '@material-ui/icons/ShoppingCart'; import { MyBasketDataProvider } from './MyBasketDataProvider'; -import { PusherBasketDataProvider } from './PusherBasketDataProvider'; import { Products } from './Products'; export interface AppProps extends WithStyles { } @@ -14,7 +13,7 @@ class App extends React.Component { const { classes } = this.props; return ( - +
diff --git a/demo/MyBasketDataProvider.ts b/demo/MyBasketDataProvider.ts index e240c9f..a7ce137 100644 --- a/demo/MyBasketDataProvider.ts +++ b/demo/MyBasketDataProvider.ts @@ -1,6 +1,15 @@ import { DataProvider, BasketItem } from "../src"; export class MyBasketDataProvider implements DataProvider { + + registerToChanges(callback: (items: BasketItem[]) => void) { + } + + products = [ + { id: "1", name: 'Computer', price: 1722.44, quantity: 1 }, + { id: "2", name: 'Phone', price: 522.14, quantity: 1 } + ]; + items = [ { id: "1", name: 'Computer', price: 1722.44, quantity: 1 }, { id: "2", name: 'Phone', price: 522.14, quantity: 2 } @@ -14,8 +23,34 @@ export class MyBasketDataProvider implements DataProvider { }); } + onAllItemsDeleted(): Promise { + return new Promise((resolve, reject) => { + setTimeout(() => { + this.items = []; + + resolve(this.items) + }, 1000) + }); + } + onItemAdded(id: string): Promise { - throw new Error("Method not implemented."); + return new Promise((resolve, reject) => { + setTimeout(() => { + let index = this.items.findIndex(item => item.id === id); + if (index > -1) { + this.items[index].quantity++; + } + else { + const index = this.products.findIndex(item => item.id === id); + if (index > -1) { + const item = {...this.products[index]}; + this.items.push(item); + } + } + + resolve(this.items) + }, 1000) + }); } onItemDeleted = (id: string): Promise => { @@ -30,9 +65,5 @@ export class MyBasketDataProvider implements DataProvider { resolve(this.items) }, 1000) }); - - - - } } \ No newline at end of file diff --git a/demo/Products.tsx b/demo/Products.tsx index e838fba..6b51d31 100644 --- a/demo/Products.tsx +++ b/demo/Products.tsx @@ -1,37 +1,21 @@ import * as React from 'react'; import { CircularProgress, Card, CardContent, CardHeader, CardActions, Button, Typography } from '@material-ui/core'; -import Axios from 'axios'; import { BasketItem, withBasketData, BasketData } from '../src'; -class ProductsInner extends React.Component<{basketData: BasketData}, any> { +class ProductsInner extends React.Component<{ basketData: BasketData }, any> { constructor(props: any) { super(props); this.state = { isLoading: false, - items: [] + items: [ + { id: "1", name: 'Computer', price: 1722.44, quantity: 1 }, + { id: "2", name: 'Phone', price: 522.14, quantity: 2 } + ] } } - componentDidMount() { - this.setState({ isLoading: true }, () => { - Axios.get("http://localhost:8080/products") - .then(response => { - this.setState({ - items: response.data, - isLoading: false - }) - }) - .catch(reason => { - this.setState({ - error: reason, - isLoading: false - }); - }); - }) - } - public render() { if (this.state.isLoading) { return ( @@ -50,9 +34,9 @@ class ProductsInner extends React.Component<{basketData: BasketData}, any> { } return ( -
+
{this.state.items.map(item => ( - + {item.name} @@ -61,8 +45,8 @@ class ProductsInner extends React.Component<{basketData: BasketData}, any> { Price ${item.price} - - - + ))}
) diff --git a/demo/PusherBasketDataProvider.ts b/demo/PusherBasketDataProvider.ts deleted file mode 100644 index 4cc2fff..0000000 --- a/demo/PusherBasketDataProvider.ts +++ /dev/null @@ -1,100 +0,0 @@ -import { DataProvider, BasketItem } from "../src"; -import axios from 'axios'; -import Pusher from 'pusher-js'; - -export class PusherBasketDataProvider implements DataProvider { - pusher: Pusher; - channel: any; - callbacks: ((items: BasketItem[]) => void)[] = []; - - constructor() { - this.pusher = new Pusher("5084eb82130619c14d4e", { - cluster: 'eu', - forceTLS: true - }); - this.channel = this.pusher.subscribe("my-channel"); - - this.channel.bind('itemAdded', this.basketChanged); - this.channel.bind('itemUpdated', this.basketChanged); - this.channel.bind('itemRemoved', this.basketChanged); - this.channel.bind('cartEmptied', this.basketChanged); - } - - registerToChanges(callback: (items: BasketItem[]) => void) { - this.callbacks.push(callback); - } - - basketChanged = (items: BasketItem[]) => { - this.callbacks.forEach(callback => callback(items)); - } - - - getInitialData = (): Promise => { - return new Promise((resolve, reject) => { - axios.get("http://localhost:8080/cart/items", { - headers: { - 'Access-Control-Allow-Origin': '*', - 'Content-Type': 'application/json', - }, - }) - .then(response => { - resolve(response.data); - }) - .catch(reason => { - reject(reason); - }) - }); - } - - onAllItemsDeleted = (): Promise => { - return new Promise((resolve, reject) => { - axios.delete("http://localhost:8080/cart", { - headers: { - 'Access-Control-Allow-Origin': '*', - 'Content-Type': 'application/json', - }, - }) - .then(response => { - resolve(response.data); - }) - .catch(reason => { - reject(reason); - }) - }); - } - - onItemAdded = (id: string): Promise => { - return new Promise((resolve, reject) => { - axios.post("http://localhost:8080/cart/item", { id }, { - headers: { - 'Access-Control-Allow-Origin': '*', - 'Content-Type': 'application/json', - }, - }) - .then(response => { - resolve(response.data); - }) - .catch(reason => { - reject(reason); - }) - }); - } - - onItemDeleted = (id: string): Promise => { - return new Promise((resolve, reject) => { - axios.delete("http://localhost:8080/cart/item", { - data: { id }, - headers: { - 'Access-Control-Allow-Origin': '*', - 'Content-Type': 'application/json', - }, - }) - .then(response => { - resolve(response.data); - }) - .catch(reason => { - reject(reason); - }) - }); - } -} \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index 63164a6..bdf28a1 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "react-basket", - "version": "0.1.3", + "version": "0.1.4", "lockfileVersion": 1, "requires": true, "dependencies": { @@ -897,15 +897,6 @@ } } }, - "axios": { - "version": "0.18.0", - "resolved": "https://registry.npmjs.org/axios/-/axios-0.18.0.tgz", - "integrity": "sha1-MtU+SFHv3AoRmTts0AB4nXDAUQI=", - "requires": { - "follow-redirects": "^1.3.0", - "is-buffer": "^1.1.5" - } - }, "babel-code-frame": { "version": "6.26.0", "resolved": "https://registry.npmjs.org/babel-code-frame/-/babel-code-frame-6.26.0.tgz", @@ -3009,6 +3000,7 @@ "version": "1.7.0", "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.7.0.tgz", "integrity": "sha512-m/pZQy4Gj287eNy94nivy5wchN3Kp+Q5WgUPNy5lJSZ3sgkVKSYV/ZChMAQVIgx1SqfZ2zBZtPA2YlXIWxxJOQ==", + "dev": true, "requires": { "debug": "^3.2.6" }, @@ -3017,6 +3009,7 @@ "version": "3.2.6", "resolved": "https://registry.npmjs.org/debug/-/debug-3.2.6.tgz", "integrity": "sha512-mel+jf7nrtEl5Pn1Qx46zARXKDpBbvzezse7p7LqINmdoIk8PYP5SySaxEmYv6TZ0JyEKA1hsCId6DIhgITtWQ==", + "dev": true, "requires": { "ms": "^2.1.1" } @@ -3024,7 +3017,8 @@ "ms": { "version": "2.1.1", "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.1.tgz", - "integrity": "sha512-tgp+dl5cGk28utYktBsrFqA7HKgrhgPsg6Z/EfhWI4gl1Hwq8B/GmY/0oXZ6nF8hDVesS/FpnYaD/kOWhYQvyg==" + "integrity": "sha512-tgp+dl5cGk28utYktBsrFqA7HKgrhgPsg6Z/EfhWI4gl1Hwq8B/GmY/0oXZ6nF8hDVesS/FpnYaD/kOWhYQvyg==", + "dev": true } } }, @@ -3117,23 +3111,21 @@ "dev": true, "optional": true, "requires": { - "delegates": "1.0.0", - "readable-stream": "2.3.6" + "delegates": "^1.0.0", + "readable-stream": "^2.0.6" } }, "balanced-match": { "version": "1.0.0", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "brace-expansion": { "version": "1.1.11", "bundled": true, "dev": true, - "optional": true, "requires": { - "balanced-match": "1.0.0", + "balanced-match": "^1.0.0", "concat-map": "0.0.1" } }, @@ -3146,20 +3138,17 @@ "code-point-at": { "version": "1.1.0", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "concat-map": { "version": "0.0.1", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "console-control-strings": { "version": "1.1.0", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "core-util-is": { "version": "1.0.2", @@ -3200,7 +3189,7 @@ "dev": true, "optional": true, "requires": { - "minipass": "2.3.5" + "minipass": "^2.2.1" } }, "fs.realpath": { @@ -3215,14 +3204,14 @@ "dev": true, "optional": true, "requires": { - "aproba": "1.2.0", - "console-control-strings": "1.1.0", - "has-unicode": "2.0.1", - "object-assign": "4.1.1", - "signal-exit": "3.0.2", - "string-width": "1.0.2", - "strip-ansi": "3.0.1", - "wide-align": "1.1.3" + "aproba": "^1.0.3", + "console-control-strings": "^1.0.0", + "has-unicode": "^2.0.0", + "object-assign": "^4.1.0", + "signal-exit": "^3.0.0", + "string-width": "^1.0.1", + "strip-ansi": "^3.0.1", + "wide-align": "^1.1.0" } }, "glob": { @@ -3231,12 +3220,12 @@ "dev": true, "optional": true, "requires": { - "fs.realpath": "1.0.0", - "inflight": "1.0.6", - "inherits": "2.0.3", - "minimatch": "3.0.4", - "once": "1.4.0", - "path-is-absolute": "1.0.1" + "fs.realpath": "^1.0.0", + "inflight": "^1.0.4", + "inherits": "2", + "minimatch": "^3.0.4", + "once": "^1.3.0", + "path-is-absolute": "^1.0.0" } }, "has-unicode": { @@ -3251,7 +3240,7 @@ "dev": true, "optional": true, "requires": { - "safer-buffer": "2.1.2" + "safer-buffer": ">= 2.1.2 < 3" } }, "ignore-walk": { @@ -3260,7 +3249,7 @@ "dev": true, "optional": true, "requires": { - "minimatch": "3.0.4" + "minimatch": "^3.0.4" } }, "inflight": { @@ -3269,15 +3258,14 @@ "dev": true, "optional": true, "requires": { - "once": "1.4.0", - "wrappy": "1.0.2" + "once": "^1.3.0", + "wrappy": "1" } }, "inherits": { "version": "2.0.3", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "ini": { "version": "1.3.5", @@ -3289,9 +3277,8 @@ "version": "1.0.0", "bundled": true, "dev": true, - "optional": true, "requires": { - "number-is-nan": "1.0.1" + "number-is-nan": "^1.0.0" } }, "isarray": { @@ -3304,25 +3291,22 @@ "version": "3.0.4", "bundled": true, "dev": true, - "optional": true, "requires": { - "brace-expansion": "1.1.11" + "brace-expansion": "^1.1.7" } }, "minimist": { "version": "0.0.8", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "minipass": { "version": "2.3.5", "bundled": true, "dev": true, - "optional": true, "requires": { - "safe-buffer": "5.1.2", - "yallist": "3.0.3" + "safe-buffer": "^5.1.2", + "yallist": "^3.0.0" } }, "minizlib": { @@ -3331,14 +3315,13 @@ "dev": true, "optional": true, "requires": { - "minipass": "2.3.5" + "minipass": "^2.2.1" } }, "mkdirp": { "version": "0.5.1", "bundled": true, "dev": true, - "optional": true, "requires": { "minimist": "0.0.8" } @@ -3355,9 +3338,9 @@ "dev": true, "optional": true, "requires": { - "debug": "2.6.9", - "iconv-lite": "0.4.24", - "sax": "1.2.4" + "debug": "^2.1.2", + "iconv-lite": "^0.4.4", + "sax": "^1.2.4" } }, "node-pre-gyp": { @@ -3366,16 +3349,16 @@ "dev": true, "optional": true, "requires": { - "detect-libc": "1.0.3", - "mkdirp": "0.5.1", - "needle": "2.2.4", - "nopt": "4.0.1", - "npm-packlist": "1.2.0", - "npmlog": "4.1.2", - "rc": "1.2.8", - "rimraf": "2.6.3", - "semver": "5.6.0", - "tar": "4.4.8" + "detect-libc": "^1.0.2", + "mkdirp": "^0.5.1", + "needle": "^2.2.1", + "nopt": "^4.0.1", + "npm-packlist": "^1.1.6", + "npmlog": "^4.0.2", + "rc": "^1.2.7", + "rimraf": "^2.6.1", + "semver": "^5.3.0", + "tar": "^4" } }, "nopt": { @@ -3384,8 +3367,8 @@ "dev": true, "optional": true, "requires": { - "abbrev": "1.1.1", - "osenv": "0.1.5" + "abbrev": "1", + "osenv": "^0.1.4" } }, "npm-bundled": { @@ -3400,8 +3383,8 @@ "dev": true, "optional": true, "requires": { - "ignore-walk": "3.0.1", - "npm-bundled": "1.0.5" + "ignore-walk": "^3.0.1", + "npm-bundled": "^1.0.1" } }, "npmlog": { @@ -3410,17 +3393,16 @@ "dev": true, "optional": true, "requires": { - "are-we-there-yet": "1.1.5", - "console-control-strings": "1.1.0", - "gauge": "2.7.4", - "set-blocking": "2.0.0" + "are-we-there-yet": "~1.1.2", + "console-control-strings": "~1.1.0", + "gauge": "~2.7.3", + "set-blocking": "~2.0.0" } }, "number-is-nan": { "version": "1.0.1", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "object-assign": { "version": "4.1.1", @@ -3432,9 +3414,8 @@ "version": "1.4.0", "bundled": true, "dev": true, - "optional": true, "requires": { - "wrappy": "1.0.2" + "wrappy": "1" } }, "os-homedir": { @@ -3455,8 +3436,8 @@ "dev": true, "optional": true, "requires": { - "os-homedir": "1.0.2", - "os-tmpdir": "1.0.2" + "os-homedir": "^1.0.0", + "os-tmpdir": "^1.0.0" } }, "path-is-absolute": { @@ -3477,10 +3458,10 @@ "dev": true, "optional": true, "requires": { - "deep-extend": "0.6.0", - "ini": "1.3.5", - "minimist": "1.2.0", - "strip-json-comments": "2.0.1" + "deep-extend": "^0.6.0", + "ini": "~1.3.0", + "minimist": "^1.2.0", + "strip-json-comments": "~2.0.1" }, "dependencies": { "minimist": { @@ -3497,13 +3478,13 @@ "dev": true, "optional": true, "requires": { - "core-util-is": "1.0.2", - "inherits": "2.0.3", - "isarray": "1.0.0", - "process-nextick-args": "2.0.0", - "safe-buffer": "5.1.2", - "string_decoder": "1.1.1", - "util-deprecate": "1.0.2" + "core-util-is": "~1.0.0", + "inherits": "~2.0.3", + "isarray": "~1.0.0", + "process-nextick-args": "~2.0.0", + "safe-buffer": "~5.1.1", + "string_decoder": "~1.1.1", + "util-deprecate": "~1.0.1" } }, "rimraf": { @@ -3512,7 +3493,7 @@ "dev": true, "optional": true, "requires": { - "glob": "7.1.3" + "glob": "^7.1.3" } }, "safe-buffer": { @@ -3554,11 +3535,10 @@ "version": "1.0.2", "bundled": true, "dev": true, - "optional": true, "requires": { - "code-point-at": "1.1.0", - "is-fullwidth-code-point": "1.0.0", - "strip-ansi": "3.0.1" + "code-point-at": "^1.0.0", + "is-fullwidth-code-point": "^1.0.0", + "strip-ansi": "^3.0.0" } }, "string_decoder": { @@ -3567,7 +3547,7 @@ "dev": true, "optional": true, "requires": { - "safe-buffer": "5.1.2" + "safe-buffer": "~5.1.0" } }, "strip-ansi": { @@ -3575,7 +3555,7 @@ "bundled": true, "dev": true, "requires": { - "ansi-regex": "2.1.1" + "ansi-regex": "^2.0.0" } }, "strip-json-comments": { @@ -3590,13 +3570,13 @@ "dev": true, "optional": true, "requires": { - "chownr": "1.1.1", - "fs-minipass": "1.2.5", - "minipass": "2.3.5", - "minizlib": "1.2.1", - "mkdirp": "0.5.1", - "safe-buffer": "5.1.2", - "yallist": "3.0.3" + "chownr": "^1.1.1", + "fs-minipass": "^1.2.5", + "minipass": "^2.3.4", + "minizlib": "^1.1.1", + "mkdirp": "^0.5.0", + "safe-buffer": "^5.1.2", + "yallist": "^3.0.2" } }, "util-deprecate": { @@ -3611,7 +3591,7 @@ "dev": true, "optional": true, "requires": { - "string-width": "1.0.2" + "string-width": "^1.0.2 || 2" } }, "wrappy": { @@ -4098,7 +4078,8 @@ "http-parser-js": { "version": "0.5.0", "resolved": "https://registry.npmjs.org/http-parser-js/-/http-parser-js-0.5.0.tgz", - "integrity": "sha512-cZdEF7r4gfRIq7ezX9J0T+kQmJNOub71dWbgAXVHDct80TKP4MCETtZQ31xyv38UwgzkWPYF/Xc0ge55dW9Z9w==" + "integrity": "sha512-cZdEF7r4gfRIq7ezX9J0T+kQmJNOub71dWbgAXVHDct80TKP4MCETtZQ31xyv38UwgzkWPYF/Xc0ge55dW9Z9w==", + "dev": true }, "http-proxy": { "version": "1.17.0", @@ -4453,7 +4434,8 @@ "is-buffer": { "version": "1.1.6", "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.6.tgz", - "integrity": "sha512-NcdALwpXkTm5Zvvbk7owOUSvVvBKDgKP5/ewfXEznmQFfs4ZRmanOeKBTjRVjka3QFoN6XJ+9F3USqfHqTaU5w==" + "integrity": "sha512-NcdALwpXkTm5Zvvbk7owOUSvVvBKDgKP5/ewfXEznmQFfs4ZRmanOeKBTjRVjka3QFoN6XJ+9F3USqfHqTaU5w==", + "dev": true }, "is-callable": { "version": "1.1.4", @@ -6324,27 +6306,6 @@ "integrity": "sha512-XRsRjdf+j5ml+y/6GKHPZbrF/8p2Yga0JPtdqTIY2Xe5ohJPD9saDJJLPvp9+NSBprVvevdXZybnj2cv8OEd0A==", "dev": true }, - "pusher-js": { - "version": "4.4.0", - "resolved": "https://registry.npmjs.org/pusher-js/-/pusher-js-4.4.0.tgz", - "integrity": "sha512-oxSEG764hqeGAqW9Ryq5KdGQrbM/2sBy5L6Jsh62GyRbRO4z0qI9EjQ6IfQSDhR59b/tY0ANuXD8+ZOZY9AOyg==", - "requires": { - "faye-websocket": "0.9.4", - "tweetnacl": "^1.0.0", - "tweetnacl-util": "^0.15.0", - "xmlhttprequest": "^1.8.0" - }, - "dependencies": { - "faye-websocket": { - "version": "0.9.4", - "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.9.4.tgz", - "integrity": "sha1-iFk0x57/sECVSeDAo4Ae0XpAza0=", - "requires": { - "websocket-driver": ">=0.5.1" - } - } - } - }, "qs": { "version": "6.5.2", "resolved": "https://registry.npmjs.org/qs/-/qs-6.5.2.tgz", @@ -7981,16 +7942,6 @@ "integrity": "sha1-oVe6QC2iTpv5V/mqadUk7tQpAaY=", "dev": true }, - "tweetnacl": { - "version": "1.0.1", - "resolved": "https://registry.npmjs.org/tweetnacl/-/tweetnacl-1.0.1.tgz", - "integrity": "sha512-kcoMoKTPYnoeS50tzoqjPY3Uv9axeuuFAZY9M/9zFnhoVvRfxz9K29IMPD7jGmt2c8SW7i3gT9WqDl2+nV7p4A==" - }, - "tweetnacl-util": { - "version": "0.15.0", - "resolved": "https://registry.npmjs.org/tweetnacl-util/-/tweetnacl-util-0.15.0.tgz", - "integrity": "sha1-RXbBzuXi1j0gf+5S8boCgZSAvHU=" - }, "type-is": { "version": "1.6.16", "resolved": "https://registry.npmjs.org/type-is/-/type-is-1.6.16.tgz", @@ -8702,6 +8653,7 @@ "version": "0.7.0", "resolved": "https://registry.npmjs.org/websocket-driver/-/websocket-driver-0.7.0.tgz", "integrity": "sha1-DK+dLXVdk67gSdS90NP+LMoqJOs=", + "dev": true, "requires": { "http-parser-js": ">=0.4.0", "websocket-extensions": ">=0.1.1" @@ -8710,7 +8662,8 @@ "websocket-extensions": { "version": "0.1.3", "resolved": "https://registry.npmjs.org/websocket-extensions/-/websocket-extensions-0.1.3.tgz", - "integrity": "sha512-nqHUnMXmBzT0w570r2JpJxfiSD1IzoI+HGVdd3aZ0yNi3ngvQ4jv1dtHt5VGxfI2yj5yqImPhOK4vmIh2xMbGg==" + "integrity": "sha512-nqHUnMXmBzT0w570r2JpJxfiSD1IzoI+HGVdd3aZ0yNi3ngvQ4jv1dtHt5VGxfI2yj5yqImPhOK4vmIh2xMbGg==", + "dev": true }, "whatwg-fetch": { "version": "3.0.0", @@ -8794,11 +8747,6 @@ "integrity": "sha1-R0tQhlrzpJqcRlfwWs0UVFj3fYI=", "dev": true }, - "xmlhttprequest": { - "version": "1.8.0", - "resolved": "https://registry.npmjs.org/xmlhttprequest/-/xmlhttprequest-1.8.0.tgz", - "integrity": "sha1-Z/4HXFwk/vOfnWX197f+dRcZaPw=" - }, "xregexp": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/xregexp/-/xregexp-4.0.0.tgz", diff --git a/package.json b/package.json index f94dbcf..399eac9 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "react-basket", - "version": "0.1.3", + "version": "0.1.4", "description": "A shopping basket components library for React based on material-ui components.", "main": "./dist/index.js", "homepage": "https://github.com/mbrn/react-basket#readme", @@ -49,9 +49,7 @@ "dependencies": { "@material-ui/core": "^3.9.2", "@material-ui/icons": "^3.0.2", - "axios": "^0.18.0", "material-table": "^1.23.6", - "pusher-js": "^4.4.0", "react": "16.5.2", "react-dom": "16.5.2" }