Merge pull request #247 from CodeForPhilly/fix/home-browse-projects

fix(web): "Browse all N projects" under Join a Project

Author: themightychris

apps/web/src/screens/Home.tsx

@@ -152,7 +152,7 @@ export function Home() {
         )}
         <div className="mt-6 text-right">
           <Link to="/projects" className="text-primary hover:underline">
-            See all {totalProjects ?? ''} projects →
+            {totalProjects === null ? 'Browse all projects →' : `Browse all ${totalProjects} projects →`}
           </Link>
         </div>
       </section>

apps/web/tests/Home.test.tsx

@@ -57,6 +57,16 @@ describe('Home', () => {
     });
   });
 
+  it('links to the full project list with its count', async () => {
+    renderScreen(
+      <AuthProvider>
+        <Home />
+      </AuthProvider>,
+    );
+
+    expect(await screen.findByRole('link', { name: 'Browse all 42 projects →' })).toHaveAttribute('href', '/projects');
+  });
+
   it('shows the get-involved cards', async () => {
     renderScreen(
       <AuthProvider>

plans/home-browse-projects.md

@@ -0,0 +1,45 @@
+---
+status: done
+depends: [home-page-alive]
+specs:
+  - specs/screens/home.md
+issues: []
+pr: 247
+---
+
+# Plan: "Browse all N projects" on the home page
+
+## Scope
+
+Chris: "See all 274 projects →" under Join a Project should say "browse"
+or "search". The link opens the searchable, filterable project list.
+
+**In:** "Browse all N projects →", falling back to "Browse all projects →"
+until the count loads (it rendered a double space before). **Out:** other
+"See all" links (events, activity), which open plain lists.
+
+## Implements
+
+- [screens/home.md](../specs/screens/home.md) — Featured projects.
+
+## Approach
+
+One string in `Home.tsx`; a test on the link's text and target.
+
+## Validation
+
+- [x] `npm run type-check && npm run lint && npm test` clean.
+- [x] Home test: "Browse all 42 projects →" links to `/projects`.
+
+## Risks / unknowns
+
+- None.
+
+## Notes
+
+- "Browse" over "Search": the page leads with the list and its filters;
+  search is one of several ways in.
+
+## Follow-ups
+
+- **None.**

specs/screens/home.md

@@ -56,7 +56,7 @@ When there are no upcoming events the strip is **hidden entirely** (unlike the f
   - Title
   - Tagline = `project.summary`, or first line of `overviewExcerpt` if `summary` is null
   - Click: links to `/projects/<slug>`
-- Below the grid: "See all 268 projects →" link to `/projects`. The count is `metadata.totalItems` from a separate cheap `HEAD`-style call (or piggybacked from the featured response — implementer's call).
+- Below the grid: "Browse all 268 projects →" link to `/projects`, where the list can be searched and filtered ("Browse all projects →" until the count loads). The count is `metadata.totalItems` from a separate cheap `HEAD`-style call (or piggybacked from the featured response — implementer's call).
 
 
 ### 3. Get involved