cbe1fa5 Simplify and align project view props — radicle-explorer

modified src/views/projects/Issue.svelte

@@ -1,5 +1,5 @@

 <script lang="ts">
   import type { BaseUrl, Issue, IssueState } from "@httpd-client";
   import type { BaseUrl, Issue, IssueState, Project } from "@httpd-client";
   import type { IssueUpdateAction } from "@httpd-client/lib/project/issue";
   import type { Session } from "@app/lib/httpd";

@@ -27,10 +27,9 @@

   export let issue: Issue;
   export let baseUrl: BaseUrl;
   export let projectId: string;
   export let projectHead: string;
   export let project: Project;
   const rawPath = utils.getRawBasePath(projectId, baseUrl, projectHead);
   const rawPath = utils.getRawBasePath(project.id, baseUrl, project.head);
   const api = new HttpdClient(baseUrl);
   $: groupedReactions = issue.discussion[0].reactions.reduce(

@@ -54,7 +53,7 @@

   }: CustomEvent<{ id: string; body: string }>) {
     if ($httpdStore.state === "authenticated" && reply.body.trim().length > 0) {
       const status = await updateIssue(
         projectId,
         project.id,
         issue.id,
         {
           type: "thread",

@@ -64,7 +63,7 @@

         api,
       );
       if (status === "success") {
         issue = await refreshIssue(projectId, issue, api);
         issue = await refreshIssue(project.id, issue, api);
       }
     }
   }

@@ -72,14 +71,14 @@

   async function createComment(body: string) {
     if ($httpdStore.state === "authenticated" && body.trim().length > 0) {
       const status = await updateIssue(
         projectId,
         project.id,
         issue.id,
         { type: "thread", action: { type: "comment", body } },
         $httpdStore.session,
         api,
       );
       if (status === "success") {
         issue = await refreshIssue(projectId, issue, api);
         issue = await refreshIssue(project.id, issue, api);
       }
     }
   }

@@ -91,14 +90,14 @@

       title !== issue.title
     ) {
       const status = await updateIssue(
         projectId,
         project.id,
         issue.id,
         { type: "edit", title },
         $httpdStore.session,
         api,
       );
       if (status === "success") {
         issue = await refreshIssue(projectId, issue, api);
         issue = await refreshIssue(project.id, issue, api);
       }
       issue.title = issue.title;
     } else {

@@ -114,7 +113,7 @@

         return;
       }
       const status = await updateIssue(
         projectId,
         project.id,
         issue.id,
         {
           type: "tag",

@@ -125,7 +124,7 @@

         api,
       );
       if (status === "success") {
         issue = await refreshIssue(projectId, issue, api);
         issue = await refreshIssue(project.id, issue, api);
       }
     }
   }

@@ -140,7 +139,7 @@

         return;
       }
       const status = await updateIssue(
         projectId,
         project.id,
         issue.id,
         {
           type: "assign",

@@ -151,7 +150,7 @@

         api,
       );
       if (status === "success") {
         issue = await refreshIssue(projectId, issue, api);
         issue = await refreshIssue(project.id, issue, api);
       }
     }
   }

