Radish alpha
r
radicle-explorer
Radicle web interface
Radicle
Git (anonymous pull)
Log in to clone via SSH
Commits ›
Refactor seed button
Rūdolfs Ošiņš committed 2 years ago
commit 2daa8e83a9855b0e51595f0274218469ce7e32cf
parent d216caec7d49c51222d8d40963b9fd91e4b671fc
2 files changed +50 -57
modified src/views/projects/Header/SeedButton.svelte
@@ -1,15 +1,60 @@
<script lang="ts">
+ 
  import * as modal from "@app/lib/modal";
+ 
  import { httpdStore, api } from "@app/lib/httpd";
+ 


  import Button from "@app/components/Button.svelte";

  import Command from "@app/components/Command.svelte";
+ 
  import ErrorModal from "@app/modals/ErrorModal.svelte";

  import ExternalLink from "@app/components/ExternalLink.svelte";

  import IconSmall from "@app/components/IconSmall.svelte";

  import Popover from "@app/components/Popover.svelte";
- 
  export let disabled: boolean;

  export let projectId: string;

  export let seedCount: number;

  export let seeding: boolean;
- 
  export let editSeeding: (() => Promise<void>) | undefined;
+
+ 
  let editSeedingInProgress = false;
+
+ 
  async function editSeeding() {
+ 
    if ($httpdStore.state === "authenticated") {
+ 
      try {
+ 
        editSeedingInProgress = true;
+ 
        if (seeding) {
+ 
          await api.stopSeedingById(projectId, $httpdStore.session.id);
+ 
        } else {
+ 
          await api.seedById(projectId, $httpdStore.session.id);
+ 
        }
+ 
        seeding = !seeding;
+ 
      } catch (error) {
+ 
        if (error instanceof Error) {
+ 
          modal.show({
+ 
            component: ErrorModal,
+ 
            props: {
+ 
              title: seeding
+ 
                ? "Stop seeding project failed"
+ 
                : "Seeding project failed",
+ 
              subtitle: [
+ 
                `There was an error while trying to ${
+ 
                  seeding ? "stop seeding" : "seed"
+ 
                } this project.`,
+ 
                "Check your radicle-httpd logs for details.",
+ 
              ],
+ 
              error: {
+ 
                message: error.message,
+ 
                stack: error.stack,
+ 
              },
+ 
            },
+ 
          });
+ 
        }
+ 
      } finally {
+ 
        editSeedingInProgress = false;
+ 
      }
+ 
    }
+ 
  }
+
+ 
  $: canEditSeeding =
+ 
    $httpdStore.state === "authenticated" &&
+ 
    $httpdStore.node.state === "running";

</script>



<style>
@@ -50,11 +95,11 @@


<Popover popoverPositionTop="2.5rem" popoverPositionRight="0">

  <Button
- 
    {disabled}
+ 
    disabled={editSeedingInProgress}

    slot="toggle"

    let:toggle

    on:click={async () => {
- 
      if (editSeeding) {
+ 
      if (canEditSeeding) {

        await editSeeding();

      } else {

        toggle();
@@ -67,7 +112,7 @@
      <span

        class="counter"

        class:seeding
- 
        class:disabled
+ 
        class:disabled={editSeedingInProgress}

        style:font-weight="var(--font-weight-regular)">

        {seedCount}

      </span>
modified src/views/projects/Source/ProjectNameHeader.svelte
@@ -1,14 +1,11 @@
<script lang="ts">

  import type { BaseUrl, Project } from "@httpd-client";
- 
  import * as modal from "@app/lib/modal";
- 
  import { httpdStore, api } from "@app/lib/httpd";

  import { twemoji } from "@app/lib/utils";



  import Badge from "@app/components/Badge.svelte";

  import CloneButton from "../Header/CloneButton.svelte";

  import CopyableId from "@app/components/CopyableId.svelte";
- 
  import ErrorModal from "@app/modals/ErrorModal.svelte";

  import InlineMarkdown from "@app/components/InlineMarkdown.svelte";

  import Link from "@app/components/Link.svelte";

  import IconSmall from "@app/components/IconSmall.svelte";
@@ -20,53 +17,6 @@
  export let seeding: boolean;

  export let preferredSeeds: string[];

  export let publicExplorer: string;
-
- 
  $: canEditSeeding =
- 
    session &&
- 
    $httpdStore.state === "authenticated" &&
- 
    $httpdStore.node.state === "running";
-
- 
  let editSeedingInProgress = false;
-
- 
  async function editSeeding() {
- 
    if ($httpdStore.state === "authenticated") {
- 
      try {
- 
        editSeedingInProgress = true;
- 
        if (seeding) {
- 
          await api.stopSeedingById(project.id, $httpdStore.session.id);
- 
        } else {
- 
          await api.seedById(project.id, $httpdStore.session.id);
- 
        }
- 
        seeding = !seeding;
- 
      } catch (error) {
- 
        if (error instanceof Error) {
- 
          modal.show({
- 
            component: ErrorModal,
- 
            props: {
- 
              title: seeding
- 
                ? "Stop seeding project failed"
- 
                : "Seeding project failed",
- 
              subtitle: [
- 
                `There was an error while trying to ${
- 
                  seeding ? "stop seeding" : "seed"
- 
                } this project.`,
- 
                "Check your radicle-httpd logs for details.",
- 
              ],
- 
              error: {
- 
                message: error.message,
- 
                stack: error.stack,
- 
              },
- 
            },
- 
          });
- 
        }
- 
      } finally {
- 
        editSeedingInProgress = false;
- 
      }
- 
    }
- 
  }
-
- 
  $: session =
- 
    $httpdStore.state === "authenticated" ? $httpdStore.session : undefined;

</script>



<style>
@@ -131,8 +81,6 @@
      <CloneButton {baseUrl} id={project.id} name={project.name} />

      <SeedButton

        {seeding}
- 
        disabled={editSeedingInProgress}
- 
        editSeeding={canEditSeeding ? editSeeding : undefined}

        seedCount={project.seeding}

        projectId={project.id} />

    </div>