diff --git a/extensions/ql-vscode/src/remote-queries/view/RemoteQueries.tsx b/extensions/ql-vscode/src/remote-queries/view/RemoteQueries.tsx index 701527c00..d027b5e0b 100644 --- a/extensions/ql-vscode/src/remote-queries/view/RemoteQueries.tsx +++ b/extensions/ql-vscode/src/remote-queries/view/RemoteQueries.tsx @@ -7,6 +7,8 @@ import * as octicons from '../../view/octicons'; import { vscode } from '../../view/vscode-api'; +const numOfReposInContractedMode = 10; + const emptyQueryResult: RemoteQueryResult = { queryTitle: '', queryFile: '', @@ -58,6 +60,9 @@ export function RemoteQueries(): JSX.Element { return
Waiting for results to load.
; } + const [repoListExpanded, setRepoListExpanded] = useState(false); + const numOfReposToShow = repoListExpanded ? queryResult.results.length : numOfReposInContractedMode; + try { return

{queryResult.queryTitle}

@@ -79,12 +84,18 @@ export function RemoteQueries(): JSX.Element {
+ { + queryResult.results.length > numOfReposInContractedMode && + + } ; } catch (err) { console.error(err); diff --git a/extensions/ql-vscode/src/remote-queries/view/remoteQueries.css b/extensions/ql-vscode/src/remote-queries/view/remoteQueries.css index ad98da5a8..2de5e9f33 100644 --- a/extensions/ql-vscode/src/remote-queries/view/remoteQueries.css +++ b/extensions/ql-vscode/src/remote-queries/view/remoteQueries.css @@ -88,3 +88,12 @@ color: var(--vscode-badge-foreground); border-color: var(--vscode-badge-background); } + +.vscode-codeql__expand-button { + background: none; + color: var(--vscode-textLink-foreground); + border: none; + cursor: pointer; + padding-top: 1em; + font-size: x-small; +}