@@ -159,7 +158,7 @@

   async function saveStatus({ detail: state }: CustomEvent<IssueState>) {
     if ($httpdStore.state === "authenticated") {
       const status = await updateIssue(
         projectId,
         project.id,
         issue.id,
         { type: "lifecycle", state },
         $httpdStore.session,

@@ -168,7 +167,7 @@

       if (status === "success") {
         void router.push({
           resource: "project.issue",
           project: projectId,
           project: project.id,
           node: baseUrl,
           issue: issue.id,
         });

@@ -345,7 +344,7 @@

       <div slot="description">
         <Markdown
           content={issue.discussion[0].body}
           rawPath={utils.getRawBasePath(projectId, baseUrl, projectHead)} />
           rawPath={utils.getRawBasePath(project.id, baseUrl, project.head)} />
         {#if issue.discussion[0].reactions}
           <div class="reactions txt-tiny">
             {#each groupedReactions as [reaction, nids], key}

modified src/views/projects/Issue/New.svelte

@@ -1,5 +1,5 @@

 <script lang="ts">
   import type { BaseUrl } from "@httpd-client";
   import type { BaseUrl, Project } from "@httpd-client";
   import * as modal from "@app/lib/modal";
   import * as router from "@app/lib/router";

@@ -18,8 +18,7 @@

   import Textarea from "@app/components/Textarea.svelte";
   import ErrorMessage from "@app/components/ErrorMessage.svelte";
   export let projectId: string;
   export let projectHead: string;
   export let project: Project;
   export let baseUrl: BaseUrl;
   let preview: boolean = false;

@@ -41,7 +40,7 @@

   async function createIssue(sessionId: string) {
     try {
       const result = await api.project.createIssue(
         projectId,
         project.id,
         {
           title: issueTitle,
           description: issueText ?? "",

@@ -53,7 +52,7 @@

       void router.push({
         resource: "project.issue",
         project: projectId,
         project: project.id,
         node: baseUrl,
         issue: result.id,
       });

@@ -151,9 +150,9 @@

               <Markdown
                 content={issueText}
                 rawPath={utils.getRawBasePath(
                   projectId,
                   project.id,
                   baseUrl,
                   projectHead,
                   project.head,
                 )} />
             {/if}
           </svelte:fragment>

modified src/views/projects/Issues.svelte

@@ -1,5 +1,5 @@

 <script lang="ts">
   import type { BaseUrl, Issue, IssueState } from "@httpd-client";
   import type { BaseUrl, Issue, IssueState, Project } from "@httpd-client";
   import * as utils from "@app/lib/utils";
   import capitalize from "lodash/capitalize";

@@ -15,11 +15,10 @@

   import Placeholder from "@app/components/Placeholder.svelte";
   import SquareButton from "@app/components/SquareButton.svelte";
   export let projectId: string;
   export let project: Project;
   export let baseUrl: BaseUrl;
   export let issues: Issue[];
   export let state: IssueState["status"];
   export let issueCounters: { open: number; closed: number };
   let loading = false;
   let page = 0;

@@ -37,7 +36,7 @@

     loading = true;
     page += 1;
     try {
       const response = await api.project.getAllIssues(projectId, {
       const response = await api.project.getAllIssues(project.id, {
         state,
         page,
         perPage: ISSUES_PER_PAGE,

@@ -59,12 +58,12 @@

   const stateOptions: IssueState["status"][] = ["open", "closed"];
   $: options = stateOptions.map<Tab>(s => ({
     value: s,
     title: `${issueCounters[s]} ${s}`,
     disabled: issueCounters[s] === 0,
     title: `${project.issues[s]} ${s}`,
     disabled: project.issues[s] === 0,
   }));
   $: showMoreButton =
     !loading && !error && allIssues.length < issueCounters[state];
     !loading && !error && allIssues.length < project.issues[state];
 </script>
 <style>

@@ -107,7 +106,7 @@

             <Link
               route={{
                 resource: "project.issues",
                 project: projectId,
                 project: project.id,
                 node: baseUrl,
                 state: option.value,
               }}>

@@ -133,7 +132,7 @@

       <Link
         route={{
           resource: "project.newIssue",
           project: projectId,
           project: project.id,
           node: baseUrl,
         }}>
         <SquareButton>New issue</SquareButton>

@@ -143,7 +142,7 @@

   <div class="issues-list">
     {#each allIssues as issue (issue.id)}
       <div class="teaser">
         <IssueTeaser {projectId} {baseUrl} {issue} />
         <IssueTeaser projectId={project.id} {baseUrl} {issue} />
       </div>
     {:else}
       {#if error}

modified src/views/projects/Patch.svelte

@@ -56,10 +56,10 @@

   export let baseUrl: BaseUrl;
   export let project: Project;
   export let view: PatchView;
   export let patch: Patch;
   export let view: PatchView["view"];
   $: api = new HttpdClient(baseUrl);
   $: patch = view.patch;
   async function createReply({
     detail: reply,

@@ -104,10 +104,10 @@

       }
       let revision;
       if (view.view.name === "diff") {
       if (view.name === "diff") {
         revision = patch.revisions[patch.revisions.length - 1].id;
       } else {
         revision = view.view.revision;
         revision = view.revision;
       }
       await api.project.updatePatch(
         project.id,

@@ -167,10 +167,10 @@

   }
   let revisionId: string;
   $: if (view.view.name === "diff") {
   $: if (view.name === "diff") {
     revisionId = patch.revisions[patch.revisions.length - 1].id;
   } else {
     revisionId = view.view.revision;
     revisionId = view.revision;
   }
   $: patchReviews = computeReviews(patch);

@@ -352,12 +352,12 @@

       <div style="display: flex; gap: 0.5rem;">
         {#each Object.entries(tabs) as [name, route]}
           <Link {route}>
             <SquareButton size="small" active={name === view.view.name}>
             <SquareButton size="small" active={name === view.name}>
               {capitalize(name)}
             </SquareButton>
           </Link>
         {/each}
         {#if view.view.name === "diff"}
         {#if view.name === "diff"}
           <Link
             route={{
               resource: "project.patch",

@@ -366,28 +366,28 @@

               patch: patch.id,
               view: {
                 name: "diff",
                 fromCommit: view.view.fromCommit,
                 toCommit: view.view.toCommit,
                 fromCommit: view.fromCommit,
                 toCommit: view.toCommit,
               },
             }}>
             <SquareButton size="small" active={true}>
               Diff {view.view.fromCommit.substring(
               Diff {view.fromCommit.substring(0, 6)}..{view.toCommit.substring(
 ,
 ,
               )}..{view.view.toCommit.substring(0, 6)}
               )}
             </SquareButton>
           </Link>
         {/if}
       </div>
       {#if view.view.name === "commits" || view.view.name === "files"}
       {#if view.name === "commits" || view.name === "files"}
         <Floating disabled={patch.revisions.length === 1}>
           <svelte:fragment slot="toggle">
             <SquareButton
               size="small"
               clickable={patch.revisions.length > 1}
               disabled={patch.revisions.length === 1}>
               Revision {utils.formatObjectId(view.view.revision)}
               Revision {utils.formatObjectId(view.revision)}
             </SquareButton>
           </svelte:fragment>
           <svelte:fragment slot="modal">

@@ -401,12 +401,12 @@

                     node: baseUrl,
                     patch: patch.id,
                     view: {
                       name: view.view.name,
                       name: view.name,
                       revision: item.id,
                     },
                   }}>
                   <DropdownItem
                     selected={item.id === view.view.revision}
                     selected={item.id === view.revision}
                     size="tiny">
                     Revision {utils.formatObjectId(item.id)}
                   </DropdownItem>

@@ -417,15 +417,15 @@

         </Floating>
       {/if}
     </div>
     {#if view.view.name === "diff"}
     {#if view.name === "diff"}
       <div style:margin-top="1rem">
         <Changeset
           projectId={project.id}
           {baseUrl}
           revision={view.view.toCommit}
           diff={view.view.diff} />
           revision={view.toCommit}
           diff={view.diff} />
       </div>
     {:else if view.view.name === "activity"}
     {:else if view.name === "activity"}
       {#each timelineTuple as [revision, timelines], index}
         {@const previousRevision =
           index > 0 ? patch.revisions[index - 1] : undefined}

@@ -448,22 +448,22 @@

           <div slot="body">No activity on this patch yet</div>
         </Placeholder>
       {/each}
     {:else if view.view.name === "commits"}
     {:else if view.name === "commits"}
       <div class="commit-list">
         {#each view.view.commits as commit}
         {#each view.commits as commit}
           <CommitTeaser projectId={project.id} {baseUrl} {commit} />
         {/each}
       </div>
     {:else if view.view.name === "files"}
     {:else if view.name === "files"}
       <div style:margin-top="1rem">
         <Changeset
           projectId={project.id}
           {baseUrl}
           revision={view.view.revision}
           diff={view.view.diff} />
           revision={view.revision}
           diff={view.diff} />
       </div>
     {:else}
       {utils.unreachable(view.view.name)}
       {utils.unreachable(view.name)}
     {/if}
   </div>

modified src/views/projects/View.svelte

@@ -65,26 +65,17 @@

   {:else if view.resource === "history"}
     <History {...view} {baseUrl} {project} />
   {:else if view.resource === "commit"}
     <Commit commit={view.commit} {baseUrl} {project} />
     <Commit {...view} {baseUrl} {project} />
   {:else if view.resource === "issues"}
     <Issues
       {baseUrl}
       projectId={project.id}
       issueCounters={project.issues}
       state={view.state}
       issues={view.issues} />
     <Issues {...view} {baseUrl} {project} />
   {:else if view.resource === "newIssue"}
     <NewIssue projectId={project.id} projectHead={project.head} {baseUrl} />
     <NewIssue {baseUrl} {project} />
   {:else if view.resource === "issue"}
     <Issue
       projectId={project.id}
       projectHead={project.head}
       {baseUrl}
       issue={view.issue} />
     <Issue {...view} {baseUrl} {project} />
   {:else if view.resource === "patches"}
     <Patches {baseUrl} {project} state={view.state} patches={view.patches} />
     <Patches {...view} {baseUrl} {project} />
   {:else if view.resource === "patch"}
     <Patch {baseUrl} {project} {view} />
     <Patch {...view} {baseUrl} {project} />
   {:else}
     {unreachable(view)}
   {/if}