Svelte: allow picking by commit hash (#62160)

This updates the revision picker to support searching for commits by hash. This has been a long-standing product gap in the React webapp, and the same problem exists in the Svelte webapp.

I did not fix this in the React webapp as well because our pagination logic is very tied to GraphQL pagination, and I couldn't come up with an easy way to add an item to the list that is outside of a paginated list of nodes.

Fixes #18792 in the Svelte webapp
Fixes #44881 in the Svelte webapp

Author: camdencheek

client/web-sveltekit/src/routes/[...repo=reporev]/(validrev)/(code)/+layout.ts

@@ -127,12 +127,21 @@ export const load: LayoutLoad = async ({ parent, params }) => {
                         revision: resolvedRevision.commitID,
                     })
                     .then(
-                        mapOrThrow(({ data, error }) => {
-                            if (!data?.repository?.commit) {
-                                throw new Error(error?.message)
-                            }
+                        mapOrThrow(({ data }) => {
+                            let nodes = data?.repository?.ancestorCommits?.ancestors.nodes ?? []
 
-                            return data.repository.commit.ancestors
+                            // If we got a match for the OID, add it to the list if it doesn't already exist.
+                            // We double check that the OID contains the search term because we cannot search
+                            // specifically by OID, and an empty string resolves to HEAD.
+                            const commitByHash = data?.repository?.commitByHash
+                            if (
+                                commitByHash &&
+                                commitByHash.oid.includes(searchTerm) &&
+                                !nodes.some(node => node.oid === commitByHash.oid)
+                            ) {
+                                nodes = [commitByHash, ...nodes]
+                            }
+                            return { nodes }
                         })
                     )
             ),

client/web-sveltekit/src/routes/[...repo=reporev]/(validrev)/(code)/RepositoryRevPicker.gql

@@ -22,25 +22,13 @@ fragment RepositoryGitRefs on Repository {
     }
 }
 
-# Used to query data for repository git commits
-# NOTE: the query which is going to use this fragment is supposed
-# to have query and anchor revision variables
-fragment RepositoryGitCommits on Repository {
+fragment RevPickerGitCommit on GitCommit {
     __typename
-    commit(rev: $revision) {
-        __typename
-        ancestors(first: 15, query: $query) {
-            __typename
-            nodes {
-                __typename
-                id
-                oid
-                subject
-                abbreviatedOID
-                ...RepositoryGitRevAuthor
-            }
-        }
-    }
+    id
+    oid
+    subject
+    abbreviatedOID
+    ...RepositoryGitRevAuthor
 }
 
 fragment RepositoryGitRevAuthor on GitCommit {

client/web-sveltekit/src/routes/[...repo=reporev]/(validrev)/(code)/RepositoryRevPicker.svelte

@@ -1,27 +1,28 @@
 <script context="module" lang="ts">
-    import type { RepositoryGitRefs, RepositoryGitCommits } from './RepositoryRevPicker.gql'
+    import type { RepositoryGitRefs, RevPickerGitCommit } from './RepositoryRevPicker.gql'
 
     export type RepositoryBranches = RepositoryGitRefs['gitRefs']
     export type RepositoryBranch = RepositoryBranches['nodes'][number]
 
     export type RepositoryTags = RepositoryGitRefs['gitRefs']
     export type RepositoryTag = RepositoryTags['nodes'][number]
 
-    export type RepositoryCommits = NonNullable<RepositoryGitCommits['commit']>['ancestors']
-    export type RepositoryGitCommit = RepositoryCommits['nodes'][number]
+    export type RepositoryCommits = { nodes: RevPickerGitCommit[] }
+    export type RepositoryGitCommit = RevPickerGitCommit
 </script>
 
 <script lang="ts">
     import { mdiClose, mdiSourceBranch, mdiTagOutline, mdiSourceCommit } from '@mdi/js'
-    import { Button, Badge } from '$lib/wildcard'
-    import Popover from '$lib/Popover.svelte'
+
+    import { replaceRevisionInURL } from '@sourcegraph/shared/src/util/url'
+
+    import { goto } from '$app/navigation'
     import Icon from '$lib/Icon.svelte'
-    import Tabs from '$lib/Tabs.svelte'
+    import Popover from '$lib/Popover.svelte'
     import TabPanel from '$lib/TabPanel.svelte'
+    import Tabs from '$lib/Tabs.svelte'
     import Tooltip from '$lib/Tooltip.svelte'
-
-    import { goto } from '$app/navigation'
-    import { replaceRevisionInURL } from '@sourcegraph/shared/src/util/url'
+    import { Button, Badge } from '$lib/wildcard'
 
     import type { ResolvedRevision } from '../../+layout'
 

client/web-sveltekit/src/routes/[...repo=reporev]/(validrev)/(code)/layout.gql

@@ -29,9 +29,18 @@ query RepositoryGitRefs($repoName: String!, $query: String, $type: GitRefType!)
     }
 }
 
-query RepositoryGitCommits($repoName: String!, $query: String, $revision: String!) {
+query RepositoryGitCommits($repoName: String!, $query: String!, $revision: String!) {
     repository(name: $repoName) {
-        ...RepositoryGitCommits
+        commitByHash: commit(rev: $query) {
+            ...RevPickerGitCommit
+        }
+        ancestorCommits: commit(rev: $revision) {
+            ancestors(first: 15, query: $query) {
+                nodes {
+                    ...RevPickerGitCommit
+                }
+            }
+        }
     }
 }