From cd1fe2005af4d7fcae63ec5fe2455653779777ce Mon Sep 17 00:00:00 2001
From: Myzel394 <50424412+Myzel394@users.noreply.github.com>
Date: Thu, 2 Feb 2023 21:23:50 +0100
Subject: [PATCH] added ReservedAliasesList.tsx

---
 .../AdminPage/ReservedAliasesList.tsx         | 32 +++++++++++++++++++
 1 file changed, 32 insertions(+)
 create mode 100644 src/route-widgets/AdminPage/ReservedAliasesList.tsx

diff --git a/src/route-widgets/AdminPage/ReservedAliasesList.tsx b/src/route-widgets/AdminPage/ReservedAliasesList.tsx
new file mode 100644
index 0000000..b856845
--- /dev/null
+++ b/src/route-widgets/AdminPage/ReservedAliasesList.tsx
@@ -0,0 +1,32 @@
+import {ReactElement} from "react"
+import {AxiosError} from "axios"
+
+import {useQuery} from "@tanstack/react-query"
+import {List, ListItem, ListItemText} from "@mui/material"
+
+import {getReservedAliases} from "~/apis"
+import {PaginationResult, ReservedAlias} from "~/server-types"
+import {QueryResult} from "~/components"
+
+export interface ReservedAliasesListProps {}
+
+export default function ReservedAliasesList({}: ReservedAliasesListProps): ReactElement {
+	const query = useQuery<PaginationResult<ReservedAlias>, AxiosError>(
+		["getReservedAliases"],
+		() => getReservedAliases(),
+	)
+
+	return (
+		<QueryResult<PaginationResult<ReservedAlias>, AxiosError> query={query}>
+			{({items}) => (
+				<List>
+					{items.map(alias => (
+						<ListItem key={alias.id}>
+							<ListItemText primary={`${alias.local}@${alias.domain}`} />
+						</ListItem>
+					))}
+				</List>
+			)}
+		</QueryResult>
+	)
+}