From 297ced78dbaf3dc0ab30d2319e8d279d79142ea1 Mon Sep 17 00:00:00 2001 From: stuartkilgore Date: Fri, 8 Sep 2017 14:03:52 -0500 Subject: [PATCH 1/3] working! --- .gitignore | 1 + package.json | 2 +- src/App.js | 39 ++++++++++++++++++++++++++--------- src/components/Charts.js | 8 ++++++++ src/components/Marquee.js | 2 +- src/components/Profile.js | 2 +- src/components/Profiles.js | 3 ++- src/components/Settings.js | 8 ++++++++ src/components/SideNav.js | 42 +++++++++++++++++++++++++++++++------- src/components/Tables.js | 8 ++++++++ src/components/Wall.js | 8 ++++++++ 11 files changed, 102 insertions(+), 21 deletions(-) create mode 100644 src/components/Charts.js create mode 100644 src/components/Settings.js create mode 100644 src/components/Tables.js create mode 100644 src/components/Wall.js diff --git a/.gitignore b/.gitignore index 6c96c5c..b0a8c65 100644 --- a/.gitignore +++ b/.gitignore @@ -13,3 +13,4 @@ build .DS_Store .env npm-debug.log +*.swp diff --git a/package.json b/package.json index ba2f6ca..84c0e3a 100644 --- a/package.json +++ b/package.json @@ -16,7 +16,7 @@ "react": "^15.3.2", "react-dom": "^15.3.2", "react-redux": "^5.0.4", - "react-router-dom": "^4.1.1", + "react-router-dom": "^4.2.2", "redux": "^3.6.0" }, "scripts": { diff --git a/src/App.js b/src/App.js index 15bddc9..b682205 100644 --- a/src/App.js +++ b/src/App.js @@ -1,21 +1,40 @@ import React from "react"; import TopNav from "./components/TopNav"; import SideNav from "./components/SideNav"; +import Charts from "./components/Charts"; +import Tables from "./components/Tables"; +import Settings from "./components/Settings"; +import Wall from "./components/Wall"; +import Profiles from "./components/Profiles"; +import Marquee from "./components/Marquee"; +import Profile from "./components/Profile"; +import Dashboard from "./components/Dashboard"; +import {BrowserRouter,Switch,Route} from 'react-router-dom'; function App() { return ( -
-
- -
- {/* PUT YOUR ROUTES HERE */} + +
+
+ +
+ + + + + + + + + + +
-
- + ); } diff --git a/src/components/Charts.js b/src/components/Charts.js new file mode 100644 index 0000000..ce0eb65 --- /dev/null +++ b/src/components/Charts.js @@ -0,0 +1,8 @@ +import React from 'react'; + +export default function Charts() { + return ( +
CHAAAARRRRTSSSSS wooowoooowoooo
+ ); +} + diff --git a/src/components/Marquee.js b/src/components/Marquee.js index 820e8c4..21565c7 100644 --- a/src/components/Marquee.js +++ b/src/components/Marquee.js @@ -1,7 +1,7 @@ import React from "react"; function Marquee(props) { - const message = "hello"; + const message = props.match.params.text; return ( {message} ); diff --git a/src/components/Profile.js b/src/components/Profile.js index c4eb646..7cc69ac 100644 --- a/src/components/Profile.js +++ b/src/components/Profile.js @@ -2,7 +2,7 @@ import React from "react"; import {connect} from "react-redux"; function Profile(props) { - const userId = 0; + const userId = props.match.params.id; const user = props.users.find(u => u.id == userId) || {}; return (
diff --git a/src/components/Profiles.js b/src/components/Profiles.js index 3409812..3bb099f 100644 --- a/src/components/Profiles.js +++ b/src/components/Profiles.js @@ -1,12 +1,13 @@ import React from "react"; import {connect} from "react-redux"; +import {Link} from "react-router-dom"; function Profiles(props) { const userDivs = props.users.map((user,i) => { return (
{user.firstName} - {user.lastName} - View + View
); }); return ( diff --git a/src/components/Settings.js b/src/components/Settings.js new file mode 100644 index 0000000..ba6b0f8 --- /dev/null +++ b/src/components/Settings.js @@ -0,0 +1,8 @@ +import React from 'react'; + +export default function Settings() { + return ( +
SEEEETTTTINGSSSSSS OooOoooo
+ ); +} + diff --git a/src/components/SideNav.js b/src/components/SideNav.js index 9caaf7c..d787166 100644 --- a/src/components/SideNav.js +++ b/src/components/SideNav.js @@ -1,26 +1,54 @@ import React from "react"; -// import {Link} from "react-router-dom"; +import {Link} from "react-router-dom"; function SideNav() { return (
  • - {/* Dashboard - */}
  • - + Charts - +
  • - + Tables - + +
    • +
  • + + Settings + +
    • +
  • + + Wall + +
    • +
  • + + Profiles + +
    • +
  • + + iloveroutes + +
    • +
  • + + reactrouterules + +
    • +
  • + + poooooops +
); diff --git a/src/components/Tables.js b/src/components/Tables.js new file mode 100644 index 0000000..7d174a6 --- /dev/null +++ b/src/components/Tables.js @@ -0,0 +1,8 @@ +import React from 'react'; + +export default function Tables() { + return ( +
TAAAAAABLESSSSSSSoooooooooo
+ ); +} + diff --git a/src/components/Wall.js b/src/components/Wall.js new file mode 100644 index 0000000..4f0bf09 --- /dev/null +++ b/src/components/Wall.js @@ -0,0 +1,8 @@ +import React from 'react'; + +export default function Wall() { + return ( +
Waaaaalllllll oooOoOooooo
+ ); +} + From 9f8220f9a4e517bf4a3875009fb5493975fd91c8 Mon Sep 17 00:00:00 2001 From: stuartkilgore Date: Fri, 8 Sep 2017 14:11:32 -0500 Subject: [PATCH 2/3] changed icons --- src/components/SideNav.js | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/src/components/SideNav.js b/src/components/SideNav.js index d787166..f9c4ab6 100644 --- a/src/components/SideNav.js +++ b/src/components/SideNav.js @@ -22,32 +22,32 @@ function SideNav() {
  • - Settings + Settings
  • - Wall + Wall
  • - Profiles + Profiles
  • - iloveroutes + iloveroutes
  • - reactrouterules + reactrouterules
  • - poooooops + poooooops
    • From e568db9ac41ace0f7a10e048e891c71a0248c3d3 Mon Sep 17 00:00:00 2001 From: stuartkilgore Date: Fri, 8 Sep 2017 14:28:25 -0500 Subject: [PATCH 3/3] funnier --- src/components/Charts.js | 2 +- src/components/Marquee.js | 5 ++++- src/components/Settings.js | 2 +- src/components/Tables.js | 2 +- src/components/Wall.js | 2 +- 5 files changed, 8 insertions(+), 5 deletions(-) diff --git a/src/components/Charts.js b/src/components/Charts.js index ce0eb65..3ad1b11 100644 --- a/src/components/Charts.js +++ b/src/components/Charts.js @@ -2,7 +2,7 @@ import React from 'react'; export default function Charts() { return ( -
    CHAAAARRRRTSSSSS wooowoooowoooo
    + ); } diff --git a/src/components/Marquee.js b/src/components/Marquee.js index 21565c7..41908b6 100644 --- a/src/components/Marquee.js +++ b/src/components/Marquee.js @@ -3,7 +3,10 @@ import React from "react"; function Marquee(props) { const message = props.match.params.text; return ( - {message} +
    + {message} + +
    ); } diff --git a/src/components/Settings.js b/src/components/Settings.js index ba6b0f8..d355c1b 100644 --- a/src/components/Settings.js +++ b/src/components/Settings.js @@ -2,7 +2,7 @@ import React from 'react'; export default function Settings() { return ( -
    SEEEETTTTINGSSSSSS OooOoooo
    + ); } diff --git a/src/components/Tables.js b/src/components/Tables.js index 7d174a6..04508a8 100644 --- a/src/components/Tables.js +++ b/src/components/Tables.js @@ -2,7 +2,7 @@ import React from 'react'; export default function Tables() { return ( -
    TAAAAAABLESSSSSSSoooooooooo
    + ); } diff --git a/src/components/Wall.js b/src/components/Wall.js index 4f0bf09..856de41 100644 --- a/src/components/Wall.js +++ b/src/components/Wall.js @@ -2,7 +2,7 @@ import React from 'react'; export default function Wall() { return ( -
    Waaaaalllllll oooOoOooooo
    + ); }