Reinstate the user avatar as home button — radicle-desktop

Previous patch got merged before we settled whether it’s the right approach.

 <script lang="ts">
   import type { Config } from "@bindings/config/Config";
   import type { Snippet } from "svelte";
   import * as router from "@app/lib/router";
   import { authorForNodeId } from "@app/lib/utils";
   import { nodeRunning } from "@app/lib/events";
   import Avatar from "./Avatar.svelte";
   import Border from "./Border.svelte";
   import Icon from "./Icon.svelte";
   import NakedButton from "./NakedButton.svelte";
   import NodeId from "./NodeId.svelte";
   import Popover from "./Popover.svelte";
   const activeRouteStore = router.activeRouteStore;
   interface Props {
     config: Config;
     publicKey: string;
     center?: Snippet;
   }
   const { center, config }: Props = $props();
   const { center, publicKey }: Props = $props();
 </script>
 <style>

             void router.push({ resource: "home" });
           }}
           stylePadding="0 4px">
           <Icon name="home" />
           <Avatar {publicKey} />
         </NakedButton>
         <NakedButton
           variant="ghost"

               styleMinWidth="20rem"
               styleAlignItems="flex-start"
               styleFlexDirection="column">
               <div class="txt-small global-flex">
                 Authenticated as:
                 <NodeId
                   {...authorForNodeId({
                     did: config.publicKey,
                     alias: config.alias,
                   })} />
               </div>
               <div class="txt-small txt-missing">
                 {#if $nodeRunning}
                   Your node is up and running, your changes will be synced
                   automatically.
                 {:else}
                   Your node is stopped, to sync changes with the network start
                   your node.
                   Your node is not running, changes you make are safe but won't
                   be announced.
                 {/if}
               </div>
             </Border>

   }}
   hideSidebar
   styleSecondColumnOverflow="visible"
   {config}>
   publicKey={config.publicKey}>
   {#snippet headerCenter()}
     <CopyableId id={config.publicKey} />
   {/snippet}

   }
 </style>
 <Layout hideSidebar styleSecondColumnOverflow="visible" {config}>
 <Layout
   hideSidebar
   styleSecondColumnOverflow="visible"
   publicKey={config.publicKey}>
   {#snippet headerCenter()}
     <CopyableId id={config.publicKey} />
   {/snippet}

   }
 </style>
 <Layout {config}>
 <Layout publicKey={config.publicKey}>
   {#snippet sidebar()}
     <Sidebar activeTab="issues" rid={repo.rid} />
   {/snippet}

   interface Props {
     children: Snippet;
     config: Config;
     publicKey: string;
     headerCenter?: Snippet;
     secondColumn: Snippet;
     sidebar?: Snippet;

   const {
     children,
     config,
     publicKey,
     headerCenter = undefined,
     secondColumn,
     sidebar = undefined,

 <div class="layout">
   <div class="header">
     <Header {config} center={headerCenter}></Header>
     <Header {publicKey} center={headerCenter}></Header>
   </div>
   {#if sidebar}