External/SnapOtter
1
0
Fork 0
mirror of https://github.com/snapotter-hq/SnapOtter.git synced 2026-08-03 07:46:42 +02:00
Code Issues Packages Projects Releases Wiki Activity

feat: Import from Files works, remove pipeline button from files page

Browse Source 
- Import from Files now navigates back to the tool page with the
  selected file loaded (uses selectForTool router state)
- Tool page skips file store reset when arriving from the library
- Removed "Open in Pipeline" button from file details and file list
- Button text changes to "Select File" when in file-selection mode
This commit is contained in:
SnapOtter
2026-06-14 21:43:58 +08:00
parent b5eef644e3
commit b8a6b2018e
24 changed files with 40 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/web/src/components/files/file-details.tsx
+12 -16
View File
@@ -1,7 +1,7 @@
import { TOOLS } from "@snapotter/shared";
import { FileImage, ImageIcon, Workflow } from "lucide-react";
import { FileImage, ImageIcon } from "lucide-react";
import { useEffect, useState } from "react";
import { useNavigate } from "react-router-dom";
import { useLocation, useNavigate } from "react-router-dom";
import { useTranslation } from "@/contexts/i18n-context";
import {
apiGetFileDetails,
@@ -79,6 +79,8 @@ export function FileDetails({ mobile = false }: FileDetailsProps) {
const { selectedFileId } = useFilesPageStore();
const setFiles = useFileStore((s) => s.setFiles);
const navigate = useNavigate();
const location = useLocation();
const selectForTool = (location.state as { selectForTool?: string } | null)?.selectForTool;
const [details, setDetails] = useState<UserFileDetail | null>(null);
const [loadingDetails, setLoadingDetails] = useState(false);
@@ -121,7 +123,13 @@ export function FileDetails({ mobile = false }: FileDetailsProps) {
if (valid.length === 0) return;
setFiles(valid.map((d) => d.file));
navigate("/", { state: { fromLibrary: true } });
if (selectForTool) {
const tool = TOOLS.find((t) => t.id === selectForTool);
navigate(tool?.route ?? "/", { state: { fromLibrary: true } });
} else {
navigate("/", { state: { fromLibrary: true } });
}
// Set serverFileId on each entry so tool processing creates new versions
setTimeout(() => {
@@ -224,19 +232,7 @@ export function FileDetails({ mobile = false }: FileDetailsProps) {
onClick={handleOpenFile}
className="w-full px-4 py-2 bg-primary text-primary-foreground text-sm font-medium rounded-lg hover:bg-primary/90 transition-colors"
>
Open File
</button>
<button
type="button"
onClick={() => {
const { checkedIds } = useFilesPageStore.getState();
const ids = checkedIds.size > 1 ? Array.from(checkedIds) : [details.id];
navigate("/automate", { state: { libraryFileIds: ids } });
}}
className="w-full px-4 py-2 border border-primary text-primary text-sm font-medium rounded-lg hover:bg-primary/5 transition-colors flex items-center justify-center gap-2"
>
<Workflow className="h-4 w-4" />
Open in Pipeline
{selectForTool ? t.files.selectFile : t.files.openFile}
</button>
</div>
</div>
apps/web/src/components/files/file-list.tsx
+1 -13
View File
@@ -1,4 +1,4 @@
import { Download, Search, Trash2, Workflow } from "lucide-react";
import { Download, Search, Trash2 } from "lucide-react";
import { useEffect, useRef, useState } from "react";
import { useNavigate } from "react-router-dom";
import { useTranslation } from "@/contexts/i18n-context";
@@ -49,10 +49,6 @@ export function FileList() {
}
}
function handleSendToPipeline() {
navigate("/automate", { state: { libraryFileIds: Array.from(checkedIds) } });
}
const allChecked = files.length > 0 && checkedIds.size === files.length;
const someChecked = checkedIds.size > 0;
@@ -95,14 +91,6 @@ export function FileList() {
<Trash2 className="h-3.5 w-3.5" />
{t.files.delete}
</button>
<button
type="button"
onClick={handleSendToPipeline}
className="flex items-center gap-1 px-2 py-1 text-xs text-primary hover:bg-primary/10 rounded-lg transition-colors"
>
<Workflow className="h-3.5 w-3.5" />
{t.files.pipeline}
</button>
<button
type="button"
onClick={handleBulkDownload}
apps/web/src/pages/tool-page.tsx
+6 -2
View File
@@ -14,7 +14,7 @@ import {
} from "lucide-react";
import { lazy, Suspense, useCallback, useEffect, useMemo, useRef, useState } from "react";
import type { Crop } from "react-image-crop";
import { Link, useParams } from "react-router-dom";
import { Link, useLocation, useParams } from "react-router-dom";
import { BeforeAfterSlider } from "@/components/common/before-after-slider";
import { BottomSheet } from "@/components/common/bottom-sheet";
import { Dropzone } from "@/components/common/dropzone";
@@ -198,6 +198,7 @@ function FileSelectionInfo({
export function ToolPage() {
const { t } = useTranslation();
const { toolId } = useParams<{ toolId: string }>();
const location = useLocation();
const tool = useMemo(() => TOOLS.find((t) => t.id === toolId), [toolId]);
const registryEntry = useMemo(
() => (toolId ? getToolRegistryEntry(toolId) : undefined),
@@ -333,7 +334,10 @@ export function ToolPage() {
// biome-ignore lint/correctness/useExhaustiveDependencies: toolId triggers intentional reset on tool navigation
useEffect(() => {
useFileStore.getState().reset();
const fromLibrary = (location.state as { fromLibrary?: boolean } | null)?.fromLibrary;
if (!fromLibrary) {
useFileStore.getState().reset();
}
useBase64Store.getState().reset();
useCollageStore.getState().reset();
packages/shared/src/i18n/ar.ts
+1
View File
@@ -3214,6 +3214,7 @@ export const ar: TranslationKeys = {
noFilesFound: "No files found",
selectFilePrompt: "Select a file to view details",
openFile: "Open File",
selectFile: "Select File",
openInPipeline: "Open in Pipeline",
name: "Name",
format: "Format",
packages/shared/src/i18n/de.ts
+1
View File
@@ -3243,6 +3243,7 @@ export const de: TranslationKeys = {
noFilesFound: "No files found",
selectFilePrompt: "Select a file to view details",
openFile: "Open File",
selectFile: "Select File",
openInPipeline: "Open in Pipeline",
name: "Name",
format: "Format",
packages/shared/src/i18n/en.ts
+1
View File
@@ -3180,6 +3180,7 @@ export const en = {
noFilesFound: "No files found",
selectFilePrompt: "Select a file to view details",
openFile: "Open File",
selectFile: "Select File",
openInPipeline: "Open in Pipeline",
name: "Name",
format: "Format",
packages/shared/src/i18n/es.ts
+1
View File
@@ -3220,6 +3220,7 @@ export const es: TranslationKeys = {
noFilesFound: "No files found",
selectFilePrompt: "Select a file to view details",
openFile: "Open File",
selectFile: "Select File",
openInPipeline: "Open in Pipeline",
name: "Name",
format: "Format",
packages/shared/src/i18n/fr.ts
+1
View File
@@ -3241,6 +3241,7 @@ export const fr: TranslationKeys = {
noFilesFound: "No files found",
selectFilePrompt: "Select a file to view details",
openFile: "Open File",
selectFile: "Select File",
openInPipeline: "Open in Pipeline",
name: "Name",
format: "Format",
packages/shared/src/i18n/hi.ts
+1
View File
@@ -3211,6 +3211,7 @@ export const hi: TranslationKeys = {
noFilesFound: "No files found",
selectFilePrompt: "Select a file to view details",
openFile: "Open File",
selectFile: "Select File",
openInPipeline: "Open in Pipeline",
name: "Name",
format: "Format",
packages/shared/src/i18n/id.ts
+1
View File
@@ -3228,6 +3228,7 @@ export const id: TranslationKeys = {
noFilesFound: "No files found",
selectFilePrompt: "Select a file to view details",
openFile: "Open File",
selectFile: "Select File",
openInPipeline: "Open in Pipeline",
name: "Name",
format: "Format",
packages/shared/src/i18n/it.ts
+1
View File
@@ -3235,6 +3235,7 @@ export const it: TranslationKeys = {
noFilesFound: "Nessun file trovato",
selectFilePrompt: "Seleziona un file per visualizzare i dettagli",
openFile: "Apri file",
selectFile: "Select File",
openInPipeline: "Apri nella pipeline",
name: "Nome",
format: "Formato",
packages/shared/src/i18n/ja.ts
+1
View File
@@ -3184,6 +3184,7 @@ export const ja: TranslationKeys = {
noFilesFound: "No files found",
selectFilePrompt: "Select a file to view details",
openFile: "Open File",
selectFile: "Select File",
openInPipeline: "Open in Pipeline",
name: "Name",
format: "Format",
packages/shared/src/i18n/ko.ts
+1
View File
@@ -3169,6 +3169,7 @@ export const ko: TranslationKeys = {
noFilesFound: "No files found",
selectFilePrompt: "Select a file to view details",
openFile: "Open File",
selectFile: "Select File",
openInPipeline: "Open in Pipeline",
name: "Name",
format: "Format",
packages/shared/src/i18n/nl.ts
+1
View File
@@ -3231,6 +3231,7 @@ export const nl: TranslationKeys = {
noFilesFound: "No files found",
selectFilePrompt: "Select a file to view details",
openFile: "Open File",
selectFile: "Select File",
openInPipeline: "Open in Pipeline",
name: "Name",
format: "Format",
packages/shared/src/i18n/pl.ts
+1
View File
@@ -3238,6 +3238,7 @@ export const pl: TranslationKeys = {
noFilesFound: "No files found",
selectFilePrompt: "Select a file to view details",
openFile: "Open File",
selectFile: "Select File",
openInPipeline: "Open in Pipeline",
name: "Name",
format: "Format",
packages/shared/src/i18n/pt-BR.ts
+1
View File
@@ -3231,6 +3231,7 @@ export const ptBR: TranslationKeys = {
noFilesFound: "No files found",
selectFilePrompt: "Select a file to view details",
openFile: "Open File",
selectFile: "Select File",
openInPipeline: "Open in Pipeline",
name: "Name",
format: "Format",
packages/shared/src/i18n/ru.ts
+1
View File
@@ -3230,6 +3230,7 @@ export const ru: TranslationKeys = {
noFilesFound: "No files found",
selectFilePrompt: "Select a file to view details",
openFile: "Open File",
selectFile: "Select File",
openInPipeline: "Open in Pipeline",
name: "Name",
format: "Format",
packages/shared/src/i18n/sv.ts
+1
View File
@@ -3225,6 +3225,7 @@ export const sv: TranslationKeys = {
noFilesFound: "No files found",
selectFilePrompt: "Select a file to view details",
openFile: "Open File",
selectFile: "Select File",
openInPipeline: "Open in Pipeline",
name: "Name",
format: "Format",
packages/shared/src/i18n/th.ts
+1
View File
@@ -3202,6 +3202,7 @@ export const th: TranslationKeys = {
noFilesFound: "No files found",
selectFilePrompt: "Select a file to view details",
openFile: "Open File",
selectFile: "Select File",
openInPipeline: "Open in Pipeline",
name: "Name",
format: "Format",
packages/shared/src/i18n/tr.ts
+1
View File
@@ -3235,6 +3235,7 @@ export const tr: TranslationKeys = {
noFilesFound: "No files found",
selectFilePrompt: "Select a file to view details",
openFile: "Open File",
selectFile: "Select File",
openInPipeline: "Open in Pipeline",
name: "Name",
format: "Format",
packages/shared/src/i18n/uk.ts
+1
View File
@@ -3231,6 +3231,7 @@ export const uk: TranslationKeys = {
noFilesFound: "No files found",
selectFilePrompt: "Select a file to view details",
openFile: "Open File",
selectFile: "Select File",
openInPipeline: "Open in Pipeline",
name: "Name",
format: "Format",
packages/shared/src/i18n/vi.ts
+1
View File
@@ -3225,6 +3225,7 @@ export const vi: TranslationKeys = {
noFilesFound: "No files found",
selectFilePrompt: "Select a file to view details",
openFile: "Open File",
selectFile: "Select File",
openInPipeline: "Open in Pipeline",
name: "Name",
format: "Format",
packages/shared/src/i18n/zh-CN.ts
+1
View File
@@ -3153,6 +3153,7 @@ export const zhCN: TranslationKeys = {
noFilesFound: "No files found",
selectFilePrompt: "Select a file to view details",
openFile: "Open File",
selectFile: "Select File",
openInPipeline: "Open in Pipeline",
name: "Name",
format: "Format",
packages/shared/src/i18n/zh-TW.ts
+1
View File
@@ -3151,6 +3151,7 @@ export const zhTW: TranslationKeys = {
noFilesFound: "No files found",
selectFilePrompt: "Select a file to view details",
openFile: "Open File",
selectFile: "Select File",
openInPipeline: "Open in Pipeline",
name: "Name",
format: "Format",