From 13e417c920dcc5529c2d021a75a5b355f2beea5c Mon Sep 17 00:00:00 2001
From: James C-D <51571627+jamescd18@users.noreply.github.com>
Date: Fri, 17 Jun 2022 10:26:13 -0400
Subject: [PATCH 1/4] #652 - update home page useful links

---
 .../useful-links/useful-links.test.tsx        |  6 ++--
 .../HomePage/useful-links/useful-links.tsx    | 29 +++++++++++--------
 2 files changed, 20 insertions(+), 15 deletions(-)

diff --git a/src/frontend/pages/HomePage/useful-links/useful-links.test.tsx b/src/frontend/pages/HomePage/useful-links/useful-links.test.tsx
index 0a20c5b5..cdbc65e6 100644
--- a/src/frontend/pages/HomePage/useful-links/useful-links.test.tsx
+++ b/src/frontend/pages/HomePage/useful-links/useful-links.test.tsx
@@ -23,8 +23,8 @@ describe('useful links component', () => {
 
   it('renders links', () => {
     renderComponent();
-    expect(screen.getByText(/Personal purchasing guidelines/i)).toBeInTheDocument();
-    expect(screen.getByText(/Procurement form/i)).toBeInTheDocument();
-    expect(screen.getByText(/Part numbering spreadsheet/i)).toBeInTheDocument();
+    expect(screen.getByText(/Personal Purchasing Guidelines/i)).toBeInTheDocument();
+    expect(screen.getByText(/Procurement Form/i)).toBeInTheDocument();
+    expect(screen.getAllByText(/Guidelines/i).length).toEqual(4);
   });
 });
diff --git a/src/frontend/pages/HomePage/useful-links/useful-links.tsx b/src/frontend/pages/HomePage/useful-links/useful-links.tsx
index 6d660596..8879bdd6 100644
--- a/src/frontend/pages/HomePage/useful-links/useful-links.tsx
+++ b/src/frontend/pages/HomePage/useful-links/useful-links.tsx
@@ -4,36 +4,41 @@
  *
  */
 
+import { Col, Container, Row } from 'react-bootstrap';
 import { linkPipe } from '../../../../shared/pipes';
 import PageBlock from '../../../layouts/page-block/page-block';
-import { Col, Container, Row } from 'react-bootstrap';
 import styles from './useful-links.module.css';
 
