Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

David work in progress #37

Open
wants to merge 6 commits into
base: dev
Choose a base branch
from
Open

David work in progress #37

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
50400ae
Updated navbar
David427 Mar 10, 2022
89451a9
Merged dev
David427 Mar 10, 2022
d2cc119
Merge branch 'dev' into david-work-in-progress
David427 Mar 10, 2022
6065c90
Updated navbar
David427 Mar 10, 2022
87e9134
Update footer links
David427 Mar 10, 2022
4641762
Added Sell button to combine homepage/signup
David427 Mar 10, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
33 changes: 33 additions & 0 deletions dart-cart-client/src/App.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -44,3 +44,36 @@
.fa {
color: rgb(25, 135, 84);
}

.ProductCardContainer {
margin: 2%;
display: flex;
flex-wrap: wrap;
background-color: #1b1b1b;
border-style: solid;
border-width: 0.5rem;
border-color: #5f5f5f;
}

.navbar-brand {
display: flex;
justify-content: center;
width: 40%;
margin: auto;
}

.navbar-header {
display: flex;
justify-content: flex-end;
width: 30%;
margin: auto;
}

.nav-item {
margin: auto;
}

.navbar-custom {
padding: 1rem;
margin-top: -10px;
}
66 changes: 31 additions & 35 deletions dart-cart-client/src/App.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,44 +19,40 @@ import Checkout from "./features/checkout/CheckoutDisplay";
import ListItem from "./features/list-item/ListItem";
import ShopPage from "./features/shop-page/ShopPage";
import SellerHomepage from "./features/seller-homepage/SellerHomepage";
import SellerAccess from "./features/authentication/SellerAccess";

function App() {
useEffect(() => {
document.title = "DartCart";
//
});
useEffect(() => {
document.title = "DartCart";
//
});

return (
<div className="App">
<BrowserRouter>
<Provider store={store}>
<Header />
<Routes>
<Route path="/" element={<Display />}></Route>
<Route
path="/sellers/:seller_homepage"
element={<SellerHomepage />}
></Route>
<Route path="/shops/:shop_id" element={<ShopPage />}></Route>
<Route path="/shops/:shop_id/list" element={<ListItem />}></Route>
<Route path="/cart" element={<Cart />}></Route>
<Route path="/register" element={<UserRegister />}></Route>
<Route path="/signup" element={<SellerRegister />}></Route>
<Route path="/login" element={<Login />}></Route>
<Route path="/orders" element={<PreviousOrders />}></Route>
<Route path="/checkout" element={<Checkout />}></Route>
<Route path="/display" element={<Display />}></Route>
<Route
path="/shop-product/:shop_product_id"
element={<ShopProductDisplay />}
></Route>
<Route path="/*" element={<Error404Page />}></Route>
</Routes>
<Footer />
</Provider>
</BrowserRouter>
</div>
);
return (
<div className="App">
<BrowserRouter>
<Provider store={store}>
<Header />
<Routes>
<Route path="/" element={<Display />}></Route>
<Route path="/sellers" element={<SellerAccess />}></Route>
<Route path="/sellers/:seller_homepage" element={<SellerHomepage />}></Route>
<Route path="/shops/:shop_id" element={<ShopPage />}></Route>
<Route path="/shops/:shop_id/list" element={<ListItem />}></Route>
<Route path="/cart" element={<Cart />}></Route>
<Route path="/register" element={<UserRegister />}></Route>
<Route path="/signup" element={<SellerRegister />}></Route>
<Route path="/login" element={<Login />}></Route>
<Route path="/orders" element={<PreviousOrders />}></Route>
<Route path="/checkout" element={<Checkout />}></Route>
<Route path="/display" element={<Display />}></Route>
<Route path="/shop-product/:shop_product_id" element={<ShopProductDisplay />}></Route>
<Route path="/*" element={<Error404Page />}></Route>
</Routes>
<Footer />
</Provider>
</BrowserRouter>
</div>
);
}

export default App;
2 changes: 1 addition & 1 deletion dart-cart-client/src/common/slices/authSlice.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -131,7 +131,7 @@ export const loginUser = createAsyncThunk(
);

