82a2ac6 Allow users to pass project names into URL — radicle-explorer

modified src/base/projects/Header.svelte

@@ -29,17 +29,17 @@

   // Switches between the browser and commit view
   const toggleContent = (input: ProjectContent) => {
     dispatch("routeParamsChange", { content: content === input ? ProjectContent.Tree : input, revision, peer, path });
     dispatch("routeParamsChange", { urn, content: content === input ? ProjectContent.Tree : input, revision, peer, path });
   };
   const updatePeer = (newPeer: string) => {
     dropdownState.peer = false;
     dispatch("routeParamsChange", { content, revision, peer: newPeer, path });
     dispatch("routeParamsChange", { urn, content, revision, peer: newPeer, path });
   };
   const updateRevision = (newRevision: string) => {
     dropdownState.branch = false;
     dispatch("routeParamsChange", { content, revision: newRevision, peer, path });
     dispatch("routeParamsChange", { urn, content, revision: newRevision, peer, path });
   };
   $: commit = getOid(project.head, revision, branches);

modified src/base/projects/Routes.svelte

@@ -9,22 +9,22 @@

 <!-- With an Seed context -->
 <Route path="/seeds/:seed/projects/:urn/*" let:params>
   <View {config} seed={params.seed} urn={params.urn} />
 <Route path="/seeds/:seed/projects/:id/*" let:params>
   <View {config} seed={params.seed} id={params.id} />
 </Route>
 <Route path="/seeds/:seed/projects/:urn/remotes/:peer/*" let:params>
   <View {config} seed={params.seed} peer={params.peer} urn={params.urn} />
 <Route path="/seeds/:seed/projects/:id/remotes/:peer/*" let:params>
   <View {config} seed={params.seed} peer={params.peer} id={params.id} />
 </Route>
 <!-- With an Org context -->
 <Route path="/orgs/:org/projects/:urn/*" let:params>
   <View {config} org={params.org} urn={params.urn} />
 <Route path="/orgs/:org/projects/:id/*" let:params>
   <View {config} org={params.org} id={params.id} />
 </Route>
 <!-- With a User context -->
 <Route path="/users/:user/projects/:urn/*" let:params>
   <View {config} user={params.user} urn={params.urn} />
 <Route path="/users/:user/projects/:id/*" let:params>
   <View {config} user={params.user} id={params.id} />
 </Route>

modified src/base/projects/View.svelte

@@ -7,7 +7,7 @@

   import Avatar from '@app/Avatar.svelte';
   import { Profile, ProfileType } from '@app/profile';
   import type { Info } from '@app/project';
   import { formatOrg, formatSeedId } from '@app/utils';
   import { formatOrg, formatSeedId, isRadicleId } from '@app/utils';
   import { getOid } from '@app/project';
   import { Seed } from '@app/base/seeds/Seed';
   import { getAllAnchors } from '@app/anchors';

@@ -15,7 +15,7 @@

   import Header from '@app/base/projects/Header.svelte';
   import ProjectContentRoutes from '@app/base/projects/ProjectContentRoutes.svelte';
   export let urn: string;
   export let id: string; // Project name or URN.
   export let org = "";
   export let user = "";
   export let seed = "";

@@ -23,7 +23,7 @@

   export let config: Config;
   let parentName = formatOrg(org || user, config);
   let pageTitle = parentName ? `${parentName}/${urn}` : urn;
   let pageTitle = parentName ? `${parentName}/${id}` : id;
   let projectInfo: Info | null = null;
   let revision: string;
   let content: proj.ProjectContent;

@@ -42,7 +42,8 @@

     const profile = result?.profile;
     const seedInstance = profile?.seed ?? result?.seed;
     const cfg = seedInstance && seedInstance.valid ? config.withSeed(seedInstance) : config;
     const info = await proj.getInfo(urn, cfg);
     const info = await proj.getInfo(id, cfg);
     const urn = isRadicleId(id) ? id : info.meta.urn;
     const anchors = await getAllAnchors(config, urn, profile?.anchorsAccount ?? org);
     let branches = Array([info.meta.defaultBranch, info.head]) as [string, string][];

@@ -50,6 +51,9 @@

     projectInfo = info;
     // Replace project name with URN, in URL bar.
     navigate(proj.path({ peer, urn, org, revision, path, seed }), { replace: true });
     // Checks for delegates returned from seed node, as feature check of the seed node
     if (info.meta.delegates) {
       // Check for selected peer to override available branches.

@@ -80,8 +84,8 @@

     }
   }
   function updateRouteParams({ detail: newParams }: { detail: { path: string; revision: string; peer: string; content: proj.ProjectContent } }) {
     let newLocation = proj.path({ urn, user, org, seed, content: newParams.content, peer: newParams.peer, revision: newParams.revision, path: newParams.path });
   function updateRouteParams({ detail: newParams }: { detail: { urn: string; path: string; revision: string; peer: string; content: proj.ProjectContent } }) {
     let newLocation = proj.path({ user, org, seed, urn: newParams.urn, content: newParams.content, peer: newParams.peer, revision: newParams.revision, path: newParams.path });
     if (newLocation !== window.location.pathname) {
       navigate(newLocation);
     }

@@ -92,8 +96,6 @@

   }
   const back = () => window.history.back();
   $: projectRoot = proj.path({ urn, user, org, seed });
 </script>
 <style>

@@ -175,15 +177,15 @@

           </a>
           <span class="divider">/</span>
         {/if}
         <Link to={projectRoot}>{result.project.meta.name}</Link>
         <Link to={proj.path({ urn: result.urn, user, org, seed })}>{result.project.meta.name}</Link>
         {#if peer}
           <span class="divider" title={peer}>/ {formatSeedId(peer)}</span>
         {/if}
       </div>
       <div class="urn">{urn}</div>
       <div class="urn">{result.urn}</div>
       <div class="description">{result.project.meta.description}</div>
     </header>
     {#await proj.getTree(urn, getOid(result.project.head, revision, result.branches), "/", config) then tree}
     {#await proj.getTree(result.urn, getOid(result.project.head, revision, result.branches), "/", config) then tree}
       <Header {tree} {revision} {content} {path}
         source={result}
         peerSelector={!!seed}

@@ -206,7 +208,7 @@

     <Modal subtle>
       <span slot="title">🏜️</span>
       <span slot="body">
         <p class="highlight"><strong>{urn}</strong></p>
         <p class="highlight"><strong>{id}</strong></p>
         <p>This project was not found.</p>
       </span>
       <span slot="actions">

modified src/project.ts

@@ -52,6 +52,7 @@ export interface Info {

 }
 export interface Meta {
   urn: string;
   name: string;
   description: string;
   defaultBranch: string;

@@ -99,8 +100,8 @@ export interface Branches {

   heads: Branch;
 }
 export async function getInfo(urn: string, config: Config): Promise<Info> {
   return api.get(`projects/${urn}`, {}, config);
 export async function getInfo(nameOrUrn: string, config: Config): Promise<Info> {
   return api.get(`projects/${nameOrUrn}`, {}, config);
 }
 export async function getCommits(urn: string, commit: string, config: Config): Promise<CommitsHistory> {