idolpx/meatloaf-config
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(StatusPage): add file manager button for browsing files and update props for integration

Browse Source
This commit is contained in:
Jaime Idolpx 2026-06-11 12:00:01 -04:00
parent a77971e58e
commit 0900b83c95
2 changed files with 18 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
src/app/App.tsx
View File

@ -57,6 +57,8 @@ export default function App() {
const [showSearch, setShowSearch] = useState(false); const [showSearch, setShowSearch] = useState(false);
const [devicesOpenId, setDevicesOpenId] = useState<string | null>(null); const [devicesOpenId, setDevicesOpenId] = useState<string | null>(null);
const [isFullscreen, setIsFullscreen] = useState(false); const [isFullscreen, setIsFullscreen] = useState(false);
const [fileManagerInitialPath, setFileManagerInitialPath] = useState<string | undefined>(undefined);
const [fileManagerReturnPage, setFileManagerReturnPage] = useState<Page>('apps');
useEffect(() => { useEffect(() => {
const id = 'save-status'; const id = 'save-status';
@ -99,7 +101,7 @@ export default function App() {
}; };
const pages = { const pages = {
status: <StatusPage config={config} setConfig={setConfig} />, status: <StatusPage config={config} setConfig={setConfig} onOpenFileManager={(path) => { setFileManagerInitialPath(path); setFileManagerReturnPage('status'); setCurrentPage('file-manager'); }} />,
devices: <DevicesPage config={config} setConfig={setConfig} openDeviceId={devicesOpenId} onClearOpenDevice={() => setDevicesOpenId(null)} />, devices: <DevicesPage config={config} setConfig={setConfig} openDeviceId={devicesOpenId} onClearOpenDevice={() => setDevicesOpenId(null)} />,
iec: <IECPage config={config} setConfig={setConfig} />, iec: <IECPage config={config} setConfig={setConfig} />,
network: <NetworkPage config={config} setConfig={setConfig} />, network: <NetworkPage config={config} setConfig={setConfig} />,
@ -163,7 +165,8 @@ export default function App() {
</div> </div>
), ),
'file-manager': <MediaManager 'file-manager': <MediaManager
onBack={() => setCurrentPage('apps')} initialPath={fileManagerInitialPath}
onBack={() => setCurrentPage(fileManagerReturnPage)}
config={config} config={config}
setConfig={setConfig} setConfig={setConfig}
onNavigateToDevice={(id) => { setCurrentPage('devices'); setDevicesOpenId(id); }} onNavigateToDevice={(id) => { setCurrentPage('devices'); setDevicesOpenId(id); }}

16
src/app/components/StatusPage.tsx
View File

@ -1,5 +1,5 @@
import { useEffect, useState } from 'react'; import { useEffect, useState } from 'react';
import { HardDrive, Activity, Wifi, Radio, Clock, RefreshCw, Loader2, Printer, Power, Computer, Download, Trash2, Eye } from 'lucide-react'; import { HardDrive, Activity, Wifi, Radio, Clock, RefreshCw, Loader2, Printer, Power, Computer, Download, Trash2, Eye, FolderOpen } from 'lucide-react';
import { listDirectory, deletePath, getFileContents, getWebDAVBaseUrl, humanFileSize, type EntryInfo } from '../webdav'; import { listDirectory, deletePath, getFileContents, getWebDAVBaseUrl, humanFileSize, type EntryInfo } from '../webdav';
import { toast } from 'sonner'; import { toast } from 'sonner';
import { MediaEntry } from './MediaEntry'; import { MediaEntry } from './MediaEntry';
@ -13,9 +13,10 @@ import { ConfirmDialog, type ConfirmOptions } from './ui/confirm-dialog';
interface StatusPageProps { interface StatusPageProps {
config: any; config: any;
setConfig: (config: any) => void; setConfig: (config: any) => void;
onOpenFileManager?: (path: string) => void;
} }
export default function StatusPage({ config, setConfig }: StatusPageProps) { export default function StatusPage({ config, setConfig, onOpenFileManager }: StatusPageProps) {
const { status: wsStatus, send: wsSend } = useWs(); const { status: wsStatus, send: wsSend } = useWs();
// Mock memory stats // Mock memory stats
@ -159,7 +160,16 @@ export default function StatusPage({ config, setConfig }: StatusPageProps) {
</div> </div>
</div> </div>
</button> </button>
<div className="w-2 h-2 rounded-full bg-green-500" /> <div className="flex items-center gap-2">
<button
onClick={() => onOpenFileManager?.(activeDevice.base_url || activeDevice.url || '/')}
className="p-2 rounded hover:bg-neutral-100"
title="Browse files"
>
<FolderOpen className="w-5 h-5 text-neutral-500" />
</button>
<div className="w-2 h-2 rounded-full bg-green-500" />
</div>
</div> </div>
{mediaSetFiles && ( {mediaSetFiles && (