Fix copying wrong ids when switching cob listing state — radicle-explorer

We don’t really need the clipboard prop. By switching between stats in patches and issue listings the clipboard props aren’t been recomputed.

Wrote a test that should make sure this doesn’t break in the future.

   import Icon from "./Icon.svelte";
   export let id: string;
   export let clipboard: string = id;
   export let shorten: boolean = true;
   export let style: "oid" | "commit" | "none" = "oid";
   export let ariaLabel: string | undefined = undefined;

   }, 1000);
   async function copy() {
     await toClipboard(clipboard);
     await toClipboard(id);
     icon = "checkmark";
     tooltip = "Copied to clipboard";
     restoreIcon();

 <div style:word-break="break-word">
   <!--prettier-ignore-->
   <Id ariaLabel="node-id" shorten={false} id={clipboard} {clipboard}>
   <Id ariaLabel="node-id" shorten={false} id={clipboard}>
     {#if node.config?.externalAddresses.length}
       {truncateId(node.id)}@<wbr />{node.config?.externalAddresses[0]}
     {:else}

 <div class="item">
   <div style:white-space="nowrap">User Agent</div>
   <Id
     ariaLabel="agent"
     id={agent}
     clipboard={agent}
     shorten={false}
     style="none">
   <Id ariaLabel="agent" id={agent} shorten={false} style="none">
     <div class="agent">
       <div class="txt-overflow">{agent}</div>
     </div>

 import type { Page } from "@playwright/test";
 import {
   expect,
   sourceBrowsingUrl,
   sourceBrowsingRid,
   test,
   cobUrl,
 } from "@tests/support/fixtures.js";
 async function expectClipboard(content: string, page: Page) {
   const clipboardContent = await page.evaluate<string>(
     "navigator.clipboard.readText()",
   );
   expect(clipboardContent).toBe(content);
 }
 // We explicitly run all clipboard tests withing the context of a single test
 // so that we don't run into race conditions, because there is no way to isolate
 // the clipboard in Playwright yet.

     test.skip();
   }
   async function expectClipboard(content: string) {
     const clipboardContent = await page.evaluate<string>(
       "navigator.clipboard.readText()",
     );
     expect(clipboardContent).toBe(content);
   }
   await page.goto(sourceBrowsingUrl);
   // Reset system clipboard to a known state.

   // Repo ID.
   {
     await page.getByLabel("repo-id").click();
     const clipboardContent = await page.evaluate<string>(
       "navigator.clipboard.readText()",
     );
     expect(clipboardContent).toBe(sourceBrowsingRid);
     await expectClipboard(sourceBrowsingRid);
   }
   // `rad clone` URL.
   {
     await page.getByRole("button", { name: "Clone" }).first().click();
     await page.getByText("rad clone").locator(".clipboard").first().click();
     await expectClipboard(`rad clone ${sourceBrowsingRid}`, page);
     await expectClipboard(`rad clone ${sourceBrowsingRid}`);
   }
   // `git clone` URL.

         "rad:",
         "",
       )}.git source-browsing`,
       page,
     );
   }
   // After switching the patch or issue listing the `<Id>` components should return new COB ids.
   {
     await page.goto(`${cobUrl}/patches`);
     await page.getByRole("button", { name: "59a0821", exact: true }).click();
     await expectClipboard("59a0821edc73630bce540596cffc7854da557365");
     await page.getByLabel("filter-dropdown").click();
     await page.getByRole("button", { name: "Draft" }).click();
     await page.getByRole("button", { name: "783d33c", exact: true }).click();
     await expectClipboard("783d33c5b14e13234d4d7affa98bd0b52d1b1ea3");
   }
   // Clear the system clipboard contents so developers don't wonder why there's
   // random stuff in their clipboard after running tests.
   await page.evaluate<string>("navigator.clipboard.writeText('')");