Frontend: Updates Biome script

.github/workflows/runFrontendTests.yml

@@ -19,6 +19,23 @@ defaults:
     working-directory: frontend
 
 jobs:
+  code-quality:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+      - name: Setup Biome
+        uses: biomejs/setup-biome@v2
+        with:
+          version: latest
+      - name: Run Biome
+        run: |
+          echo "Running Biome"
+          echo "🚨 If this fails, run 'npm run cleanup' from your frontend/ local directory, add/commit, and push again."
+          echo "🔧 Also, please check your local pre-commit, as Biome should run on every local commit."
+          echo "See https://github.com/SatcherInstitute/health-equity-tracker?tab=readme-ov-file#install-node-and-pre-commit"
+          biome ci src/
+
   build_frontend:
     name: Builds frontend
     runs-on: ubuntu-latest
@@ -37,7 +54,6 @@ jobs:
           VITE_NODE_OPTIONS: '--max_old_space_size=4096'
         run: npx tsc --noEmit && npm run build:deploy_preview
 
-
   frontend_unit_tests:
     name: Runs frontend unit tests
     runs-on: ubuntu-latest
@@ -72,7 +88,9 @@ jobs:
             max_timeout: 180
 
   tests_e2e_netlify:
-    needs: tests_e2e_netlify_prepare
+    needs:
+      - tests_e2e_netlify_prepare
+      - code-quality
     name: Run E2E tests on deploy preview
     runs-on: ubuntu-latest
     if: github.event_name == 'pull_request'
@@ -88,7 +106,7 @@ jobs:
         run: npm ci
       - name: Install playwright deps
         run: npx playwright install --with-deps chromium
-      - name: run quicker E2E on DEPLOY_PREVIEW
+      - name: run E2E on DEPLOY_PREVIEW
         run: npx playwright test --project=E2E_NIGHTLY --workers 4
         # base url based on the GITHUB_PR_NUMBER +  NETLIFY_SITE_NAME
         env:
@@ -99,4 +117,4 @@ jobs:
         with:
           name: playwright-report
           path: frontend/playwright-report/
-          retention-days: 30
+          retention-days: 30

cspell.config.json

@@ -294,6 +294,7 @@
 		"IHME",
 		"IIS",
 		"iloc",
+		"img",
 		"inclusivity",
 		"influencers",
 		"INJ",
@@ -392,6 +393,7 @@
 		"mochl",
 		"moderna",
 		"Mosca",
+		"moz",
 		"MPA",
 		"MPS",
 		"MPsy",

frontend/package.json

@@ -80,6 +80,7 @@
 		"vitest": "^2.1.8"
 	},
 	"scripts": {
+		"cleanup": "npx @biomejs/biome check --write ./src",
 		"build:deploy_preview": "env-cmd -f .env.deploy_preview npm run build",
 		"build:development": "env-cmd -f .env.development npm run build",
 		"build:prod": "env-cmd -f .env.prod npm run build",
@@ -122,4 +123,4 @@
 			"last 1 safari version"
 		]
 	}
-}
+}

frontend/src/pages/Policy/policyComponents/CardLeftIcon.tsx

@@ -29,12 +29,12 @@ const CardLeftIcon: React.FC<CardLeftIconProps> = ({
           </p>
         </div>
         <div className='flex flex-col'>
-            <HetOverline text='Advocacy Experts Say' className='mb-0 mt-4'/>
+          <HetOverline text='Advocacy Experts Say' className='mb-0 mt-4' />
           <p className='text-small w-fit py-0 my-0'>{advice}</p>
         </div>
       </div>
     </li>
   )
 }
 
-export default CardLeftIcon
+export default CardLeftIcon

frontend/src/pages/Policy/policyComponents/FactCard.tsx

@@ -13,4 +13,4 @@ const FactCard: React.FC<FactCardProps> = ({ content }) => {
   )
 }
 
-export default FactCard
+export default FactCard

frontend/src/pages/Policy/policyComponents/ResourceSection.tsx

@@ -2,14 +2,24 @@ import type React from 'react'
 import ResourceItem from './ResourceItem'
 
 interface ResourceSectionProps {
-    id: string
-    icon: React.ReactNode
+  id: string
+  icon: React.ReactNode
+  title: string
+  description: string | JSX.Element
+  resources: {
     title: string
-    description: string | JSX.Element 
-    resources: { title: string; description: string | JSX.Element; link?: string }[]
-  }
+    description: string | JSX.Element
+    link?: string
+  }[]
+}
 
