svelte: Migrate repo sidebar toggle button to use lucide icon (#63129)

See title.

Contributes to SRCH-467

## Test plan

Visual inspection.
This commit is contained in:
Felix Kling 2024-06-07 09:29:59 +02:00 committed by GitHub
parent b2f1746844
commit 9341fcf7d2
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 17 additions and 14 deletions

View File

@ -6,6 +6,8 @@
export {}
declare global {
const ILucideArrowDownFromLine: typeof import('~icons/lucide/arrow-down-from-line')['default']
const ILucideArrowLeftFromLine: typeof import('~icons/lucide/arrow-left-from-line')['default']
const ILucideArrowRightFromLine: typeof import('~icons/lucide/arrow-right-from-line')['default']
const ILucideCaseSensitive: typeof import('~icons/lucide/case-sensitive')['default']
const ILucideChevronFirst: typeof import('~icons/lucide/chevron-first')['default']
const ILucideChevronLast: typeof import('~icons/lucide/chevron-last')['default']
@ -18,6 +20,8 @@ declare global {
const ILucideHome: typeof import('~icons/lucide/home')['default']
const ILucideInfo: typeof import('~icons/lucide/info')['default']
const ILucidePanelBottomClose: typeof import('~icons/lucide/panel-bottom-close')['default']
const ILucidePanelLeftClose: typeof import('~icons/lucide/panel-left-close')['default']
const ILucidePanelLeftOpen: typeof import('~icons/lucide/panel-left-open')['default']
const ILucideRegex: typeof import('~icons/lucide/regex')['default']
const ILucideSquareSlash: typeof import('~icons/lucide/square-slash')['default']
const ILucideStar: typeof import('~icons/lucide/star')['default']

View File

@ -1,7 +1,7 @@
<script context="module" lang="ts">
import { SVELTE_LOGGER, SVELTE_TELEMETRY_EVENTS } from '$lib/telemetry'
import type { Keys } from '$lib/Hotkey'
import type { Capture as HistoryCapture } from '$lib/repo/HistoryPanel.svelte'
import { SVELTE_LOGGER, SVELTE_TELEMETRY_EVENTS } from '$lib/telemetry'
enum TabPanels {
History,
@ -37,7 +37,6 @@
</script>
<script lang="ts">
import { mdiChevronDoubleLeft, mdiChevronDoubleRight } from '@mdi/js'
import { tick } from 'svelte'
import { afterNavigate, goto } from '$app/navigation'
@ -45,9 +44,7 @@
import { isErrorLike, SourcegraphURL } from '$lib/common'
import { openFuzzyFinder } from '$lib/fuzzyfinder/FuzzyFinderContainer.svelte'
import { filesHotkey } from '$lib/fuzzyfinder/keys'
import Icon from '$lib/Icon.svelte'
import Icon2 from '$lib/Icon2.svelte'
import Tooltip from '$lib/Tooltip.svelte'
import KeyboardShortcut from '$lib/KeyboardShortcut.svelte'
import LoadingSpinner from '$lib/LoadingSpinner.svelte'
import { fetchSidebarFileTree } from '$lib/repo/api/tree'
@ -55,6 +52,7 @@
import LastCommit from '$lib/repo/LastCommit.svelte'
import TabPanel from '$lib/TabPanel.svelte'
import Tabs from '$lib/Tabs.svelte'
import Tooltip from '$lib/Tooltip.svelte'
import { Alert, PanelGroup, Panel, PanelResizeHandle, Button } from '$lib/wildcard'
import type { LastCommitFragment } from '$testing/graphql-type-mocks'
@ -193,16 +191,17 @@
<div class="sidebar" class:collapsed={isCollapsed}>
<header>
<div class="sidebar-action-row">
<Button
variant="secondary"
outline
size="sm"
on:click={toggleFileSidePanel}
aria-label="{isCollapsed ? 'Open' : 'Close'} sidebar"
>
<Icon svgPath={!isCollapsed ? mdiChevronDoubleLeft : mdiChevronDoubleRight} inline />
</Button>
<Tooltip tooltip="{isCollapsed ? 'Open' : 'Close'} sidebar">
<Button
variant="secondary"
outline
size="sm"
on:click={toggleFileSidePanel}
aria-label="{isCollapsed ? 'Open' : 'Close'} sidebar"
>
<Icon2 icon={isCollapsed ? ILucidePanelLeftOpen : ILucidePanelLeftClose} inline aria-hidden />
</Button>
</Tooltip>
<RepositoryRevPicker
repoURL={data.repoURL}
revision={data.revision}