From 04406ac7fab2d01ace9ce75e3006610919ce8c86 Mon Sep 17 00:00:00 2001 From: learner97 Date: Tue, 12 Mar 2024 16:45:43 -0600 Subject: [PATCH 1/2] added a way to get the commit hash, changed error messages and added a smaller message box, fixed issue with remove from collections --- frontend/CommitHash.js | 8 ++ frontend/CustomDev.js | 7 ++ frontend/components/Admin/Registries.js | 35 +++++++-- frontend/components/Admin/Theme.js | 14 +++- frontend/components/Error/Errors.js | 61 ++++++++------- frontend/components/Footer.js | 11 +++ .../components/Viewing/Collection/Members.js | 76 ++++++++++++------- frontend/components/Viewing/Shell.js | 1 - frontend/components/Viewing/ViewHeader.js | 2 - frontend/package.json | 2 +- frontend/pages/_app.js | 67 +++++++++------- frontend/public/commitHash.txt | 1 + frontend/styles/error.module.css | 18 +++++ 13 files changed, 206 insertions(+), 97 deletions(-) create mode 100644 frontend/CommitHash.js create mode 100644 frontend/CustomDev.js create mode 100644 frontend/public/commitHash.txt diff --git a/frontend/CommitHash.js b/frontend/CommitHash.js new file mode 100644 index 00000000..22713eb1 --- /dev/null +++ b/frontend/CommitHash.js @@ -0,0 +1,8 @@ +const { execSync } = require('child_process'); +const fs = require('fs'); +const path = require('path'); + +const commitHash = execSync('git rev-parse HEAD').toString().trim(); +const outputPath = path.join(__dirname, 'public', 'commitHash.txt'); + +fs.writeFileSync(outputPath, commitHash); \ No newline at end of file diff --git a/frontend/CustomDev.js b/frontend/CustomDev.js new file mode 100644 index 00000000..13c17e4e --- /dev/null +++ b/frontend/CustomDev.js @@ -0,0 +1,7 @@ +const { execSync } = require('child_process'); + +// Run setCommitHash.js script +execSync('node CommitHash.js', { stdio: 'inherit' }); + +// Start the Next.js development server +execSync('next dev -p 3333', { stdio: 'inherit' }); diff --git a/frontend/components/Admin/Registries.js b/frontend/components/Admin/Registries.js index 9b89e3cd..b7f0bfc9 100644 --- a/frontend/components/Admin/Registries.js +++ b/frontend/components/Admin/Registries.js @@ -283,14 +283,37 @@ const fetcher = (url, token, dispatch) => export async function processUrl(inputUrl, token, dispatch) { const data = await fetcher(`${publicRuntimeConfig.backend}/admin/registries`, token, dispatch); - const registries = data.registries; - for (const registry of registries) { - if (inputUrl.startsWith(registry.uri)) { - const urlRemovedForLink = inputUrl.replace(registry.uri, ""); - const urlReplacedForBackend = inputUrl.replace(registry.uri, registry.url); - return { urlRemovedForLink, urlReplacedForBackend }; + if (data) { + const registries = data.registries; + + for (const registry of registries) { + if (inputUrl.startsWith(registry.uri)) { + const urlRemovedForLink = inputUrl.replace(registry.uri, ""); + const urlReplacedForBackend = inputUrl.replace(registry.uri, registry.url); + return { urlRemovedForLink, urlReplacedForBackend }; + } + } + return { original: inputUrl }; // if you don't match any uri + } + return { original: inputUrl }; // if you don't match any uri +} + +export async function processUrlReverse(inputUrl, token, dispatch) { + + const data = await fetcher(`${publicRuntimeConfig.backend}/admin/registries`, token, dispatch); + + if (data) { + const registries = data.registries; + + for (const registry of registries) { + if (inputUrl.startsWith(registry.url)) { + const uriRemovedForLink = inputUrl.replace(registry.url, ""); + const uriReplacedForBackend = inputUrl.replace(registry.url, registry.uri); + return { uriRemovedForLink, uriReplacedForBackend }; + } } + return { original: inputUrl }; // if you don't match any uri } return { original: inputUrl }; // if you don't match any uri } \ No newline at end of file diff --git a/frontend/components/Admin/Theme.js b/frontend/components/Admin/Theme.js index 2accb9c3..8266b75a 100644 --- a/frontend/components/Admin/Theme.js +++ b/frontend/components/Admin/Theme.js @@ -171,7 +171,15 @@ const fetcher = (url, dispatch) => }) .then(response => response.data) .catch(error => { - error.customMessage = 'Request failed for GET /admin/theme'; - error.fullUrl = url; - dispatch(addError(error)); + if (error.message === 'Network Error') { + // Change the error message or handle it differently + console.error('Unable to connect to the server. Please check your network connection.'); + dispatch(addError(error)); + } else { + // Handle other errors + error.customMessage = 'Request failed for GET /admin/theme31278931739137131'; + error.fullUrl = url; + dispatch(addError(error)); + } + }); diff --git a/frontend/components/Error/Errors.js b/frontend/components/Error/Errors.js index b4106e4f..aaac23b6 100644 --- a/frontend/components/Error/Errors.js +++ b/frontend/components/Error/Errors.js @@ -2,17 +2,14 @@ import { useSelector } from 'react-redux'; import { useEffect, useState } from 'react'; import styles from '../../styles/error.module.css'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { faExclamationCircle } from '@fortawesome/free-solid-svg-icons'; +import { faExclamationCircle, faChevronDown, faChevronUp } from '@fortawesome/free-solid-svg-icons'; import Error from './Error'; import ErrorNavigation from './ErrorNavigation'; import ErrorClearer from './ErrorClearer'; -/** - * This component renders all errors in the store. - * @returns - */ export default function Errors() { const [viewIndex, setViewIndex] = useState(0); + const [isExpanded, setIsExpanded] = useState(false); const errors = useSelector(state => state.errors.errors); useEffect(() => { @@ -23,36 +20,44 @@ export default function Errors() { if (errors.length === 0) return null; const error = errors[viewIndex]; + const toggleExpand = () => setIsExpanded(!isExpanded); + return ( -
+
-

Something went wrong

+

{error.message === "Network Error" ? "Backend Server Not Responding" : "Something went wrong"}

- - Report Issue - -
- -
-
- -
- Error {viewIndex + 1} of {errors.length} -
+
+ {!isExpanded && ( + <> + + + )}
- +
+ {isExpanded && ( + <> + +
+
+ +
+ Error {viewIndex + 1} of {errors.length} +
+
+ +
+ + )}
); } diff --git a/frontend/components/Footer.js b/frontend/components/Footer.js index ca67c3f6..488206f1 100644 --- a/frontend/components/Footer.js +++ b/frontend/components/Footer.js @@ -2,13 +2,24 @@ import Image from 'next/image'; import styles from '../styles/footer.module.css'; +import { useState, useEffect } from 'react'; + /** * This component renders the footer in sbh */ export default function Footer() { + const [commitHash, setCommitHash] = useState(''); + + useEffect(() => { + fetch('/commitHash.txt') + .then(response => response.text()) + .then(hash => setCommitHash(hash)); + }, []); + return (