diff --git a/src/components/app.tsx b/src/components/app.tsx index 9f17878..0b76e35 100644 --- a/src/components/app.tsx +++ b/src/components/app.tsx @@ -21,7 +21,7 @@ import type { ServerConfig } from "../config"; import React, { useCallback, useContext, useEffect, useMemo, useRef, useState } from "react"; import { Server } from "../components/server"; import { ClientManager } from "../clientmanager"; -import { ActionIcon, Box, Button, Flex, Stack, useMantineColorScheme } from "@mantine/core"; +import { ActionIcon, Box, Button, Flex, Menu, Stack, useMantineColorScheme } from "@mantine/core"; import { QueryClientProvider } from "@tanstack/react-query"; import { ReactQueryDevtools } from "@tanstack/react-query-devtools"; import { queryClient } from "queries"; @@ -34,6 +34,7 @@ import * as Icon from "react-bootstrap-icons"; import { modKeyString } from "trutil"; import { ColorSchemeToggle, FontSizeToggle, ShowVersion } from "./miscbuttons"; import { AppSettingsModal } from "./modals/settings"; +import { ToolbarButton } from "./toolbar"; const { appWindow, invoke, makeCreateTorrentView } = await import(/* webpackChunkName: "taurishim" */"taurishim"); @@ -112,6 +113,17 @@ export default function TauriApp() { config.setServers(servers); }, [config]); + const [showTabStrip, setShowTabStrip] = useState(config.values.app.showTabStrip); + + const toggleTabStrip = useCallback(() => { + config.values.app.showTabStrip = !showTabStrip; + setShowTabStrip(!showTabStrip); + }, [config, showTabStrip]); + + const onCreateTorrent = useCallback(() => { + void makeCreateTorrentView(); + }, []); + return ( + setCurrentServer={setCurrentServer} + visible={showTabStrip} + > @@ -136,7 +150,33 @@ export default function TauriApp() { {currentServer !== undefined ? - + + + + + + + + {tabsRef.current?.getOpenTabs() !== undefined && tabsRef.current?.getOpenTabs()?.length > 1 && + + + + + + + + + {tabsRef.current?.getOpenTabs().map((tab, index) => + { tabsRef.current?.switchTab(index); }}> + {tab} + )} + + } + } + toggleTabStrip={toggleTabStrip} /> : diff --git a/src/components/server.tsx b/src/components/server.tsx index b4ab790..53e3162 100644 --- a/src/components/server.tsx +++ b/src/components/server.tsx @@ -105,9 +105,11 @@ function ServerContext(props: ServerContextProps) { interface ServerProps { hostname: string, tabsRef: React.RefObject, + toolbarExtra?: React.ReactNode, + toggleTabStrip: () => void, } -export function Server({ hostname, tabsRef }: ServerProps) { +export function Server({ hostname, tabsRef, toolbarExtra, toggleTabStrip }: ServerProps) { useAppHotkeys(); const [currentFilters, setCurrentFilters] = useReducer(currentFiltersReducer, [{ id: "", filter: DefaultFilter }]); @@ -214,9 +216,11 @@ export function Server({ hostname, tabsRef }: ServerProps) { setSearchTerms={setSearchTerms} modals={modals} altSpeedMode={session?.["alt-speed-enabled"] ?? false} + extra={toolbarExtra} toggleFiltersPanel={toggleFiltersPanel} toggleDetailsPanel={toggleDetailsPanel} toggleMainSplit={toggleMainSplit} + toggleTabStrip={toggleTabStrip} /> diff --git a/src/components/servertabs.tsx b/src/components/servertabs.tsx index 5917819..9f5620f 100644 --- a/src/components/servertabs.tsx +++ b/src/components/servertabs.tsx @@ -30,6 +30,7 @@ interface ServerTabsProps extends React.PropsWithChildren { clientManager: ClientManager, servers: ServerConfig[], setCurrentServer: React.Dispatch, + visible: boolean, } export interface ServerTabsRef { @@ -178,6 +179,7 @@ export const ServerTabs = React.forwardRef(funct }, tabsList: { flexWrap: "nowrap", + display: props.visible ? undefined : "none", }, })} > diff --git a/src/components/statusbar.tsx b/src/components/statusbar.tsx index 1dfeb15..6691524 100644 --- a/src/components/statusbar.tsx +++ b/src/components/statusbar.tsx @@ -35,9 +35,10 @@ export interface StatusbarProps { filteredTorrents: Torrent[], selectedTorrents: Set, hostname: string, + showMisc: boolean, } -export function Statusbar({ session, torrents, filteredTorrents, selectedTorrents, hostname }: StatusbarProps) { +export function Statusbar({ session, torrents, filteredTorrents, selectedTorrents, hostname, showMisc }: StatusbarProps) { const config = useContext(ConfigContext); const serverConfig = useContext(ServerConfigContext); @@ -145,7 +146,7 @@ export function Statusbar({ session, torrents, filteredTorrents, selectedTorrent
{`Selected: ${sizeSelected}, done ${sizeDone}, left ${sizeLeft}`}
} - {!TAURI && + {(!TAURI || showMisc) &&
diff --git a/src/components/toolbar.tsx b/src/components/toolbar.tsx index ce477d3..83f0ca3 100644 --- a/src/components/toolbar.tsx +++ b/src/components/toolbar.tsx @@ -41,7 +41,7 @@ interface ToolbarButtonProps extends React.PropsWithChildren(function ToolbarButton( +export const ToolbarButton = forwardRef(function ToolbarButton( { children, depressed, ...other }: ToolbarButtonProps, ref, ) { return ( @@ -67,9 +67,11 @@ interface ToolbarProps { setSearchTerms: (terms: string[]) => void, modals: React.RefObject, altSpeedMode: boolean, + extra?: React.ReactNode, toggleFiltersPanel: () => void, toggleDetailsPanel: () => void, toggleMainSplit: () => void, + toggleTabStrip: () => void, } function useButtonHandlers( @@ -211,6 +213,7 @@ function Toolbar(props: ToolbarProps) { ["mod + P", props.toggleMainSplit], ["mod + O", props.toggleFiltersPanel], ["mod + I", props.toggleDetailsPanel], + ["mod + [", props.toggleTabStrip], ]); const onSettingsExport = useCallback(() => { @@ -358,6 +361,11 @@ function Toolbar(props: ToolbarProps) { onClick={props.toggleDetailsPanel} rightSection={{`${modKeyString()} I`}}> Toggle details + {props.extra !== undefined && + {`${modKeyString()} [`}}> + Toggle tab strip + } Interface settings @@ -374,6 +382,8 @@ function Toolbar(props: ToolbarProps) { onClick={handlers.daemonSettings}> + + {props.extra} ); } diff --git a/src/components/webapp.tsx b/src/components/webapp.tsx index 5af74d1..3926bdc 100644 --- a/src/components/webapp.tsx +++ b/src/components/webapp.tsx @@ -54,7 +54,7 @@ export default function WebApp() { - + { }} /> diff --git a/src/config.ts b/src/config.ts index 4d7622b..5251f38 100644 --- a/src/config.ts +++ b/src/config.ts @@ -126,6 +126,7 @@ interface Settings { size: [number, number], position: [number, number] | undefined, }, + showTabStrip: boolean, openTabs: string[], lastTab: number, deleteAdded: boolean, @@ -226,6 +227,7 @@ const DefaultSettings: Settings = { size: [1024, 800], position: undefined, }, + showTabStrip: true, openTabs: [], lastTab: 0, deleteAdded: false,