export const fetchSeller = createAsyncThunk("authentication/fetchSeller", async (id: number) => {
return axios.get(`${API_URL}sellers/${id}`, { headers: authHeader() }).then((response) => {
return axios.get(`${API_URL}sellers/users/${id}`, { headers: authHeader() }).then((response) => {
localStorage.setItem("seller", JSON.stringify(response.data));
});
});
Expand Down
19 changes: 19 additions & 0 deletions dart-cart-client/src/features/authentication/SellerAccess.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
import React, { useEffect } from "react";
import { useSelector } from "react-redux";
import { useNavigate } from "react-router-dom";
import { selectSeller } from "../../common/slices/authSlice";
import { RootState } from "../../common/store";

const SellerAccess = () => {
const stateSeller = useSelector(selectSeller);
const seller = JSON.parse(stateSeller);
const nav = useNavigate();

useEffect(() => {
seller ? nav(`${seller.homepage}`) : nav("/signup");
}, []);

return <></>;
};

export default SellerAccess;
60 changes: 29 additions & 31 deletions dart-cart-client/src/features/layout/Footer.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,42 +2,40 @@ import Navbar from "./Navbar";
import About from "./About";
import SocialMedia from "./SocialMedia";
import UsefulLinks from "./UsefulLinks";
import FooterNav from "./FooterNav";

export default function Footer() {
// divs dealing with managing columns were not abstracted away so this area can focus on applying styles correctly
// divs dealing with managing columns were not abstracted away so this area can focus on applying styles correctly

return (
<footer className="text-center text-lg-start bg-black">
<section className="footer-info">
<div className="container text-center text-md-start mt-5">
<div className="row mt-3">
<div className="col-md-3 col-lg-4 col-xl-3 mx-auto mb-4">
<SocialMedia />
</div>
return (
<footer className="text-center text-lg-start bg-black">
<section className="footer-info">
<div className="container text-center text-md-start mt-5">
<div className="row mt-3">
<div className="col-md-3 col-lg-4 col-xl-3 mx-auto mb-4">
<SocialMedia />
</div>

<div className="col-md-2 col-lg-2 col-xl-2 mx-auto mb-4">
<h6 className="text-uppercase fw-bold mb-4">Navigation</h6>
<Navbar footer="true" />
</div>
<div className="col-md-2 col-lg-2 col-xl-2 mx-auto mb-4">
<h6 className="text-uppercase fw-bold mb-4">Navigation</h6>
<FooterNav />
</div>

<div className="col-md-3 col-lg-2 col-xl-2 mx-auto mb-4">
<h6 className="text-uppercase fw-bold mb-4">Useful links</h6>
<UsefulLinks />
</div>
<div className="col-md-3 col-lg-2 col-xl-2 mx-auto mb-4">
<h6 className="text-uppercase fw-bold mb-4">Useful links</h6>
<UsefulLinks />
</div>

<div className="col-md-4 col-lg-3 col-xl-3 mx-auto mb-md-0 mb-4">
<About />
</div>
</div>
</div>
</section>
<div className="col-md-4 col-lg-3 col-xl-3 mx-auto mb-md-0 mb-4">
<About />
</div>
</div>
</div>
</section>

<div
className="text-center p-4"
style={{ backgroundColor: "rgba(0, 0, 0, 0.05)" }}
>
© 2022 Dart Cart
</div>
</footer>
);
<div className="text-center p-4" style={{ backgroundColor: "rgba(0, 0, 0, 0.05)" }}>
© 2022 Dart Cart
</div>
</footer>
);
}
25 changes: 25 additions & 0 deletions dart-cart-client/src/features/layout/FooterNav.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@
import React from "react";
import { Link } from "react-router-dom";

const FooterNav = () => {
const links = {
Home: "/",
Categoriees: "#",
Deals: "#",
"Top Items": "#"
};

const navLinks = Object.keys(links).map((link) => {
return (
<p key={link}>
<Link to={links[link]} className="text-reset">
{link}
</Link>
</p>
);
});

return <>{navLinks}</>;
};

export default FooterNav;
39 changes: 17 additions & 22 deletions dart-cart-client/src/features/layout/Logo.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,31 +4,26 @@ import { Navbar } from "react-bootstrap";
import { Link } from "react-router-dom";

const logoStyle = {
height: "15%",
width: "15%",
marginLeft: "3%",
height: "50px",
width: "75px",
marginLeft: "5%"
};

const Logo = () => {
return (
<>
<Navbar>
<Link to="/" style={{ textDecoration: "none", color: "black" }}>
<h2>DartCart</h2>
</Link>
<Link to="/" style={{ textDecoration: "none", color: "black" }}>
<div style={{ textAlign: "left" }}>
<img
className="logo-img"
style={logoStyle}
src={logo}
alt="logo"
></img>
</div>
</Link>
</Navbar>
</>
);
return (
<>
<Navbar style={{ width: "30%" }}>
<Link to="/" style={{ textDecoration: "none", color: "black" }}>
<h2>DartCart</h2>
</Link>
<Link to="/" style={{ textDecoration: "none", color: "black" }}>
<div style={{ textAlign: "left" }}>
<img className="logo-img" style={logoStyle} src={logo} alt="logo"></img>
</div>
</Link>
</Navbar>
</>
);
};

export default Logo;
Loading