-const ResourceSection: React.FC<ResourceSectionProps> = ({ id, icon, title, description, resources }) => {
+const ResourceSection: React.FC<ResourceSectionProps> = ({
+  id,
+  icon,
+  title,
+  description,
+  resources,
+}) => {
   return (
     <section id={id}>
       <div className='flex flex-row w-full items-center rounded-md border border-solid border-methodologyGreen'>
@@ -23,12 +33,16 @@ const ResourceSection: React.FC<ResourceSectionProps> = ({ id, icon, title, desc
       <p>{description}</p>
       <ul className='list-none'>
         {resources.map((resource) => (
-          <ResourceItem key={resource.title} title={resource.title} description={resource.description} link={resource.link} />
-
+          <ResourceItem
+            key={resource.title}
+            title={resource.title}
+            description={resource.description}
+            link={resource.link}
+          />
         ))}
       </ul>
     </section>
   )
 }
 
-export default ResourceSection
+export default ResourceSection

frontend/src/pages/Policy/policyContent/CrisisOverviewContent.tsx

@@ -1,40 +1,54 @@
 import HetTermUnderline from '../../../styles/HetComponents/HetTermUnderline'
 
 export const gvaFacts = [
-	{
-		content: (
-			<>
-				In 2023, Atlanta experienced <HetTermUnderline>no fewer than six mass shootings</HetTermUnderline>, with each
-				event tragically claiming six lives and injuring 22 others, marking a
-				series of deliberate, targeted attacks that shook the community.
-			</>
-		),
-	},
+  {
+    content: (
+      <>
+        In 2023, Atlanta experienced{' '}
+        <HetTermUnderline>no fewer than six mass shootings</HetTermUnderline>,
+        with each event tragically claiming six lives and injuring 22 others,
+        marking a series of deliberate, targeted attacks that shook the
+        community.
+      </>
+    ),
+  },
 
-	{
-		content: (
-			<>
-				As of April 2024, firearms have injured four children in Atlanta,
-				raising the total to <HetTermUnderline>53 children injured</HetTermUnderline> since 2021,
-				underscoring an urgent need for protective measures.
-			</>
-		),
-	},
+  {
+    content: (
+      <>
+        As of April 2024, firearms have injured four children in Atlanta,
+        raising the total to{' '}
+        <HetTermUnderline>53 children injured</HetTermUnderline> since 2021,
+        underscoring an urgent need for protective measures.
+      </>
+    ),
+  },
 ]
 
 export const rocketFoundationFacts = [
-	{
-		content: (
-			<>
-				Gun violence in the U.S. is a growing crisis, claiming over 47,000 lives in 2021 alone, with <HetTermUnderline>more than half being homicides</HetTermUnderline>. This epidemic disproportionately affects people of color, women, and children, making guns the leading cause of death among American youth.
-			</>
-		),
-	},
-	{
-		content: (
-			<>
-				While the U.S. has an alarmingly high rate of gun-related homicides—22 times higher than in the European Union—<HetTermUnderline>this violence is concentrated in specific neighborhoods</HetTermUnderline>. By focusing our efforts on these areas, we can begin to solve the crisis one city at a time, starting with <HetTermUnderline>places like Atlanta</HetTermUnderline>.
-			</>
-		),
-	},
-]
+  {
+    content: (
+      <>
+        Gun violence in the U.S. is a growing crisis, claiming over 47,000 lives
+        in 2021 alone, with{' '}
+        <HetTermUnderline>more than half being homicides</HetTermUnderline>.
+        This epidemic disproportionately affects people of color, women, and
+        children, making guns the leading cause of death among American youth.
+      </>
+    ),
+  },
+  {
+    content: (
+      <>
+        While the U.S. has an alarmingly high rate of gun-related homicides—22
+        times higher than in the European Union—
+        <HetTermUnderline>
+          this violence is concentrated in specific neighborhoods
+        </HetTermUnderline>
+        . By focusing our efforts on these areas, we can begin to solve the
+        crisis one city at a time, starting with{' '}
+        <HetTermUnderline>places like Atlanta</HetTermUnderline>.
+      </>
+    ),
+  },
+]