hzhang/HangmanLab.Frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix render issue

Browse Source
This commit is contained in:
h z
2024-12-03 16:36:32 +00:00
parent 22da3bc90d
commit 18a84123d3
8 changed files with 38 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
public/index.html
View File

@@ -3,9 +3,10 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>React Project</title>
<title>React x Project</title>
</head>
<body>
<h2>wwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwww</h2>
<div id="root"></div>
</body>
</html>

22
src/App.js
View File

@@ -1,7 +1,27 @@
import React from "react";
import { BrowserRouter as Router, Route, Routes } from "react-router-dom";
import MainNavigation from "./components/MainNavigation";
import SideNavigation from "./components/SideNavigation";
import MarkdownContent from "./components/MarkdownContent";
import "./App.css";
const App = () => {
return <h1>Welcome to My React Project</h1>;
return (
<Router>
<div className="app-container">
<MainNavigation />
<div className="content-container">
<SideNavigation />
<main className="main-content">
<Routes>
<Route path="/" element={<h1>Welcome to My React Project</h1>} />
<Route path="/markdown/:id" element={<MarkdownContent />} />
</Routes>
</main>
</div>
</div>
</Router>
);
};
export default App;

6
src/AuthProvider.js
View File

@@ -3,7 +3,11 @@ import { UserManager } from "oidc-client-ts";
import {oidcConfig} from "./oicdConfig";
export const AuthContext = createContext();
export const AuthContext = createContext({
user: null,
login: () => {},
logout: () => {},
});
const AuthProvider = ({ children }) => {
const [user, setUser] = useState(null);

2
src/components/MainNavigation.js
View File

@@ -13,7 +13,7 @@ const MainNavigation = () => {
<li>
<Link to="/">Home</Link>
</li>
{user ? (
{ user && user.profile ? (
<div>
<h1>{user.profile.name}</h1>
<button onClick={logout}>Logout</button>

2
src/components/MarkdownContent.js
View File

@@ -3,7 +3,7 @@
import React, { useEffect, useState } from "react";
import { useParams } from "react-router-dom";
import {fetchWithCache} from "../utils/fetchWIthCache";
import {fetchWithCache} from "../utils/fetchWithCache";
const MarkdownContent = () => {
const { id } = useParams();

6
src/components/SideNavigation.js
View File

@@ -3,14 +3,14 @@
import React, { useEffect, useState } from "react";
import { Link } from "react-router-dom";
import "./SideNavigation.css";
import { fetchWithCache } from "../utils/fetchWithCache";
import {fetchWithCache} from "../utils/fetchWithCache";
const SideNavigation = () => {
const [markdowns, setMarkdowns] = useState([]);
const [tree, setTree] = useState(null);
useEffect(() => {
fetchWithCache("/api/markdown/")
fetchWithCache("http://127.0.0.1:5000/api/markdown/")
.then((data) => {
setMarkdowns(data);
setTree(buildTree(data));
@@ -44,7 +44,7 @@ const SideNavigation = () => {
if (value.markdown) {
return (
<li key={value.markdown.id}>
<Link to={`/markdown/${value.markdown.id}`}>
<Link to={`http://127.0.0.1:5000/markdown/${value.markdown.id}`}>
{value.markdown.title}
</Link>
</li>

7
src/index.js
View File

@@ -1,5 +1,8 @@
import React from "react";
import ReactDOM from "react-dom";
import ReactDOM from "react-dom/client";
import App from "./App";
ReactDOM.render(<App />, document.getElementById("root"));
//ReactDOM.render(<App />, document.getElementById("root"));
const root = ReactDOM.createRoot(document.getElementById("root"));
root.render(<App />);

0
src/utils/fetchWIthCache.js → src/utils/fetchWithCache.js
View File