From 45830f6cd91f71c11508c238ebe2f1e112f289c3 Mon Sep 17 00:00:00 2001
From: Sebastian Martinez <me@sebastinez.dev>
Date: Mon, 28 Aug 2023 11:14:15 +0200
Subject: [PATCH] Show local projects instead of network to landing page, if
 available

Signed-off-by: Sebastian Martinez <me@sebastinez.dev>
---
 src/App.svelte                   |  3 +--
 src/lib/httpd.ts                 |  4 ++--
 src/views/home/Index.svelte      | 12 ++++++++++--
 src/views/home/router.ts         | 13 ++++++++++++-
 tests/e2e/landingPage.spec.ts    |  2 +-
 tests/support/fixtures.ts        |  4 ++--
 tests/visual/landingPage.spec.ts |  2 +-
 7 files changed, 29 insertions(+), 11 deletions(-)

diff --git a/src/App.svelte b/src/App.svelte
index d966eede5..b130181db 100644
--- a/src/App.svelte
+++ b/src/App.svelte
@@ -28,8 +28,7 @@
 
   const activeRouteStore = router.activeRouteStore;
 
-  void router.loadFromLocation();
-  httpd.initialize();
+  void httpd.initialize().finally(() => void router.loadFromLocation());
 
   if (!window.VITEST && !window.PLAYWRIGHT && import.meta.env.PROD) {
     const plausible = Plausible({
diff --git a/src/lib/httpd.ts b/src/lib/httpd.ts
index c005f1685..7a6004a4c 100644
--- a/src/lib/httpd.ts
+++ b/src/lib/httpd.ts
@@ -147,7 +147,7 @@ function pollSession() {
   pollHttpdStateHandle = window.setInterval(() => checkState(), 10_000);
 }
 
-export function initialize() {
+export async function initialize() {
   // Sync session state changes with other open tabs and windows.
   addEventListener("storage", event => {
     if (
@@ -159,7 +159,7 @@ export function initialize() {
     }
   });
 
-  void checkState();
+  await checkState();
 
   // Properly clean up setInterval and restart session polling when Vite
   // performs hot module reload on file changes.
diff --git a/src/views/home/Index.svelte b/src/views/home/Index.svelte
index 1715d792e..5e76fa348 100644
--- a/src/views/home/Index.svelte
+++ b/src/views/home/Index.svelte
@@ -1,12 +1,15 @@
 <script lang="ts">
   import type { ProjectBaseUrlActivity } from "./router";
 
+  import { api } from "@app/lib/httpd";
   import { twemoji } from "@app/lib/utils";
 
   import Link from "@app/components/Link.svelte";
   import ProjectCard from "@app/components/ProjectCard.svelte";
 
   export let projects: ProjectBaseUrlActivity[];
+
+  $: localProjects = projects[0]?.baseUrl === api.baseUrl;
 </script>
 
 <style>
@@ -61,8 +64,13 @@
 
   {#if projects.length > 0}
     <div class="heading">
-      Explore <span class="txt-bold">projects</span>
-      on the Radicle network.
+      {#if localProjects}
+        Explore <span class="txt-bold">projects</span>
+        on your local node.
+      {:else}
+        Explore <span class="txt-bold">projects</span>
+        on the Radicle network.
+      {/if}
     </div>
 
     <div class="projects">
diff --git a/src/views/home/router.ts b/src/views/home/router.ts
index 3ff4e854c..5b2a62eeb 100644
--- a/src/views/home/router.ts
+++ b/src/views/home/router.ts
@@ -2,6 +2,9 @@ import type { LoadErrorRoute } from "@app/lib/router/definitions";
 import type { ProjectBaseUrl } from "@app/lib/search";
 import type { WeeklyActivity } from "@app/lib/commit";
 
+import { get } from "svelte/store";
+
+import { api, httpdStore } from "@app/lib/httpd";
 import { config } from "@app/lib/config";
 import { getProjectsFromNodes } from "@app/lib/search";
 import { loadProjectActivity } from "@app/lib/commit";
@@ -22,7 +25,15 @@ export interface HomeLoadedRoute {
 export async function loadHomeRoute(): Promise<
   HomeLoadedRoute | LoadErrorRoute
 > {
-  const projects = await getProjectsFromNodes(config.projects.pinned);
+  let projects: ProjectBaseUrl[] = [];
+  if (get(httpdStore).state !== "stopped") {
+    projects = (await api.project.getAll()).map(project => ({
+      project,
+      baseUrl: api.baseUrl,
+    }));
+  } else {
+    projects = await getProjectsFromNodes(config.projects.pinned);
+  }
   const results = await Promise.all(
     projects.map(async projectNode => {
       const activity = await loadProjectActivity(
diff --git a/tests/e2e/landingPage.spec.ts b/tests/e2e/landingPage.spec.ts
index fb69d1b50..447b7f0ff 100644
--- a/tests/e2e/landingPage.spec.ts
+++ b/tests/e2e/landingPage.spec.ts
@@ -13,7 +13,7 @@ test("show pinned projects", async ({ page }) => {
   await page.addInitScript(appConfigWithFixture);
   await page.goto("/");
   await expect(
-    page.getByText("Explore projects on the Radicle network."),
+    page.getByText("Explore projects on your local node."),
   ).toBeVisible();
 
   // Shows pinned project name.
diff --git a/tests/support/fixtures.ts b/tests/support/fixtures.ts
index 07db15f58..e3740fdb0 100644
--- a/tests/support/fixtures.ts
+++ b/tests/support/fixtures.ts
@@ -226,11 +226,11 @@ function log(text: string, label: string, outputLog: Stream.Writable) {
   }
 }
 
-export function appConfigWithFixture() {
+export function appConfigWithFixture(defaultLocalHttpdPort = 8081) {
   window.APP_CONFIG = {
     nodes: {
       defaultHttpdPort: 8081,
-      defaultLocalHttpdPort: 8081,
+      defaultLocalHttpdPort: defaultLocalHttpdPort,
       defaultHttpdScheme: "http",
       defaultNodePort: 8776,
       pinned: [
diff --git a/tests/visual/landingPage.spec.ts b/tests/visual/landingPage.spec.ts
index c6c8321b7..b3a849e4a 100644
--- a/tests/visual/landingPage.spec.ts
+++ b/tests/visual/landingPage.spec.ts
@@ -36,7 +36,7 @@ test("load error", async ({ page }) => {
     route => route.fulfill({ status: 500 }),
   );
 
-  await page.addInitScript(appConfigWithFixture);
+  await page.addInitScript(appConfigWithFixture, 8090);
   await page.goto("/", { waitUntil: "networkidle" });
   await expect(page).toHaveScreenshot();
 });