leyoda/rqbit
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Use react-bs icons, remove bootstrap-icons css

Browse source
This commit is contained in:
Igor Katson 2023-12-07 22:42:19 +00:00
parent eb25ef3cda
commit d768211457
No known key found for this signature in database
GPG key ID: B4EC22B66D61A3F5
24 changed files with 83 additions and 8297 deletions
Download patch file Download diff file Expand all files Collapse all files

20
crates/librqbit/webui/dist/assets/index.js vendored
View file

File diff suppressed because one or more lines are too long

6
crates/librqbit/webui/dist/index.html vendored
View file

@ -12,12 +12,6 @@
integrity="sha384-9ndCyUaIbzAi2FUVXJi0CjmCapSmO7SnpJef0486qhLnuZ2cdeRhO02iuK6FUUVM"
crossorigin="anonymous"
/>
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css"
integrity="sha384-4LISF5TTJX/fLmGSxO53rV4miRxdg84mZsxmO8Rx5jGtp/LbrixFETvWa5a6sESd"
crossorigin="anonymous"
/>
<script type="module" crossorigin src="assets/index.js"></script>
</head>

2
crates/librqbit/webui/dist/manifest.json vendored
View file

@ -4,7 +4,7 @@
"src": "assets/logo.svg"
},
"index.html": {
"file": "assets/index-9523ae4e.js",
"file": "assets/index-8d982016.js",
"isEntry": true,
"src": "index.html"
}

6
crates/librqbit/webui/index.html
View file

@ -12,12 +12,6 @@
integrity="sha384-9ndCyUaIbzAi2FUVXJi0CjmCapSmO7SnpJef0486qhLnuZ2cdeRhO02iuK6FUUVM"
crossorigin="anonymous"
/>
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css"
integrity="sha384-4LISF5TTJX/fLmGSxO53rV4miRxdg84mZsxmO8Rx5jGtp/LbrixFETvWa5a6sESd"
crossorigin="anonymous"
/>
</head>
<body>

8
crates/librqbit/webui/node_modules/.package-lock.json generated vendored
View file

