diff --git a/template_web.client/.hintrc b/template_web.client/.hintrc new file mode 100644 index 0000000..cb34607 --- /dev/null +++ b/template_web.client/.hintrc @@ -0,0 +1,8 @@ +{ + "extends": [ + "development" + ], + "hints": { + "no-inline-styles": "off" + } +} \ No newline at end of file diff --git a/template_web.client/index.html b/template_web.client/index.html index e4b78ea..4dcd3fd 100644 --- a/template_web.client/index.html +++ b/template_web.client/index.html @@ -1,12 +1,13 @@ - + - Vite + React + TS + + Bus Service - +
diff --git a/template_web.client/src/App.tsx b/template_web.client/src/App.tsx index f754acc..4a5f21a 100644 --- a/template_web.client/src/App.tsx +++ b/template_web.client/src/App.tsx @@ -6,8 +6,8 @@ import { Routes, Navigate, } from "react-router-dom"; -import "./App.css"; import Home from "./Pages/Home"; +import ClientHome from "./Pages/Client/Home"; import JQueryComponents from "./Components/Shared/JQueryComponents"; import Login from "./Pages/Login"; import ApiClient from "./Infrastructure/API/apiClient"; @@ -15,12 +15,10 @@ import Logout from "./Pages/Logout"; import AuthService from "./Services/authService"; import { CurrentUserProvider } from "./Infrastructure/Domain/CurrentUserContext"; import { useCurrentUser } from "./Infrastructure/Domain/CurrentUserContext"; -interface Forecast { - date: string; - temperatureC: number; - temperatureF: number; - summary: string; -} +import Header from "./Components/Shared/Header"; +import Features from "./Pages/Features"; +import Pricing from "./Pages/Pricing"; +import Contact from "./Pages/Contact"; function App() { const [isAuthenticated, setIsAuthenticated] = useState(null); @@ -68,22 +66,32 @@ function App() { } } - if (isAuthenticated === null) { + /*if (isAuthenticated === null) { return
Loading...
; - } + }*/ return ( Loading...}> - - } />} /> - } - /> - } /> - } /> - +
+ + } /> + } /> + } /> + } /> + + } />} + /> + } + /> + } /> + } /> + +
diff --git a/template_web.client/src/Components/Shared/Header.tsx b/template_web.client/src/Components/Shared/Header.tsx new file mode 100644 index 0000000..2f82706 --- /dev/null +++ b/template_web.client/src/Components/Shared/Header.tsx @@ -0,0 +1,96 @@ +import React, { useState } from 'react'; + +const Header = () => { + const [isMenuOpen, setIsMenuOpen] = useState(false); + + return ( +
+ + + {/* Mobile Menu */} +
+
+
+
+ + Your Company + Company Logo + + +
+
+ +
+
+
+
+ ); +}; + +export default Header; diff --git a/template_web.client/src/Pages/Client/Home.tsx b/template_web.client/src/Pages/Client/Home.tsx new file mode 100644 index 0000000..02321df --- /dev/null +++ b/template_web.client/src/Pages/Client/Home.tsx @@ -0,0 +1,47 @@ +import { useEffect, useState } from "react"; +import ReactIntro from "../../Components/Shared/ReactIntro"; +import ApiClient from "../../Infrastructure/API/apiClient"; +import { useCurrentUser } from "../../Infrastructure/Domain/CurrentUserContext"; + +const Home = () => { + const { user } = useCurrentUser(); + const [loading, setLoading] = useState(true); + + useEffect(() => { + let isMounted = true; + + const fetchData = async () => { + try { + const api = new ApiClient(); + const response = await api.get("api/Users/UserContext"); + + if (isMounted) { + console.log(response); + setLoading(false); + } + } catch (error) { + console.error("Error fetching data:", error); + setLoading(false); + } + }; + + fetchData(); + + return () => { + // Cleanup function to handle component unmounting + isMounted = false; + }; + }, [user]); // Include user in the dependency array if you want the effect to run when user changes + + if (loading) { + return

Loading...

; + } + + return ( + <> + + + ); +}; + +export default Home; diff --git a/template_web.client/src/Pages/Contact.tsx b/template_web.client/src/Pages/Contact.tsx new file mode 100644 index 0000000..3a6e208 --- /dev/null +++ b/template_web.client/src/Pages/Contact.tsx @@ -0,0 +1,177 @@ +import Header from "../Components/Shared/Header"; + +const Contact = () => { + return ( + <> +
+
+