Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 | 19x 281x 281x 281x 281x 281x | import { useTranslation } from "react-i18next";
import { AmountBadge } from "~app/components/amount-badge";
import { PageHeader } from "~app/components/page-header";
import { EmailVerificationCard } from "~app/features/email-verification/email-verification-card";
import { useConnectionIntentions } from "~app/hooks/use-connection-intentions";
import { useDefaultLimit } from "~app/hooks/use-default-limit";
import { getPathHooks } from "~app/utils/navigation";
import { Icon } from "~components/icons";
import { ButtonLink } from "~components/link";
import { Peers } from "./peers";
export const PeersScreen = () => {
const { useQueryState, useDefaultedQueryState } =
getPathHooks("/_protected/peers/");
const limitState = useDefaultedQueryState("limit", useDefaultLimit());
const offsetState = useQueryState("offset");
const { t } = useTranslation("peers");
return (
<>
<PageHeader
startContent={<Icon name="users" className="size-9" />}
aside={
<>
<ButtonLink
to="/peers/add"
color="primary"
title={t("list.addPeer.button")}
variant="bordered"
isIconOnly
>
<Icon name="add" className="size-6" />
</ButtonLink>
<AmountBadge useAmount={useConnectionIntentions}>
<ButtonLink
key="connections"
to="/peers/connections"
color="primary"
title={t("list.connections.title")}
variant="bordered"
isIconOnly
>
<Icon name="link" className="size-6" />
</ButtonLink>
</AmountBadge>
</>
}
>
{t("list.header")}
</PageHeader>
<EmailVerificationCard />
<Peers limitState={limitState} offsetState={offsetState} />
</>
);
};
|