Merge pull request #18 from rrigato/dev

Image in About component section
rrigato · Nov 25, 2023 · c1232fd · c1232fd
2 parents 3581482 + 418c7ec
commit c1232fd
Show file tree

Hide file tree

Showing 4 changed files with 43 additions and 6 deletions.
diff --git a/static/js/About.jsx b/static/js/About.jsx
@@ -1,6 +1,6 @@
-import React, { useState } from 'react';
+import React from 'react';
 import '../css/homepageSection.css';
-
+import aboutPhoto from '../img/aboutPhoto.jpg';
 
 /**Details about the website
  * 
@@ -12,20 +12,28 @@ export function About(){
             <div>
                 <ul>
                     <h3>What do I need to know about this website?</h3>
-                    <li>
+                    <li>Website
                         <a href='https://github.com/rrigato/homepage'>source code </a>
                     </li>
                     <li>I strive to be embarrassed by the quality of the architecture of any application I have built that is more than a year old. </li>
-                    <li>Strive to constantly be improving your craft.</li>
+                    <li>Endeavor to constantly be honing your craft.</li>
                     <li>How do you practice your skills in the same way a musician practices cords?</li>
 
                     <li>This webiste went from a Java EE2 web app hosted in google app engine 
-                        all the way to serverless web app deployed to AWS</li>
+                        all the way to a serverless web app deployed to AWS</li>
                     <li>Run a <code>git log --before="2018-01-01"</code> on the source code for a stroll down memory lane!</li>
 
                     <li>The world's largest tuned mass damper is at the 
                         <a href='https://en.wikipedia.org/wiki/Tuned_mass_damper'>Taipei 101</a>
                     </li>
+                    <h3>Obilgatory socially awkard photo of the engineer who built this website?</h3>
+                    <div>
+                        <img
+                            alt='Image of website author' 
+                            src={aboutPhoto}
+
+                        ></img>
+                    </div>
                 </ul>
             </div>
         </div>

diff --git a/static/tests/About.test.js b/static/tests/About.test.js
@@ -10,11 +10,15 @@ describe('About displayed on screen', () => {
     test('About section', async () => {        
 
 
-        const {getAllByRole} = render(<About/>);
+        const {getAllByRole, getByRole} = render(<About/>);
 
 
         const numProjectHeaders = getAllByRole(
             'heading'
         );
+        const aboutImage = getByRole(
+            'img'
+        );
+        expect(numProjectHeaders.length).toBe(2);
     });
 });
diff --git a/static/tests/BookRecommendations.test.js b/static/tests/BookRecommendations.test.js
@@ -0,0 +1,21 @@
+import {  render } from '@testing-library/react';
+// import { BookRecommendations } from '../js/BookRecommendations.jsx';
+
+
+describe('BookRecommendations displayed on screen', () => {
+    afterEach(() => {
+        jest.resetAllMocks();
+    });
+
+    test.skip('BookRecommendations section', async () => {        
+
+
+        const {getAllByRole, getByRole} = render(<BookRecommendations/>);
+
+
+        const numHeaders = getAllByRole(
+            'heading'
+        );
+        expect(numHeaders.length).toBe(1);
+    });
+});
diff --git a/static/webpack.config.js b/static/webpack.config.js
@@ -13,6 +13,10 @@ module.exports = {
                 test: /\.html$/i,
                 loader: 'html-loader',
             },
+            {
+                test: /\.jpg$/i,
+                type: 'asset/resource',
+            },
             {
                 test: /\.(?:js|jsx)$/,
                 exclude: /node_modules/,