Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
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
17 changes: 16 additions & 1 deletion README.md
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This information seems like it may be irrelevant to the README file in the root directory. Consider moving the information about the content editor to a .md markdown file in the test_cases directory.

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I will double check, I believe the professor wanted it like this.

Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@ _**On first login, new user must change password by using the `passwd` command**

- ### Using Local Setup
- Run `install.ps1` (recommended) or `install.bat` (legacy) or `install.sh` (on linux) to get dependencies set up locally
- `install.ps1` supports performing a clean installation by using the `-CleanInstall` flag. Use this if you encounter a `npm install` failure. Caution: Ensure you have commited/pushed any important changes before running this command.
- `install.ps1` supports performing a clean installation by using the `-CleanInstall` flag. Use this if you encounter a `npm install` failure. **Caution:** Ensure you have commited/pushed any important changes before running this command with the `-CleanInstall` flag.
- `install.ps1` also supports skipping initializing the server or the ui, using the `-SkipServer` and `-SkipUI` flags.
- You will need to manually install the Prettier extension on your IDE ([for VSCode](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode)) ([for IntelliJ](https://plugins.jetbrains.com/plugin/10456-prettier)).

Expand Down Expand Up @@ -87,3 +87,18 @@ After sshing into the server, cd into either prod or test project. Then run resp
## Backend Documentation

[Swagger Link](https://petstore.swagger.io/?url=https%3A%2F%2Fraw.githubusercontent.com%2FRIT-Software-Engineering%2FRIT-SE-Senior-Project%2Frefs%2Fheads%2Fdev%2Fui%2Fpublic%2Fapi-docs%2Fserver_doc.yaml)

## Content Editor

The site includes a Content Editor that allows administrators to edit HTML fragments stored in the database. These fragments are used to render portions of the site such as the homepage panel, sponsor information, and the logged-in/logged-out footers.

### Accessing the Content Editor
- Log into the site with an account that has admin privileges.
- Navigate to the Admin Tab -> Content Editor -> Page Editor

### Editing Content
- The editor displays a list of named HTML blocks (e.g., `homePagePanel`, `sponsor`, `loggedInFooter`, `loggedOutFooter`).
- Select the block you want to edit. The existing HTML will be displayed in a text box.
- Make your changes directly in the editor.
- Click **Update HTML** to save your changes. The update is written directly into the database.
- Refresh the site to see your changes in action.
58 changes: 53 additions & 5 deletions server/server/database/test_data/page_html_dummy.sql
Original file line number Diff line number Diff line change
@@ -1,5 +1,9 @@
INSERT INTO page_html (name, html) VALUES
('homePagePanel', '<div class="row">
INSERT INTO
page_html (name, html)
VALUES
(
'homePagePanel',
'<div class="row">
<h2>Overview</h2>
</div>
<div class="row">
Expand All @@ -15,8 +19,11 @@ INSERT INTO page_html (name, html) VALUES
inception through an entire software development lifecycle. The end result is a functional software
tool ready for use by the sponsor''s organization.
</p>
</div>'),
('sponsor', '<div class="row">
</div>'
),
(
'sponsor',
'<div class="row">
<h2 class="ui header">Become a Project Sponsor</h2>
</div>
<div class="row">
Expand Down Expand Up @@ -213,4 +220,45 @@ INSERT INTO page_html (name, html) VALUES
</ol>
</div>
</div>
</div>');
</div>'
),
(
'loggedOutFooter',
"<div id='bringMeDownSignedIn' class='ui container stackable grid'>
<div class='three column row'>
<div class='column'>
<img src='/assets/logo.jpg' alt='Logo' style='max-width:200px; width:100%; height:auto;' />
</div>
<div class='column'>
<p>
Department of Software Engineering<br/>
Golisano Building 70, Room 1690<br/>
134 Lomb Memorial Drive<br/>
Rochester, NY 14623-5608
</p>
</div>
<div class='column'>
<p>
<i class='ui mail icon'></i>
<a href='mailto:[email protected]'>[email protected]</a>
</p>
</div>
</div>
<div class='centered row' style='text-align:center;'>
<p>&copy; " || strftime('%Y','now') || " Rochester Institute of Technology, All Rights Reserved</p>
</div>
</div>"
),
(
'loggedInFooter',
"<div id='bringMeDown' class='ui container stackable grid'>
<div class='two column row'>
<div class='column'>
<h5 id='copyright'>
<i class='ui icon copyright'></i>
" || strftime('%Y','now') || " Rochester Institute of Technology, All Rights Reserved
</h5>
</div>
</div>
</div>"
);
10 changes: 9 additions & 1 deletion test_cases/admin.md
Original file line number Diff line number Diff line change
Expand Up @@ -120,5 +120,13 @@
5. Upon successful updating of the HTMLs a little “Success!” should appear just above the “Update HTML” button
![Content Editor 5](images/contenteditor5.png)

6. To view these changes simply sign out of admin by using the developer sign in menu in the top right or press on the RIT logo in the top left. The UI routing should remain the same and the changes made to the HTML should be visible immediately.
6. To view these changes simply sign out of admin by using the developer sign in menu in the top right or press on the RIT logo in the top left. The UI routing should remain the same and the changes made to the HTML should be visible immediately after refreshing.
![Content Editor 6](images/contenteditor6.png)

7. In addition to the overview and project sponsor sections, Content Editor includes two other editable sections: "loggedOutFooter" and "loggedInFooter".
![Content Editor 7](images/contenteditor7.png)

8. Just like with the Overview and Sponsor sections, you can edit the "loggedOutFooter"
and "loggedInFooter" HTML directly. After making your changes, click "Update HTML"
and check the footer on the corresponding page (signed in vs. signed out) to confirm
the updates appear.
Binary file added test_cases/images/contenteditor7.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added ui/public/assets/logo-dark.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added ui/public/assets/logo-light.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added ui/public/assets/logo.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
3 changes: 2 additions & 1 deletion ui/src/components/pages/StackTraceErrorPage.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
import React, { useState } from "react";
import uiConfig from "../../config/uiConfig";
import { Button } from "semantic-ui-react";

const StackTraceErrorPage = () => {
Expand Down Expand Up @@ -33,7 +34,7 @@ const StackTraceErrorPage = () => {

const handleReportOnGitHub = () => {
try {
const version = "v1.8.1";
const version = `v${uiConfig.footers.loggedIn.version}`;
const timestamp = errorInfo?.timestamp || "No timestamp saved";
const error = errorInfo?.error || "Unknown error";
const statusCode = errorInfo?.statusCode
Expand Down
129 changes: 51 additions & 78 deletions ui/src/components/shared/allPages/Footer.js
Original file line number Diff line number Diff line change
@@ -1,94 +1,67 @@
import React, { useContext, useEffect, useState } from "react";
import { UserContext } from "../../util/functions/UserContext";
import collegeLogo from "../../../Assets/Golisano _College of_Computing_and_Information_Sciences_LOGO.jpg";
import { config } from "../../util/functions/constants";
import { SecureFetch } from "../../util/functions/secureFetch";
import InnerHTML from "dangerously-set-html-content";
import "./../../../css/containers/footer.css";
import "semantic-ui-css/semantic.min.css"
import uiConfig from "../../../config/uiConfig";

function Footer() {
const { user } = useContext(UserContext);
const [signedIn, setSignedIn] = useState(false);
const [footerHtml, setFooterHtml] = useState("");
const [isLoading, setIsLoading] = useState(true);

const signedIn = user && Object.keys(user).length > 0 && user.user;
useEffect(() => {
// A user is considered signed in if the user object has a value
setSignedIn(Object.keys(user).length !== 0);
}, [user]);

if (signedIn) {
return (
<div id="footer">
<div id="bringMeDown" className="ui container stackable grid">
<div className="two column row">
<div className="column">
<h5 id="copyright">
<i className="ui icon copyright"></i> Rochester Institute of
Technology, All Rights Reserved
</h5>
</div>
<div id="version" className="column">
<h5>
<a
href="https://github.com/RIT-Software-Engineering/RIT-SE-Senior-Project"
target="_blank"
rel="noreferrer"
>
v1.8.1
</a>
</h5>
</div>
</div>
</div>
</div>
);
} else {

const footerName = signedIn ? "loggedInFooter" : "loggedOutFooter";

setIsLoading(true);
SecureFetch(`${config.url.API_GET_HTML}?name=${footerName}`)
.then((r) => {
if (!r.ok) throw new Error("Network response was not ok");
return r.json();
})
.then((data) => {
const html = data?.[0]?.html || "";
setFooterHtml(html);
setIsLoading(false);
})
.catch((error) => {
console.error("Error fetching footer:", error);
setFooterHtml("");
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Instead of completely removing the footer's HTML, maybe we could leave an error message?

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes I can look into that! We could discuss this Friday too!

setIsLoading(false);
});
}, [user]);
if (isLoading) {
return (
<div id="footer">
<div id="bringMeDownSignedIn" className="ui container stackable grid">
<div className="three column row">
<div className="column">
<img
src={collegeLogo}
alt="Golisano College of Computing & Information Sciences"
style={{
maxWidth: "200px",
width: "100%",
height: "auto",
}}
/>
</div>
<div className="column">
<h4>
Department of Software Engineering
<br />
Golisano Building 70, Room 1690
<br />
134 Lomb Memorial Drive
<br />
Rochester, NY 14623-5608
</h4>
</div>
<div className="column">
<h4>
<i className="ui mail icon"></i> [email protected]
</h4>
</div>
</div>
<div
className="centered row"
style={{
display: "flex",
flexDirection: "column",
alignItems: "center",
gap: "10px",
}}
>
<h5>
<i className="ui icon copyright"></i> Rochester Institute of
Technology, All Rights Reserved
</h5>
</div>
<div style={{ padding: "10px", textAlign: "center" }}>
Loading...
</div>
</div>
);
}

return (
<div id="footer">
{footerHtml ? <InnerHTML html={footerHtml} /> : null}
{signedIn && (
<div id="version" className="ui container" style={{ textAlign: "right" }}>
<h5>
<a
href={uiConfig.footers.loggedIn.githubLink}
target="_blank"
rel="noreferrer"
>
v{uiConfig.footers.loggedIn.version}
</a>
</h5>
</div>
)}
</div>
);
}

export default Footer;
export default Footer;
9 changes: 4 additions & 5 deletions ui/src/components/shared/allPages/Header.js
Original file line number Diff line number Diff line change
Expand Up @@ -7,10 +7,9 @@ import "../../../css/utils/responsive.css";
import { config } from "../../util/functions/constants";
import { UserContext } from "../../util/functions/UserContext";
import { SecureFetch } from "../../util/functions/secureFetch";
import SELogoLightMode from "../../../Assets/gccis_light.png";
import SELogoDarkMode from "../../../Assets/gccis_dark.png";
import ProfileModal from "./profileModal";
import ProfileCircle from "../../util/components/ProfileCircle";
import uiConfig from "../../../config/uiConfig";

function Header() {
const history = useHistory();
Expand Down Expand Up @@ -226,7 +225,7 @@ function Header() {
return (
<div id="header">
<div id="navbar">
<span>Software Engineering Senior Project</span>
<span>{uiConfig.app.name}</span>
{renderNavButtons()}
<ProfileModal
open={profileModalOpen}
Expand All @@ -244,8 +243,8 @@ function Header() {
}}
>
<img
src={darkMode ? SELogoDarkMode : SELogoLightMode}
alt="Department of Software Engineering"
src={darkMode ? uiConfig.app.logoDark : uiConfig.app.logoLight}
alt= {uiConfig.app.orgName}
style={{
height: "35px",
width: "auto",
Expand Down
29 changes: 29 additions & 0 deletions ui/src/config/uiConfig.js
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I appreciate the hardcoded strings and configuration variables being centered in this file! This should be great for maintainability moving forward.

Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
const uiConfig = {
app: {
name: "Senior Project Portal",
orgName: "Department of Software Engineering",
url: {
API_GET_HTML: "/api/getHtml"
},
logoLight: "/assets/logo-light.png",
logoDark: "/assets/logo-dark.png",
},
logoPath:
"/assets/Golisano _College of_Computing_and_Information_Sciences_LOGO.jpg",
footers: {
loggedOut: {
address:
"Department of Software Engineering\nGolisano Building 70, Room 1690\n134 Lomb Memorial Drive\nRochester, NY 14623-5608",
email: "[email protected]",
copyright: "Rochester Institute of Technology, All Rights Reserved",
},
loggedIn: {
copyright: "Rochester Institute of Technology, All Rights Reserved",
version: "1.8.1",
githubLink:
"https://github.com/RIT-Software-Engineering/RIT-SE-Senior-Project",
},
},
};

export default uiConfig;