1/n Use zustand to reduce re-renders
This commit is contained in:
parent
3dc2e3eace
commit
e6ef3ff23f
14 changed files with 210 additions and 87 deletions
|
|
@ -1,5 +1,5 @@
|
|||
import { useContext, useState } from "react";
|
||||
import { AppContext, APIContext } from "../../context";
|
||||
import { APIContext } from "../../context";
|
||||
import { ErrorWithLabel } from "../../rqbit-web";
|
||||
import { ErrorComponent } from "../ErrorComponent";
|
||||
import { Spinner } from "../Spinner";
|
||||
|
|
@ -7,6 +7,7 @@ import { Modal } from "./Modal";
|
|||
import { ModalBody } from "./ModalBody";
|
||||
import { ModalFooter } from "./ModalFooter";
|
||||
import { Button } from "../buttons/Button";
|
||||
import { useTorrentStore } from "../../stores/torrentStore";
|
||||
|
||||
export const DeleteTorrentModal: React.FC<{
|
||||
id: number;
|
||||
|
|
@ -20,8 +21,8 @@ export const DeleteTorrentModal: React.FC<{
|
|||
const [error, setError] = useState<ErrorWithLabel | null>(null);
|
||||
const [deleting, setDeleting] = useState(false);
|
||||
|
||||
const ctx = useContext(AppContext);
|
||||
const API = useContext(APIContext);
|
||||
const refreshTorrents = useTorrentStore((state) => state.refreshTorrents);
|
||||
|
||||
const close = () => {
|
||||
setDeleteFiles(false);
|
||||
|
|
@ -37,7 +38,7 @@ export const DeleteTorrentModal: React.FC<{
|
|||
|
||||
call(id)
|
||||
.then(() => {
|
||||
ctx.refreshTorrents();
|
||||
refreshTorrents();
|
||||
close();
|
||||
})
|
||||
.catch((e) => {
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import { useCallback, useContext, useEffect, useState } from "react";
|
||||
import { AddTorrentResponse, AddTorrentOptions } from "../../api-types";
|
||||
import { AppContext, APIContext } from "../../context";
|
||||
import { APIContext } from "../../context";
|
||||
import { ErrorComponent } from "../ErrorComponent";
|
||||
import { formatBytes } from "../../helper/formatBytes";
|
||||
import { ErrorWithLabel } from "../../rqbit-web";
|
||||
|
|
@ -14,6 +14,7 @@ import { Fieldset } from "../forms/Fieldset";
|
|||
import { FormInput } from "../forms/FormInput";
|
||||
import { Form } from "../forms/Form";
|
||||
import { FileListInput } from "../FileListInput";
|
||||
import { useTorrentStore } from "../../stores/torrentStore";
|
||||
|
||||
export const FileSelectionModal = (props: {
|
||||
onHide: () => void;
|
||||
|
|
@ -35,7 +36,7 @@ export const FileSelectionModal = (props: {
|
|||
const [uploadError, setUploadError] = useState<ErrorWithLabel | null>(null);
|
||||
const [unpopularTorrent, setUnpopularTorrent] = useState(false);
|
||||
const [outputFolder, setOutputFolder] = useState<string>("");
|
||||
const ctx = useContext(AppContext);
|
||||
const refreshTorrents = useTorrentStore((state) => state.refreshTorrents);
|
||||
const API = useContext(APIContext);
|
||||
|
||||
useEffect(() => {
|
||||
|
|
@ -77,7 +78,7 @@ export const FileSelectionModal = (props: {
|
|||
.then(
|
||||
() => {
|
||||
onHide();
|
||||
ctx.refreshTorrents();
|
||||
refreshTorrents();
|
||||
},
|
||||
(e) => {
|
||||
setUploadError({ text: "Error starting torrent", details: e });
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue