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

Configuration moved to Tabs

Browse source
This commit is contained in:
Igor Katson 2023-12-06 15:39:20 +00:00
parent ee996012af
commit 0459fe7358
No known key found for this signature in database
GPG key ID: B4EC22B66D61A3F5
1 changed files with 29 additions and 17 deletions
Download patch file Download diff file Expand all files Collapse all files

46
desktop/src/configure.tsx
View file

@ -1,6 +1,6 @@
import React, { useState } from "react"; import React, { useState } from "react";
import { RqbitDesktopConfig } from "./configuration"; import { RqbitDesktopConfig } from "./configuration";
import { Button, Form, Modal } from "react-bootstrap"; import { Button, Form, Modal, Tab, Tabs } from "react-bootstrap";
import { ErrorComponent } from "./rqbit-webui-src/rqbit-web"; import { ErrorComponent } from "./rqbit-webui-src/rqbit-web";
import { invokeAPI } from "./api"; import { invokeAPI } from "./api";
import { ErrorDetails } from "./rqbit-webui-src/api-types"; import { ErrorDetails } from "./rqbit-webui-src/api-types";
@ -73,8 +73,12 @@ export const ConfigModal: React.FC<{
</Modal.Header> </Modal.Header>
<Modal.Body> <Modal.Body>
<ErrorComponent error={error}></ErrorComponent> <ErrorComponent error={error}></ErrorComponent>
<Form> <Tabs
<fieldset className="mb-3"> defaultActiveKey="main"
id="rqbit-config"
className="mb-3">
<Tab className="mb-3" eventKey="home" title="Home">
<Form.Group controlId="default_download_location"> <Form.Group controlId="default_download_location">
<Form.Label>Default Download Location</Form.Label> <Form.Label>Default Download Location</Form.Label>
<Form.Control <Form.Control
@ -84,9 +88,9 @@ export const ConfigModal: React.FC<{
onChange={handleInputChange} onChange={handleInputChange}
/> />
</Form.Group> </Form.Group>
</fieldset> </Tab>
<fieldset className="mb-3"> <Tab className="mb-3" eventKey="dht" title="DHT">
<legend>DHT config</legend> <legend>DHT config</legend>
<Form.Group controlId="dht_disable"> <Form.Group controlId="dht_disable">
@ -105,6 +109,7 @@ export const ConfigModal: React.FC<{
label="Disable DHT Persistence" label="Disable DHT Persistence"
name="dht.disable_persistence" name="dht.disable_persistence"
checked={config.dht.disable_persistence} checked={config.dht.disable_persistence}
disabled={config.dht.disable}
onChange={handleToggleChange} onChange={handleToggleChange}
/> />
</Form.Group> </Form.Group>
@ -115,12 +120,13 @@ export const ConfigModal: React.FC<{
type="text" type="text"
name="dht.persistence_filename" name="dht.persistence_filename"
value={config.dht.persistence_filename} value={config.dht.persistence_filename}
disabled={config.dht.disable}
onChange={handleInputChange} onChange={handleInputChange}
/> />
</Form.Group> </Form.Group>
</fieldset> </Tab>
<fieldset className="mb-3"> <Tab className="mb-3" eventKey="tcp_listen" title="TCP">
<legend>TCP Listener config</legend> <legend>TCP Listener config</legend>
@ -135,21 +141,23 @@ export const ConfigModal: React.FC<{
</Form.Group> </Form.Group>
<Form.Group controlId="tcp_listen_min_port"> <Form.Group controlId="tcp_listen_min_port">
<Form.Label>TCP Listen Min Port</Form.Label> <Form.Label>Min port</Form.Label>
<Form.Control <Form.Control
type="number" type="number"
name="tcp_listen.min_port" name="tcp_listen.min_port"
value={config.tcp_listen.min_port} value={config.tcp_listen.min_port}
disabled={config.tcp_listen.disable}
onChange={handleInputChange} onChange={handleInputChange}
/> />
</Form.Group> </Form.Group>
<Form.Group controlId="tcp_listen_max_port"> <Form.Group controlId="tcp_listen_max_port">
<Form.Label>TCP Listen Max Port</Form.Label> <Form.Label>Max Port</Form.Label>
<Form.Control <Form.Control
type="number" type="number"
name="tcp_listen.max_port" name="tcp_listen.max_port"
value={config.tcp_listen.max_port} value={config.tcp_listen.max_port}
disabled={config.tcp_listen.disable}
onChange={handleInputChange} onChange={handleInputChange}
/> />
</Form.Group> </Form.Group>
@ -160,14 +168,15 @@ export const ConfigModal: React.FC<{
label="Do not advertise TCP port over UPnP" label="Do not advertise TCP port over UPnP"
name="upnp.disable" name="upnp.disable"
checked={config.upnp.disable} checked={config.upnp.disable}
disabled={config.tcp_listen.disable}
onChange={handleToggleChange} onChange={handleToggleChange}
/> />
</Form.Group> </Form.Group>
</fieldset> </Tab>
<fieldset className="mb-3"> <Tab className="mb-3" eventKey="session_persistence" title="Session">
<legend>Session persistence</legend> <legend>Session persistence</legend>
<Form.Group controlId="persistence_disable"> <Form.Group controlId="persistence_disable">
@ -186,13 +195,14 @@ export const ConfigModal: React.FC<{
type="text" type="text"
name="persistence.filename" name="persistence.filename"
value={config.persistence.filename} value={config.persistence.filename}
disabled={config.persistence.disable}
onChange={handleInputChange} onChange={handleInputChange}
/> />
</Form.Group> </Form.Group>
</fieldset> </Tab>
<fieldset className="mb-3"> <Tab className="mb-3" eventKey="peer_opts" title="Peer options">
<legend>Peer connection options</legend> <legend>Peer connection options</legend>
<Form.Group controlId="peer_opts_connect_timeout"> <Form.Group controlId="peer_opts_connect_timeout">
@ -214,9 +224,9 @@ export const ConfigModal: React.FC<{
onChange={handleInputChange} onChange={handleInputChange}
/> />
</Form.Group> </Form.Group>
</fieldset> </Tab>
<fieldset className="mb-3"> <Tab className="mb-3" eventKey="http_api" title="HTTP API">
<legend>HTTP API config</legend> <legend>HTTP API config</legend>
<Form.Group controlId="http_api_disable"> <Form.Group controlId="http_api_disable">
@ -235,6 +245,7 @@ export const ConfigModal: React.FC<{
type="text" type="text"
name="http_api.listen_addr" name="http_api.listen_addr"
value={config.http_api.listen_addr} value={config.http_api.listen_addr}
disabled={config.http_api.disable}
onChange={handleInputChange} onChange={handleInputChange}
/> />
</Form.Group> </Form.Group>
@ -245,13 +256,14 @@ export const ConfigModal: React.FC<{
label="HTTP API Read Only" label="HTTP API Read Only"
name="http_api.read_only" name="http_api.read_only"
checked={config.http_api.read_only} checked={config.http_api.read_only}
disabled={config.http_api.disable}
onChange={handleToggleChange} onChange={handleToggleChange}
/> />
</Form.Group> </Form.Group>
</fieldset> </Tab>
</Form> </Tabs>
</Modal.Body> </Modal.Body>
<Modal.Footer> <Modal.Footer>
<Button variant="secondary" onClick={() => setConfig(initialConfig)}> <Button variant="secondary" onClick={() => setConfig(initialConfig)}>