mirror of
https://github.com/open-webui/open-webui.git
synced 2026-08-28 05:27:35 +00:00
refac
This commit is contained in:
Timothy Jaeryang Baek
parent
7dfbdd221a
commit
2befa8f796
4 changed files with 40 additions and 30 deletions
|
|
@ -1270,28 +1270,6 @@
|
|||
onSort={toggleSort}
|
||||
onToggleHidden={toggleHidden}
|
||||
>
|
||||
{#if fileImageUrl !== null || (fileOfficeSlides !== null && fileOfficeSlides.length > 0)}
|
||||
<Tooltip content={$i18n.t('Reset view')}>
|
||||
<button
|
||||
class="shrink-0 flex h-5 w-5 items-center justify-center rounded transition-colors duration-100 text-gray-400 dark:text-gray-500 hover:text-gray-600 dark:hover:text-gray-300"
|
||||
on:click={() => filePreviewRef?.resetImageView()}
|
||||
aria-label={$i18n.t('Reset view')}
|
||||
>
|
||||
<Icon name="refresh" size={11} strokeWidth={1.4} />
|
||||
</button>
|
||||
</Tooltip>
|
||||
{/if}
|
||||
{#if filePdfData !== null}
|
||||
<Tooltip content={$i18n.t('Reset view')}>
|
||||
<button
|
||||
class="shrink-0 flex h-5 w-5 items-center justify-center rounded transition-colors duration-100 text-gray-400 dark:text-gray-500 hover:text-gray-600 dark:hover:text-gray-300"
|
||||
on:click={() => filePreviewRef?.resetPdfView()}
|
||||
aria-label={$i18n.t('Reset view')}
|
||||
>
|
||||
<Icon name="refresh" size={11} strokeWidth={1.4} />
|
||||
</button>
|
||||
</Tooltip>
|
||||
{/if}
|
||||
{#if (isMarkdown || isCsv || isHtml || isJson || isSvg || isNotebook) && fileContent !== null && !editing}
|
||||
<Tooltip content={showRaw ? $i18n.t('Preview') : $i18n.t('Source')}>
|
||||
<button
|
||||
|
|
|
|||
|
|
@ -43,7 +43,8 @@
|
|||
export let parentWritable = true;
|
||||
|
||||
$: entryPath =
|
||||
fullPath ?? (entry.type === 'directory' ? `${currentPath}${entry.name}/` : `${currentPath}${entry.name}`);
|
||||
fullPath ??
|
||||
(entry.type === 'directory' ? `${currentPath}${entry.name}/` : `${currentPath}${entry.name}`);
|
||||
$: directoryPath = entryPath.endsWith('/') ? entryPath : `${entryPath}/`;
|
||||
$: writable = entry.writable !== false;
|
||||
$: canMutate = parentWritable && writable;
|
||||
|
|
@ -164,6 +165,7 @@
|
|||
{dragOverFolder
|
||||
? 'bg-blue-50 dark:bg-blue-500/10 ring-1 ring-blue-400 dark:ring-blue-500 ring-inset'
|
||||
: ''}"
|
||||
role="presentation"
|
||||
on:dragover={(e) => {
|
||||
if (entry.type !== 'directory') return;
|
||||
if (!writable) return;
|
||||
|
|
@ -207,7 +209,7 @@
|
|||
{#if entry.type === 'directory'}
|
||||
<button
|
||||
type="button"
|
||||
class="mr-1 flex w-4 shrink-0 items-center self-stretch justify-center text-gray-400 dark:text-gray-600 hover:text-gray-600 dark:hover:text-gray-400"
|
||||
class="mr-1 flex w-3 shrink-0 items-center self-stretch justify-center text-gray-400 dark:text-gray-600 hover:text-gray-600 dark:hover:text-gray-400"
|
||||
style="margin-left: {rowIndent};"
|
||||
on:click|stopPropagation={() => onToggleExpand(directoryPath)}
|
||||
aria-label={expanded ? $i18n.t('Collapse') : $i18n.t('Expand')}
|
||||
|
|
@ -250,7 +252,10 @@
|
|||
} else {
|
||||
e.dataTransfer?.setData(
|
||||
'application/x-terminal-file-move',
|
||||
JSON.stringify({ path: entry.type === 'directory' ? directoryPath : filePath, name: entry.name })
|
||||
JSON.stringify({
|
||||
path: entry.type === 'directory' ? directoryPath : filePath,
|
||||
name: entry.name
|
||||
})
|
||||
);
|
||||
}
|
||||
if (entry.type === 'file') {
|
||||
|
|
@ -276,7 +281,7 @@
|
|||
{#if selectionMode || selected}
|
||||
<!-- Checkbox indicator -->
|
||||
<div
|
||||
class="size-3.5 shrink-0 rounded border transition-colors flex items-center justify-center
|
||||
class="size-3.5 shrink-0 rounded border transition-colors flex items-center justify-center
|
||||
{selected
|
||||
? 'bg-blue-500 dark:bg-blue-600 border-blue-500 dark:border-blue-600 text-white'
|
||||
: 'border-gray-300 dark:border-gray-600'}"
|
||||
|
|
@ -348,7 +353,11 @@
|
|||
onOpen(entry);
|
||||
}}
|
||||
>
|
||||
<Icon name={entry.type === 'directory' ? 'folder' : 'eye'} size={12} strokeWidth={1.4} />
|
||||
<Icon
|
||||
name={entry.type === 'directory' ? 'folder' : 'eye'}
|
||||
size={12}
|
||||
strokeWidth={1.4}
|
||||
/>
|
||||
<div class="flex items-center">
|
||||
{entry.type === 'directory' ? $i18n.t('Open Folder') : $i18n.t('Open')}
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -52,7 +52,7 @@
|
|||
<!-- Back -->
|
||||
<Tooltip content={$i18n.t('Back')}>
|
||||
<button
|
||||
class="shrink-0 flex h-5 w-5 items-center justify-center rounded transition-colors duration-100 {canGoBack
|
||||
class="shrink-0 flex h-5 min-w-5 items-center justify-center rounded px-1 transition-colors duration-100 {canGoBack
|
||||
? 'text-gray-400 dark:text-gray-500 hover:text-gray-600 dark:hover:text-gray-300'
|
||||
: 'text-gray-200 dark:text-gray-700 cursor-default'}"
|
||||
on:click={onGoBack}
|
||||
|
|
@ -66,7 +66,7 @@
|
|||
<!-- Forward -->
|
||||
<Tooltip content={$i18n.t('Forward')}>
|
||||
<button
|
||||
class="shrink-0 flex h-5 w-5 items-center justify-center rounded transition-colors duration-100 {canGoForward
|
||||
class="shrink-0 flex h-5 min-w-5 items-center justify-center rounded px-1 transition-colors duration-100 {canGoForward
|
||||
? 'text-gray-400 dark:text-gray-500 hover:text-gray-600 dark:hover:text-gray-300'
|
||||
: 'text-gray-200 dark:text-gray-700 cursor-default'}"
|
||||
on:click={onGoForward}
|
||||
|
|
@ -79,7 +79,7 @@
|
|||
|
||||
<div
|
||||
bind:this={breadcrumbEl}
|
||||
class="flex items-center gap-1 flex-1 min-w-0 overflow-x-auto scrollbar-none"
|
||||
class="flex items-center gap-1.5 flex-1 min-w-0 overflow-x-auto scrollbar-none"
|
||||
>
|
||||
{#each breadcrumbs as crumb, i}
|
||||
{#if showSeparator(i)}
|
||||
|
|
|
|||
|
|
@ -9,12 +9,14 @@
|
|||
import Spinner from '../../common/Spinner.svelte';
|
||||
import PDFViewer from '../../common/PDFViewer.svelte';
|
||||
import PanzoomContainer from '../../common/PanzoomContainer.svelte';
|
||||
import Tooltip from '../../common/Tooltip.svelte';
|
||||
import DocxPreview from '../../common/DocxPreview.svelte';
|
||||
import PptxPreview from '../../common/PptxPreview.svelte';
|
||||
import JsonTreeView from './JsonTreeView.svelte';
|
||||
import NotebookView from './NotebookView.svelte';
|
||||
import SqliteView from './SqliteView.svelte';
|
||||
import FileCodeEditor from './FileCodeEditor.svelte';
|
||||
import Icon from './Icon.svelte';
|
||||
|
||||
let pdfViewerRef: PDFViewer;
|
||||
let fileCodeEditorRef: FileCodeEditor;
|
||||
|
|
@ -273,6 +275,10 @@
|
|||
export const resetPdfView = () => {
|
||||
pdfViewerRef?.resetView();
|
||||
};
|
||||
|
||||
const resetFloatingView = () => {
|
||||
if (fileImageUrl !== null) panzoomRef?.reset();
|
||||
};
|
||||
</script>
|
||||
|
||||
<div
|
||||
|
|
@ -471,6 +477,23 @@
|
|||
{$i18n.t('Could not read file.')}
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
{#if !fileLoading && fileImageUrl !== null}
|
||||
<div
|
||||
class="absolute bottom-3 left-1/2 z-10 flex -translate-x-1/2 items-center rounded-lg border border-gray-200/60 bg-white/90 px-1 py-0.5 shadow-lg backdrop-blur-sm dark:border-gray-700/60 dark:bg-gray-850/90"
|
||||
>
|
||||
<Tooltip content={$i18n.t('Reset view')}>
|
||||
<button
|
||||
type="button"
|
||||
class="inline-flex h-7 min-w-7 shrink-0 items-center justify-center rounded-md p-1.5 text-gray-500 transition hover:bg-gray-100 dark:text-gray-400 dark:hover:bg-gray-800"
|
||||
on:click={resetFloatingView}
|
||||
aria-label={$i18n.t('Reset view')}
|
||||
>
|
||||
<Icon name="refresh" size={13} strokeWidth={1.4} />
|
||||
</button>
|
||||
</Tooltip>
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
<style>
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue