Ability to change the list of files at any time, including through UI (#115)

* Now can update the list of files without pausing/unpausing

* Shrink a few functions

* Reopen write when updating files

* Todos

* opened_file abstraction

* iter_pieces_within iterator

* Simplify iter_pieces_within

* Simplify iter_pieces_within

* Add "iter_file_details"

* temporarily broken: readonly by default

* Live torrent - reopen files

* Reopen files after changing the list

* Now reopening files read only when they are completed

* Fix a bug in opened_file.rs

* update todos

* update help

* Reconnect all peers that are idling

* Add a couple fields to OpenedFile

* Add a couple fields to OpenedFile

* Small cleanups - use the new iterator where possible

* size_of_piece_in_file function

* Updating have

* Include file progress

* Almost nothing

* ugly progress bars

* bad UI, saving

* its not so bad

* Works now

* update progress bar a bit

* Reopen read-only on pause

* Zero bytes isnt too bad! Doesnt break anything

* fix per file progress bars

* progress bar not as ugly anymore?

* ui tweaks

* fix a react bug

* TODO.md update

* Fix js + TODOs

* Compute per-file progress on init

* Fix stats updating live

* Nothing

* Nothing

* cleanup ui a bit

* Nothing

* Final fixes

* Trying to fix rust 1.73

* Sorting filenames

* remove unnecessary indentation

* Remove unnecessary comment

crates/librqbit/webui/src/components/buttons/IconButton.tsx

@@ -19,7 +19,7 @@ export const IconButton: React.FC<{
   const colorClassName = color ? `text-${color}` : "";
   return (
     <a
-      className={`block p-1 text-blue-500 flex items-center justify-center ${colorClassName} ${className}`}
+      className={`p-1 text-blue-500 flex items-center justify-center ${colorClassName} ${className}`}
       onClick={onClickStopPropagation}
       href="#"
       {...otherProps}

crates/librqbit/webui/src/components/buttons/TorrentActions.tsx

@@ -1,22 +1,21 @@
 import { useContext, useState } from "react";
-import { TorrentDetails, TorrentStats } from "../../api-types";
+import { TorrentStats } from "../../api-types";
 import { APIContext, RefreshTorrentStatsContext } from "../../context";
 import { IconButton } from "./IconButton";
 import { DeleteTorrentModal } from "../modal/DeleteTorrentModal";
-import { TorrentSettingsModal } from "../modal/TorrentSettingsModal";
 import { FaCog, FaPause, FaPlay, FaTrash } from "react-icons/fa";
 import { useErrorStore } from "../../stores/errorStore";
 
 export const TorrentActions: React.FC<{
   id: number;
-  detailsResponse: TorrentDetails | null;
   statsResponse: TorrentStats;
-}> = ({ id, detailsResponse, statsResponse }) => {
+  extendedView: boolean;
+  setExtendedView: (extendedView: boolean) => void;
+}> = ({ id, statsResponse, extendedView, setExtendedView }) => {
   let state = statsResponse.state;
 
   let [disabled, setDisabled] = useState<boolean>(false);
   let [deleting, setDeleting] = useState<boolean>(false);
-  let [configuring, setConfiguring] = useState<boolean>(false);
 
   let refreshCtx = useContext(RefreshTorrentStatsContext);
 
@@ -62,10 +61,6 @@ export const TorrentActions: React.FC<{
       .finally(() => setDisabled(false));
   };
 
-  const openConfigureModal = () => {
-    setConfiguring(true);
-  };
-
   const startDeleting = () => {
     setDisabled(true);
     setDeleting(true);
@@ -89,7 +84,10 @@ export const TorrentActions: React.FC<{
         </IconButton>
       )}
       {canConfigure && (
-        <IconButton onClick={openConfigureModal} disabled={disabled}>
+        <IconButton
+          onClick={() => setExtendedView(!extendedView)}
+          disabled={disabled}
+        >
           <FaCog className="hover:text-green-600" />
         </IconButton>
       )}
@@ -97,14 +95,6 @@ export const TorrentActions: React.FC<{
         <FaTrash className="hover:text-red-500" />
       </IconButton>
       <DeleteTorrentModal id={id} show={deleting} onHide={cancelDeleting} />
-      {detailsResponse && configuring && (
-        <TorrentSettingsModal
-          id={id}
-          show={configuring}
-          details={detailsResponse}
-          onHide={() => setConfiguring(false)}
-        />
-      )}
     </div>
   );
 };