stepus53/dhfs
1
0
Fork 0
mirror of https://github.com/usatiuk/dhfs.git synced 2025-10-28 20:47:49 +01:00
Code Issues Packages Projects Releases Wiki Activity

Improved peer UI

Browse Source
This commit is contained in:
Stepan Usatiuk
2025-04-23 16:37:45 +02:00
parent 2e2eb3ac97
commit 0c04079258
9 changed files with 58 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
webui/src/PeerAvailableCard.tsx
View File

@@ -12,8 +12,14 @@ export function PeerAvailableCard({ peerInfo }: TPeerAvailableCardProps) {
return (
<div className="peerAvailableCard">
<div className={"peerInfo"}>
<span>UUID: </span>
<span>{peerInfo.uuid}</span>
<div>
<span>UUID: </span>
<span>{peerInfo.uuid}</span>
</div>
<div>
<span>Address: </span>
<span>{peerInfo.knownAddress}</span>
</div>
</div>
<fetcher.Form
className="actions"

7
webui/src/PeerKnownCard.tsx
View File

@@ -21,8 +21,15 @@ export function PeerKnownCard({ peerInfo }: TPeerKnownCardProps) {
<div className="peerKnownCard">
<div className={"peerInfo"}>
<div>
<div>
<span>UUID: </span>
<span>{peerInfo.uuid}</span>
</div>
<div>
<span>Address: </span>
<span>{peerInfo.knownAddress || "not connected"}</span>
</div>
</div>
<div>
<fetcher.Form

7
webui/src/PeerState.tsx
View File

@@ -8,9 +8,9 @@ import { PeerKnownCard } from "./PeerKnownCard";
export function PeerState() {
const loaderData = useLoaderData() as LoaderToType<typeof peerStateLoader>;
const knownPeers = loaderData.knownPeers.map((p) => (
<PeerKnownCard peerInfo={p} key={p.uuid} />
));
const knownPeers = loaderData.knownPeers.peers
.filter((p) => p.uuid !== loaderData.knownPeers.selfUuid)
.map((p) => <PeerKnownCard peerInfo={p} key={p.uuid} />);
const availablePeers = loaderData.availablePeers.map((p) => (
<PeerAvailableCard peerInfo={p} key={p.uuid} />
@@ -18,6 +18,7 @@ export function PeerState() {
return (
<div id={"PeerState"}>
<div>Self UUID: {loaderData.knownPeers.selfUuid}</div>
<div>
<div>Known peers</div>
<div>{knownPeers}</div>

12
webui/src/api/PeerState.ts
View File

@@ -1,13 +1,13 @@
import { fetchJSON, fetchJSON_throws } from "./utils";
import {
AvailablePeerInfoToResp,
KnownPeerInfoToResp,
KnownPeersToResp,
NoContentToResp,
PeerAddressInfoToResp,
TAvailablePeerInfoArrTo,
TAvailablePeerInfoToResp,
TKnownPeerInfoArrTo,
TKnownPeerInfoToResp,
TKnownPeerInfoArrTo, TKnownPeersTo,
TKnownPeersToResp,
TNoContentToResp,
TPeerAddressInfoArrTo,
TPeerAddressInfoToResp,
@@ -20,11 +20,11 @@ export async function getAvailablePeers(): Promise<TAvailablePeerInfoArrTo> {
>("/peers-manage/available-peers", "GET", AvailablePeerInfoToResp);
}
export async function getKnownPeers(): Promise<TKnownPeerInfoArrTo> {
return fetchJSON_throws<TKnownPeerInfoToResp, typeof KnownPeerInfoToResp>(
export async function getKnownPeers(): Promise<TKnownPeersTo> {
return fetchJSON_throws<TKnownPeersToResp, typeof KnownPeersToResp>(
"/peers-manage/known-peers",
"GET",
KnownPeerInfoToResp,
KnownPeersToResp,
);
}

12
webui/src/api/dto.ts
View File

@@ -39,6 +39,7 @@ export type TTokenToResp = z.infer<typeof TokenToResp>;
// AvailablePeerInfo
export const AvailablePeerInfoTo = z.object({
uuid: z.string(),
knownAddress: z.string().optional(),
// addr: z.string(),
// port: z.number(),
});
@@ -55,14 +56,21 @@ export type TAvailablePeerInfoToResp = z.infer<typeof AvailablePeerInfoToResp>;
// KnownPeerInfo
export const KnownPeerInfoTo = z.object({
uuid: z.string(),
knownAddress: z.string().optional(),
});
export type TKnownPeerInfoTo = z.infer<typeof KnownPeerInfoTo>;
export const KnownPeerInfoArrTo = z.array(KnownPeerInfoTo);
export type TKnownPeerInfoArrTo = z.infer<typeof KnownPeerInfoArrTo>;
export const KnownPeerInfoToResp = CreateAPIResponse(KnownPeerInfoArrTo);
export type TKnownPeerInfoToResp = z.infer<typeof KnownPeerInfoToResp>;
export const KnownPeersTo = z.object({
selfUuid: z.string(),
peers: KnownPeerInfoArrTo,
});
export type TKnownPeersTo = z.infer<typeof KnownPeersTo>;
export const KnownPeersToResp = CreateAPIResponse(KnownPeersTo);
export type TKnownPeersToResp = z.infer<typeof KnownPeersToResp>;
// PeerAddressInfo
export const PeerAddressInfoTo = z.object({