Merge pull request #119 from mshuber1981/dev

Updating dependencies

Author: mshuber1981

README.md

@@ -30,7 +30,7 @@ Add your GitHub username once and all of your info will automatically be updated
    ```
 
 5. Navigate to the src directory and open src/config.js
-6. Add your GitHub username ([config.js](https://github.com/mshuber1981/github-react-portfolio-template/blob/main/src/config.js#L18) line 18)
+6. Add your GitHub username ([src/config.js](https://github.com/mshuber1981/github-react-portfolio-template/blob/main/src/config.js#L18) line 18)
 
    ```javascript
    /* START HERE
@@ -50,7 +50,7 @@ Add your GitHub username once and all of your info will automatically be updated
 
 ![Projects](/README_images/contact.png)
 
-1. The contact form uses [Formspree](https://formspree.io/), create an account and add your endpoint URL ([config.js](https://github.com/mshuber1981/github-react-portfolio-template/blob/main/src/config.js#L114) line 114)
+1. The contact form uses [Formspree](https://formspree.io/), create an account and add your endpoint URL ([src/config.js](https://github.com/mshuber1981/github-react-portfolio-template/blob/main/src/config.js#L114) line 114)
 
    ```javascript
    /* Contact Info

package-lock.json

@@ -1,19 +1,19 @@
 {
   "name": "github-react-portfolio-template",
   "homepage": "https://YourUserName.github.io/your-repo/",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "private": true,
   "dependencies": {
     "@iconify/react": "^4.1.0",
     "@reduxjs/toolkit": "^2.2.6",
     "bootstrap": "^5.3.3",
     "prop-types": "^15.8.1",
-    "react": "^18.2.0",
+    "react": "^18.3.1",
     "react-bootstrap": "^2.10.4",
-    "react-dom": "^18.2.0",
+    "react-dom": "^18.3.1",
     "react-error-boundary": "^4.0.13",
     "react-redux": "^9.1.2",
-    "react-router-dom": "^6.24.0",
+    "react-router-dom": "^6.24.1",
     "react-scroll": "^1.8.7",
     "sass": "^1.77.6",
     "styled-components": "^6.1.11",

package.json

@@ -42,12 +42,8 @@ const propTypes = {
     })
   ),
 };
-const defaultProps = {
-  filteredProjects: [],
-  projectCardImages: [],
-};
 
-const App = ({ projectCardImages, filteredProjects }) => {
+const App = ({ projectCardImages = [], filteredProjects = [] }) => {
   const theme = useSelector(selectMode);
   const projects = useSelector(selectProjects);
   const dispatch = useDispatch();
@@ -184,7 +180,6 @@ const App = ({ projectCardImages, filteredProjects }) => {
 };
 
 App.propTypes = propTypes;
-App.defaultProps = defaultProps;
 // #endregion
 
 export default App;

src/App.js

@@ -28,11 +28,8 @@ const StyledDiv = styled.div`
 
 // #region component
 const propTypes = { home: PropTypes.string };
-const defaultProps = {
-  home: "Home",
-};
 
-const BackToTop = ({ home }) => {
+const BackToTop = ({ home = "Home" }) => {
   const [scrollYNum, setScrollYNum] = React.useState(null);
   const up = React.useRef(null);
 
@@ -60,7 +57,6 @@ const BackToTop = ({ home }) => {
 };
 
 BackToTop.propTypes = propTypes;
-BackToTop.defaultProps = defaultProps;
 // #endregion
 
 export default BackToTop;

src/components/BackToTop.jsx

@@ -50,14 +50,10 @@ const StyledDiv = styled.div`
 const propTypes = {
   Logo: PropTypes.node,
   callBack: PropTypes.func,
-  closeDelay: PropTypes.number.isRequired,
-};
-const defaultProps = {
-  Logo: defaultLogo,
-  closeDelay: 125,
+  closeDelay: PropTypes.number,
 };
 
-const NavBar = ({ Logo, callBack, closeDelay }) => {
+const NavBar = ({ Logo = defaultLogo, callBack, closeDelay = 125 }) => {
   const theme = useSelector(selectMode);
   const [isExpanded, setisExpanded] = React.useState(false);
   const { pathname } = useLocation();
@@ -147,7 +143,6 @@ const NavBar = ({ Logo, callBack, closeDelay }) => {
 };
 
 NavBar.propTypes = propTypes;
-NavBar.defaultProps = defaultProps;
 // #endregion
 
 export default NavBar;

src/components/NavBar.jsx

@@ -49,9 +49,8 @@ const propTypes = {
   setExpanded: PropTypes.func.isRequired,
   setTheme: PropTypes.func.isRequired,
 };
-const defaultProps = { closeDelay: 250 };
 
-const ThemeToggle = ({ closeDelay, setExpanded, setTheme }) => {
+const ThemeToggle = ({ closeDelay = 250, setExpanded, setTheme }) => {
   const theme = useSelector(selectMode);
 
   const toggleTheme = () => {
@@ -85,7 +84,6 @@ const ThemeToggle = ({ closeDelay, setExpanded, setTheme }) => {
 };
 
 ThemeToggle.propTypes = propTypes;
-ThemeToggle.defaultProps = defaultProps;
 // #endregion
 
 export default ThemeToggle;

src/components/ThemeToggle.jsx

@@ -30,9 +30,8 @@ const propTypes = {
   size: PropTypes.oneOf(["h1", "h2"]),
   text: PropTypes.string.isRequired,
 };
-const defaultProps = { size: "h1" };
 
-const Title = ({ size, text }) => {
+const Title = ({ size = "h1", text }) => {
   return (
     <TitleDiv>
       {size === "h1" ? (
@@ -46,7 +45,6 @@ const Title = ({ size, text }) => {
 };
 
 Title.propTypes = propTypes;
-Title.defaultProps = defaultProps;
 // #endregion
 
 export default Title;