From bc25367ecbdccf08ee3fd079c3ba777384b0847f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?R=C5=ABdolfs=20O=C5=A1i=C5=86=C5=A1?= <rudolfs@osins.org>
Date: Tue, 27 Jun 2023 13:52:32 +0200
Subject: [PATCH] Add remote count to PeerSelector
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: Rūdolfs Ošiņš <rudolfs@osins.org>
---
 src/lib/pluralize.ts                   |  7 ++++---
 src/views/projects/PeerSelector.svelte | 11 +++++------
 2 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/src/lib/pluralize.ts b/src/lib/pluralize.ts
index f2672ead5..e28f2f028 100644
--- a/src/lib/pluralize.ts
+++ b/src/lib/pluralize.ts
@@ -1,11 +1,12 @@
 export const pluralRules = {
+  commit: "commits",
+  contributor: "contributors",
+  deletion: "deletions",
   file: "files",
   insertion: "insertions",
-  deletion: "deletions",
-  commit: "commits",
   issue: "issues",
-  contributor: "contributors",
   patch: "patches",
+  remote: "remotes",
 } as const;
 
 export function pluralize(
diff --git a/src/views/projects/PeerSelector.svelte b/src/views/projects/PeerSelector.svelte
index d9fbab524..7487f8014 100644
--- a/src/views/projects/PeerSelector.svelte
+++ b/src/views/projects/PeerSelector.svelte
@@ -2,6 +2,7 @@
   import type { Remote } from "@httpd-client";
 
   import { formatNodeId, truncateId } from "@app/lib/utils";
+  import { pluralize } from "@app/lib/pluralize";
 
   import Avatar from "@app/components/Avatar.svelte";
   import Badge from "@app/components/Badge.svelte";
@@ -32,14 +33,11 @@
     font-family: var(--font-family-monospace);
   }
   .selector .peer {
-    padding: 0.5rem;
+    padding: 0.5rem 0.75rem;
     color: var(--color-secondary);
     background-color: var(--color-secondary-2);
     border-radius: var(--border-radius-small);
   }
-  .selected {
-    padding: 0.5rem 0.75rem !important;
-  }
   .selector .peer.not-allowed {
     cursor: not-allowed;
   }
@@ -71,9 +69,10 @@
 
 <Floating>
   <div slot="toggle" class="selector" title="Change peer">
-    <div class="stat peer" class:selected={peer} class:not-allowed={!peers}>
+    <div class="stat peer" class:not-allowed={!peers}>
       {#if !peer}
-        <Icon size="small" name="fork" />
+        <Icon size="small" name="fork" />{peers.length}
+        {pluralize("remote", peers.length)}
       {/if}
       {#if meta}
         <span class="avatar-id">