-// React-bootstrap grid documentation: https://react-bootstrap.github.io/layout/grid/
 const UsefulLinks: React.FC = () => {
   const financeLinks = [
     linkPipe(
-      'Personal purchasing guidelines',
+      'Personal Purchasing Guidelines',
       'https://docs.google.com/document/d/1M5Ldy9L1BifBo18tdKpv3CH-frRneyEK26hUXbtMg7Q/edit'
     ),
-    linkPipe('Procurement Form', 'https://forms.gle/6ztRoa1iL7p1KHwP6'),
     linkPipe(
-      'Reimbursement guidelines',
+      'Reimbursement Guidelines',
       'https://docs.google.com/document/d/1HvLnVNzZTftgoAXppIEp-gTmUBQGt-V6n97prziWWrs/edit'
-    )
+    ),
+    linkPipe('Procurement Form', 'https://forms.gle/6ztRoa1iL7p1KHwP6')
   ];
 
   const otherLinks = [
     linkPipe(
-      'Part numbering spreadsheet',
-      'https://docs.google.com/spreadsheets/d/1av0ReONZF3r82kCvkUEGl3uue4jfQgbw-KQDZnsejPQ/edit'
+      'McMaster Order Sheet',
+      'https://docs.google.com/spreadsheets/d/1kqpnw8jZDx2GO5NFUtqefRXqT1XX46iMx5ZI4euPJgY/edit'
+    ),
+    linkPipe(
+      'Project Update Log',
+      'https://docs.google.com/document/d/1w0B6upZRY28MlbVA4hyU3X_NRNP0cagmLWqjHn6B8OA/edit'
     ),
     linkPipe(
-      'McMaster order sheet',
-      'https://docs.google.com/spreadsheets/d/1kqpnw8jZDx2GO5NFUtqefRXqT1XX46iMx5ZI4euPJgY/edit'
+      'Part Numbering Guidelines',
+      'https://docs.google.com/document/d/1Y8IXCvYjXP3RBj6h4-xLCHXVLW5R6pi3-4i5SYMKtZY/edit'
     ),
-    linkPipe('Individual Member Goals Form', 'https://forms.gle/MAZJSFcMBjn44p3F6'),
-    linkPipe('Manufacturing Request Form', 'https://forms.gle/vJmTRt2xnzGa7akb8')
+    linkPipe(
+      'Hardware Guidelines',
+      'https://docs.google.com/document/d/1OD1d1VaIEHCwiFCuU7wfwAPu-UA--0_QzbyJjBsexwg/edit'
+    )
   ];
 
   return (

From 3724f61b191098f5971a2193d1cfadf379010f91 Mon Sep 17 00:00:00 2001
From: James C-D <51571627+jamescd18@users.noreply.github.com>
Date: Fri, 17 Jun 2022 10:27:22 -0400
Subject: [PATCH 2/4] #652 - shrink top padding welcome home page

---
 src/frontend/pages/HomePage/home.module.css | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/frontend/pages/HomePage/home.module.css b/src/frontend/pages/HomePage/home.module.css
index c8deba6a..f63ebc65 100644
--- a/src/frontend/pages/HomePage/home.module.css
+++ b/src/frontend/pages/HomePage/home.module.css
@@ -5,5 +5,5 @@
 
 .title {
   text-align: center;
-  padding-top: 2em;
+  padding-top: 1em;
 }

From 2735f51a70af576b92ea4d65fafd93cdc813d4b5 Mon Sep 17 00:00:00 2001
From: James C-D <51571627+jamescd18@users.noreply.github.com>
Date: Fri, 17 Jun 2022 10:53:41 -0400
Subject: [PATCH 3/4] #734 - increase size of icon link pipe icons

---
 src/shared/pipes.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/shared/pipes.tsx b/src/shared/pipes.tsx
index eb3917b5..0eababcd 100644
--- a/src/shared/pipes.tsx
+++ b/src/shared/pipes.tsx
@@ -28,7 +28,7 @@ export const linkPipe = (description: string, link: string): ReactElement => {
 export const iconLinkPipe = (icon: IconProp, description: string, link: string) => {
   return (
     <div className="d-flex flex-row align-items-center">
-      <FontAwesomeIcon icon={icon} size="1x" className="pr-1" />
+      <FontAwesomeIcon icon={icon} size="lg" className="pr-1" />
       {linkPipe(description, link)}
     </div>
   );

From 58f4e777558f3b3b44c5aaaa968849470e1de02d Mon Sep 17 00:00:00 2001
From: James C-D <51571627+jamescd18@users.noreply.github.com>
Date: Fri, 17 Jun 2022 11:04:12 -0400
Subject: [PATCH 4/4] #734 - enhance to icon link pipes with responsive layout

---
 .../useful-links/useful-links.test.tsx        |  4 +-
 .../HomePage/useful-links/useful-links.tsx    | 64 ++++++++++---------
 2 files changed, 34 insertions(+), 34 deletions(-)

diff --git a/src/frontend/pages/HomePage/useful-links/useful-links.test.tsx b/src/frontend/pages/HomePage/useful-links/useful-links.test.tsx
index cdbc65e6..fb17a93c 100644
--- a/src/frontend/pages/HomePage/useful-links/useful-links.test.tsx
+++ b/src/frontend/pages/HomePage/useful-links/useful-links.test.tsx
@@ -17,13 +17,11 @@ describe('useful links component', () => {
   it('renders headers', () => {
     renderComponent();
     expect(screen.getByText(/Useful Links/i)).toBeInTheDocument();
-    expect(screen.getByText(/Finance/i)).toBeInTheDocument();
-    expect(screen.getByText(/Other/i)).toBeInTheDocument();
   });
 
   it('renders links', () => {
     renderComponent();
-    expect(screen.getByText(/Personal Purchasing Guidelines/i)).toBeInTheDocument();
+    expect(screen.getByText(/Purchasing Guidelines/i)).toBeInTheDocument();
     expect(screen.getByText(/Procurement Form/i)).toBeInTheDocument();
     expect(screen.getAllByText(/Guidelines/i).length).toEqual(4);
   });
diff --git a/src/frontend/pages/HomePage/useful-links/useful-links.tsx b/src/frontend/pages/HomePage/useful-links/useful-links.tsx
index 8879bdd6..561658bb 100644
--- a/src/frontend/pages/HomePage/useful-links/useful-links.tsx
+++ b/src/frontend/pages/HomePage/useful-links/useful-links.tsx
@@ -4,66 +4,68 @@
  *
  */
 
+import {
+  faCoins,
+  faReceipt,
+  faHandHoldingUsd,
+  faDollarSign,
+  faFileAlt,
+  faSortNumericDown,
+  faCogs
+} from '@fortawesome/free-solid-svg-icons';
 import { Col, Container, Row } from 'react-bootstrap';
-import { linkPipe } from '../../../../shared/pipes';
+import { iconLinkPipe } from '../../../../shared/pipes';
 import PageBlock from '../../../layouts/page-block/page-block';
-import styles from './useful-links.module.css';
+import './useful-links.module.css';
 
 const UsefulLinks: React.FC = () => {
-  const financeLinks = [
-    linkPipe(
-      'Personal Purchasing Guidelines',
+  const links = [
+    iconLinkPipe(
+      faCoins,
+      'Purchasing Guidelines',
       'https://docs.google.com/document/d/1M5Ldy9L1BifBo18tdKpv3CH-frRneyEK26hUXbtMg7Q/edit'
     ),
-    linkPipe(
+    iconLinkPipe(
+      faHandHoldingUsd,
       'Reimbursement Guidelines',
       'https://docs.google.com/document/d/1HvLnVNzZTftgoAXppIEp-gTmUBQGt-V6n97prziWWrs/edit'
     ),
-    linkPipe('Procurement Form', 'https://forms.gle/6ztRoa1iL7p1KHwP6')
-  ];
-
-  const otherLinks = [
-    linkPipe(
+    iconLinkPipe(faDollarSign, 'Procurement Form', 'https://forms.gle/6ztRoa1iL7p1KHwP6'),
+    iconLinkPipe(
+      faReceipt,
       'McMaster Order Sheet',
       'https://docs.google.com/spreadsheets/d/1kqpnw8jZDx2GO5NFUtqefRXqT1XX46iMx5ZI4euPJgY/edit'
     ),
-    linkPipe(
+    iconLinkPipe(
+      faFileAlt,
       'Project Update Log',
       'https://docs.google.com/document/d/1w0B6upZRY28MlbVA4hyU3X_NRNP0cagmLWqjHn6B8OA/edit'
     ),
-    linkPipe(
+    iconLinkPipe(
+      faSortNumericDown,
       'Part Numbering Guidelines',
       'https://docs.google.com/document/d/1Y8IXCvYjXP3RBj6h4-xLCHXVLW5R6pi3-4i5SYMKtZY/edit'
     ),
-    linkPipe(
+    iconLinkPipe(
+      faCogs,
       'Hardware Guidelines',
       'https://docs.google.com/document/d/1OD1d1VaIEHCwiFCuU7wfwAPu-UA--0_QzbyJjBsexwg/edit'
     )
   ];
 
+  const allColsStyle = 'mb-2';
   return (
     <PageBlock
       title={'Useful Links'}
       headerRight={<></>}
       body={
-        <Container fluid className={styles.linksContainer}>
+        <Container fluid>
           <Row>
-            <Col md>
-              <h4>Finance</h4>
-              <ul>
-                {financeLinks.map((link, idx) => (
-                  <li key={idx}>{link}</li>
-                ))}
-              </ul>
-            </Col>
-            <Col md>
-              <h4>Other</h4>
-              <ul>
-                {otherLinks.map((link, idx) => (
-                  <li key={idx}>{link}</li>
-                ))}
-              </ul>
-            </Col>
+            {links.map((link) => (
+              <Col className={allColsStyle} xs={6} sm={6} md={4} lg={3} xl={2}>
+                {link}
+              </Col>
+            ))}
           </Row>
         </Container>
       }