@ -393,6 +393,14 @@
"react": "^18.2.0"
}
},
"node_modules/react-icons": {
"version": "4.12.0",
"resolved": "https://registry.npmjs.org/react-icons/-/react-icons-4.12.0.tgz",
"integrity": "sha512-IBaDuHiShdZqmfc/TwHu6+d6k2ltNCf3AszxNmjJc1KUfXdEeRJOKyNvLmAHaarhzGmTSVygNdyu8/opXv2gaw==",
"peerDependencies": {
"react": "*"
}
},
"node_modules/react-is": {
"version": "16.13.1",
"resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",

11
crates/librqbit/webui/package-lock.json generated
View file

@ -7,7 +7,8 @@
"dependencies": {
"react": "^18.2.0",
"react-bootstrap": "^2.9.1",
"react-dom": "^18.2.0"
"react-dom": "^18.2.0",
"react-icons": "^4.12.0"
},
"devDependencies": {
"@types/react": "^18.2.38",
@ -743,6 +744,14 @@
"react": "^18.2.0"
}
},
"node_modules/react-icons": {
"version": "4.12.0",
"resolved": "https://registry.npmjs.org/react-icons/-/react-icons-4.12.0.tgz",
"integrity": "sha512-IBaDuHiShdZqmfc/TwHu6+d6k2ltNCf3AszxNmjJc1KUfXdEeRJOKyNvLmAHaarhzGmTSVygNdyu8/opXv2gaw==",
"peerDependencies": {
"react": "*"
}
},
"node_modules/react-is": {
"version": "16.13.1",
"resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",

3
crates/librqbit/webui/package.json
View file

@ -9,7 +9,8 @@
"dependencies": {
"react": "^18.2.0",
"react-bootstrap": "^2.9.1",
"react-dom": "^18.2.0"
"react-dom": "^18.2.0",
"react-icons": "^4.12.0"
},
"devDependencies": {
"@types/react": "^18.2.38",

4
crates/librqbit/webui/src/components/DeleteTorrentModal.tsx
View file

@ -1,7 +1,7 @@
import { useContext, useState } from "react";
import { Button, Modal, Form, Spinner } from "react-bootstrap";
import { AppContext, APIContext } from "../context";
import { Error } from "../rqbit-web";
import { ErrorWithLabel } from "../rqbit-web";
import { ErrorComponent } from "./ErrorComponent";
export const DeleteTorrentModal: React.FC<{
@ -13,7 +13,7 @@ export const DeleteTorrentModal: React.FC<{
return null;
}
const [deleteFiles, setDeleteFiles] = useState(false);
const [error, setError] = useState<Error | null>(null);
const [error, setError] = useState<ErrorWithLabel | null>(null);
const [deleting, setDeleting] = useState(false);
const ctx = useContext(AppContext);

4
crates/librqbit/webui/src/components/ErrorComponent.tsx
View file

@ -1,8 +1,8 @@
import { Alert } from "react-bootstrap";
import { Error } from "../rqbit-web";
import { ErrorWithLabel } from "../rqbit-web";
export const ErrorComponent = (props: {
error: Error | null;
error: ErrorWithLabel | null;
remove?: () => void;
}) => {
let { error, remove } = props;

6
crates/librqbit/webui/src/components/FileSelectionModal.tsx
View file

@ -4,12 +4,12 @@ import { AddTorrentResponse, AddTorrentOptions } from "../api-types";
import { AppContext, APIContext } from "../context";
import { ErrorComponent } from "./ErrorComponent";
import { formatBytes } from "../helper/formatBytes";
import { Error } from "../rqbit-web";
import { ErrorWithLabel } from "../rqbit-web";
export const FileSelectionModal = (props: {
onHide: () => void;
listTorrentResponse: AddTorrentResponse | null;
listTorrentError: Error | null;
listTorrentError: ErrorWithLabel | null;
listTorrentLoading: boolean;
data: string | File;
}) => {
@ -23,7 +23,7 @@ export const FileSelectionModal = (props: {
const [selectedFiles, setSelectedFiles] = useState<number[]>([]);
const [uploading, setUploading] = useState(false);
const [uploadError, setUploadError] = useState<Error | null>(null);
const [uploadError, setUploadError] = useState<ErrorWithLabel | null>(null);
const [unpopularTorrent, setUnpopularTorrent] = useState(false);
const [outputFolder, setOutputFolder] = useState<string>("");
const ctx = useContext(AppContext);

11
crates/librqbit/webui/src/components/IconButton.tsx
View file

@ -1,11 +1,11 @@
import { MouseEventHandler } from "react";
export const IconButton: React.FC<{
className: string;
onClick: () => void;
disabled?: boolean;
color?: string;
}> = ({ className, onClick, disabled, color }) => {
children: any;
}> = ({ onClick, disabled, color, children }) => {
const onClickStopPropagation: MouseEventHandler<HTMLAnchorElement> = (e) => {
e.stopPropagation();
if (disabled) {
@ -13,11 +13,14 @@ export const IconButton: React.FC<{
}
onClick();
};
const colorClassName = color ? `text-${color}` : "";
return (
<a
className={`bi ${className} p-1`}
className={`p-1 ${colorClassName}`}
onClick={onClickStopPropagation}
href="#"
></a>
>
{children}
</a>
);
};

27
crates/librqbit/webui/src/components/TorrentActions.tsx
View file

@ -4,6 +4,7 @@ import { TorrentStats } from "../api-types";
import { AppContext, APIContext, RefreshTorrentStatsContext } from "../context";
import { IconButton } from "./IconButton";
import { DeleteTorrentModal } from "./DeleteTorrentModal";
import { BsPauseCircle, BsPlayCircle, BsXCircle } from "react-icons/bs";
export const TorrentActions: React.FC<{
id: number;
@ -70,26 +71,18 @@ export const TorrentActions: React.FC<{
<Row>
<Col>
{canUnpause && (
<IconButton
className="bi-play-circle"
onClick={unpause}
disabled={disabled}
color="success"
/>
<IconButton onClick={unpause} disabled={disabled} color="success">
<BsPlayCircle />
</IconButton>
)}
{canPause && (
<IconButton
className="bi-pause-circle"
onClick={pause}
disabled={disabled}
/>
<IconButton onClick={pause} disabled={disabled}>
<BsPauseCircle />
</IconButton>
)}
<IconButton
className="bi-x-circle"
onClick={startDeleting}
disabled={disabled}
color="danger"
/>
<IconButton onClick={startDeleting} disabled={disabled} color="danger">
<BsXCircle />
</IconButton>
<DeleteTorrentModal id={id} show={deleting} onHide={cancelDeleting} />
</Col>
</Row>

8
crates/librqbit/webui/src/components/TorrentRow.tsx
View file

@ -30,10 +30,10 @@ export const TorrentRow: React.FC<{
const progressBarVariant = error
? "danger"
: finished
? "success"
: state == STATE_INITIALIZING
? "warning"
: "primary";
? "success"
: state == STATE_INITIALIZING
? "warning"
: "primary";
const formatPeersString = () => {
let peer_stats = statsResponse?.live?.snapshot.peer_stats;

5
crates/librqbit/webui/src/components/UploadButton.tsx
View file

@ -5,7 +5,7 @@ import {
ErrorDetails as ApiErrorDetails,
} from "../api-types";
import { APIContext } from "../context";
import { Error } from "../rqbit-web";
import { ErrorWithLabel } from "../rqbit-web";
import { FileSelectionModal } from "./FileSelectionModal";
export const UploadButton: React.FC<{
@ -18,7 +18,8 @@ export const UploadButton: React.FC<{
const [loading, setLoading] = useState(false);
const [listTorrentResponse, setListTorrentResponse] =
useState<AddTorrentResponse | null>(null);
const [listTorrentError, setListTorrentError] = useState<Error | null>(null);
const [listTorrentError, setListTorrentError] =
useState<ErrorWithLabel | null>(null);
const API = useContext(APIContext);
// Get the torrent file list if there's data.

10
crates/librqbit/webui/src/rqbit-web.tsx
View file

@ -4,19 +4,21 @@ import { AppContext, APIContext } from "./context";
import { RootContent } from "./components/RootContent";
import { customSetInterval } from "./helper/customSetInterval";
export interface Error {
export interface ErrorWithLabel {
text: string;
details?: ApiErrorDetails;
}
export interface ContextType {
setCloseableError: (error: Error | null) => void;
setCloseableError: (error: ErrorWithLabel | null) => void;
refreshTorrents: () => void;
}
export const RqbitWebUI = (props: { title: string }) => {
const [closeableError, setCloseableError] = useState<Error | null>(null);
const [otherError, setOtherError] = useState<Error | null>(null);
const [closeableError, setCloseableError] = useState<ErrorWithLabel | null>(
null
);
const [otherError, setOtherError] = useState<ErrorWithLabel | null>(null);
const [torrents, setTorrents] = useState<Array<TorrentId> | null>(null);
const [torrentsLoading, setTorrentsLoading] = useState(false);