From fc29d7d32717e777ae45e639d9102df35970eca3 Mon Sep 17 00:00:00 2001 From: Daniel Nguyen Date: Fri, 27 Nov 2020 11:41:20 +0100 Subject: [PATCH] Non-existing button --- package-lock.json | 43 ++++++++++++++++- package.json | 2 + src/App.js | 58 +++++++++++------------ src/components/pages/Disruption.js | 23 +++++++++ src/components/pages/TrafficInfo.js | 73 +++++++++++++++++------------ 5 files changed, 137 insertions(+), 62 deletions(-) create mode 100644 src/components/pages/Disruption.js diff --git a/package-lock.json b/package-lock.json index 44d84fd..2e07101 100644 --- a/package-lock.json +++ b/package-lock.json @@ -3446,6 +3446,15 @@ "integrity": "sha512-1Yj8h9Q+QDF5FzhMs/c9+6UntbD5MkRfRwac8DoEm9ZfUBZ7tZ55YcGVAzEe4bXsdQHEk+s9S5wsOKVdZrw0tQ==", "optional": true }, + "bindings": { + "version": "1.5.0", + "resolved": "https://registry.npmjs.org/bindings/-/bindings-1.5.0.tgz", + "integrity": "sha512-p2q/t/mhvuOj/UeLlV6566GD/guowlr0hHxClI0W9m7MWYkL1F0hLo+0Aexs9HSPCtR1SXQ0TD3MMKrXZajbiQ==", + "optional": true, + "requires": { + "file-uri-to-path": "1.0.0" + } + }, "bluebird": { "version": "3.7.2", "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.7.2.tgz", @@ -6343,6 +6352,12 @@ } } }, + "file-uri-to-path": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz", + "integrity": "sha512-0Zt+s3L7Vf1biwWZ29aARiVYLx7iMGnEUl9x33fbB/j3jR81u/O2LbqK+Bm1CDSNDKVtJ/YjwY7TUd5SkeLQLw==", + "optional": true + }, "filesize": { "version": "6.1.0", "resolved": "https://registry.npmjs.org/filesize/-/filesize-6.1.0.tgz", @@ -10133,6 +10148,12 @@ "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-0.0.8.tgz", "integrity": "sha512-nnbWWOkoWyUsTjKrhgD0dcz22mdkSnpYqbEjIm2nhwhuxlSkpywJmBo8h0ZqJdkp73mb90SssHkN4rsRaBAfAA==" }, + "nan": { + "version": "2.14.2", + "resolved": "https://registry.npmjs.org/nan/-/nan-2.14.2.tgz", + "integrity": "sha512-M2ufzIiINKCuDfBSAUr1vWQ+vuVcA9kqx8JJUsbQi6yf1uGRyb7HfpdfUr5qLXf3B/t8dPvcjhKMmlfnP47EzQ==", + "optional": true + }, "nanoid": { "version": "3.1.16", "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.1.16.tgz", @@ -12255,6 +12276,11 @@ "whatwg-fetch": "^3.4.1" } }, + "react-axios": { + "version": "2.0.3", + "resolved": "https://registry.npmjs.org/react-axios/-/react-axios-2.0.3.tgz", + "integrity": "sha512-63kY2iupdRgbvPq9G8xmM0NWUnt2Q5YmpotMoLQsxKOzKXKZg2Lo6CzF/bcZvtmv3WnfjBU6Bg8nZQO28eIAZw==" + }, "react-dev-utils": { "version": "11.0.0", "resolved": "https://registry.npmjs.org/react-dev-utils/-/react-dev-utils-11.0.0.tgz", @@ -12360,6 +12386,11 @@ "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz", "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==" }, + "react-push-notification": { + "version": "1.3.0", + "resolved": "https://registry.npmjs.org/react-push-notification/-/react-push-notification-1.3.0.tgz", + "integrity": "sha512-hyYKZqwtNOgRP74fAafVIivEr99vUtH0nDgcWkPKd302BhMuUMr5wuuEX236bSbCoM4nxlOge1m0CKIEtWBqLA==" + }, "react-refresh": { "version": "0.8.3", "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.8.3.tgz", @@ -15252,7 +15283,11 @@ "version": "1.2.13", "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.2.13.tgz", "integrity": "sha512-oWb1Z6mkHIskLzEJ/XWX0srkpkTQ7vaopMQkyaEIoq0fmtFVxOthb8cCxeT+p3ynTdkk/RZwbgG4brR5BeWECw==", - "optional": true + "optional": true, + "requires": { + "bindings": "^1.5.0", + "nan": "^2.12.1" + } }, "glob-parent": { "version": "3.1.0", @@ -15838,7 +15873,11 @@ "version": "1.2.13", "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.2.13.tgz", "integrity": "sha512-oWb1Z6mkHIskLzEJ/XWX0srkpkTQ7vaopMQkyaEIoq0fmtFVxOthb8cCxeT+p3ynTdkk/RZwbgG4brR5BeWECw==", - "optional": true + "optional": true, + "requires": { + "bindings": "^1.5.0", + "nan": "^2.12.1" + } }, "glob-parent": { "version": "3.1.0", diff --git a/package.json b/package.json index 53113ab..58623ff 100644 --- a/package.json +++ b/package.json @@ -8,7 +8,9 @@ "@testing-library/user-event": "^12.2.2", "axios": "^0.21.0", "react": "^17.0.1", + "react-axios": "^2.0.3", "react-dom": "^17.0.1", + "react-push-notification": "^1.3.0", "react-router-dom": "^5.2.0", "react-scripts": "4.0.0", "web-vitals": "^0.2.4" diff --git a/src/App.js b/src/App.js index 1ea951d..d58efca 100644 --- a/src/App.js +++ b/src/App.js @@ -1,39 +1,39 @@ -import './variables.css'; -import './App.css'; +import "./variables.css"; +import "./App.css"; -import React, { Component } from 'react'; -import { BrowserRouter as Router, Route } from 'react-router-dom'; +import React, { Component } from "react"; +import { BrowserRouter as Router, Route } from "react-router-dom"; -import NavigationDrawer from './components/NavigationDrawer.js' -import BottomMenu from './components/BottomMenu.js' -import AccessToken from './components/AccessToken.js' -import NearbyStation from './components/NearbyStation'; +import NavigationDrawer from "./components/NavigationDrawer.js"; +import BottomMenu from "./components/BottomMenu.js"; +import AccessToken from "./components/AccessToken.js"; +import NearbyStation from "./components/NearbyStation"; -import Tickets from './components/pages/Tickets.js'; -import TicketsBuy from './components/pages/TicketsBuy.js'; -import Travel from './components/pages/Travel.js'; -import TrafficInfo from './components/pages/TrafficInfo.js'; +import Tickets from "./components/pages/Tickets.js"; +import TicketsBuy from "./components/pages/TicketsBuy.js"; +import Travel from "./components/pages/Travel.js"; +import TrafficInfo from "./components/pages/TrafficInfo.js"; + +import "./variables.css"; -import './variables.css'; - class App extends Component { - render() { - return ( - -
- + render() { + return ( + +
+ - - - - - + + + + + - -
-
- ); - } + +
+
+ ); + } } export default App; diff --git a/src/components/pages/Disruption.js b/src/components/pages/Disruption.js new file mode 100644 index 0000000..15aac97 --- /dev/null +++ b/src/components/pages/Disruption.js @@ -0,0 +1,23 @@ +import addNotification from "react-push-notification"; + +const Disruption = () => { + const buttonClick = () => { + addNotification({ + title: "Warning", + subtitle: "This is a subtitle", + message: "This is a very long message", + theme: "blue", + native: true, // when using native, your OS will handle theming. + }); + }; + + return ( +
+ +
+ ); +}; + +export default Disruption; diff --git a/src/components/pages/TrafficInfo.js b/src/components/pages/TrafficInfo.js index 803d04e..877cabb 100644 --- a/src/components/pages/TrafficInfo.js +++ b/src/components/pages/TrafficInfo.js @@ -1,38 +1,49 @@ -import React, { Component } from 'react'; +import React, { Component } from "react"; -import Header from '../Header.js'; -import TopMenu from '../TopMenu.js'; -import MainArea from '../MainArea.js'; -import StopTitle from '../StopTitle.js'; -import TrafficList from '../TrafficList.js'; +import Header from "../Header.js"; +import TopMenu from "../TopMenu.js"; +import MainArea from "../MainArea.js"; +import StopTitle from "../StopTitle.js"; +import TrafficList from "../TrafficList.js"; -import Stop from '../../classes/Stop.js'; -import Departure from '../../classes/Departure.js'; +import Stop from "../../classes/Stop.js"; +import Departure from "../../classes/Departure.js"; + +import Disruption from "./Disruption.js"; class TrafficInfo extends Component { - render() { - let testStop = - new Stop( - "Lemmingsgatan", - ["Läge A", "Läge B", "Läge C"], - [ - new Departure("519", "Mot Heden", "11:59", "Trafikolycka vid Partille Centrum."), - new Departure("58", "Mot Västra Eriksberg", "12:07") - ], - ); + render() { + let testStop = new Stop( + "Lemmingsgatan", + ["Läge A", "Läge B", "Läge C"], + [ + new Departure( + "519", + "Mot Heden", + "11:59", + "Trafikolycka vid Partille Centrum." + ), + new Departure("58", "Mot Västra Eriksberg", "12:07"), + ] + ); - return ( - <> -
- - - - - - - - ); - } + return ( + <> +
+ + + + + + + + + + + ); + } } -export default TrafficInfo; \ No newline at end of file +export default TrafficInfo;