From 6088b428767abfc51998ca8b7f6b5f6994e9ff3b Mon Sep 17 00:00:00 2001
From: crupest <crupest@outlook.com>
Date: Sat, 30 Apr 2022 23:19:10 +0800
Subject: ...

---
 FrontEnd/src/http/user.ts                       | 14 ++++++++++----
 FrontEnd/src/index.tsx                          |  7 +++++--
 FrontEnd/src/views/admin/UserAdmin.tsx          |  2 +-
 FrontEnd/src/views/common/button/IconButton.tsx |  2 ++
 4 files changed, 18 insertions(+), 7 deletions(-)

(limited to 'FrontEnd')

diff --git a/FrontEnd/src/http/user.ts b/FrontEnd/src/http/user.ts
index bc8ad980..5f117078 100644
--- a/FrontEnd/src/http/user.ts
+++ b/FrontEnd/src/http/user.ts
@@ -1,4 +1,10 @@
-import { axios, apiBaseUrl, extractResponseData, extractEtag } from "./common";
+import {
+  axios,
+  apiBaseUrl,
+  extractResponseData,
+  extractEtag,
+  Page,
+} from "./common";
 
 export const kUserManagement = "UserManagement";
 export const kAllTimelineManagement = "AllTimelineManagement";
@@ -44,7 +50,7 @@ export interface HttpRegisterCode {
 }
 
 export interface IHttpUserClient {
-  list(): Promise<HttpUser[]>;
+  list(): Promise<Page<HttpUser>>;
   get(username: string): Promise<HttpUser>;
   post(req: HttpCreateUserRequest): Promise<HttpUser>;
   patch(username: string, req: HttpUserPatchRequest): Promise<HttpUser>;
@@ -72,9 +78,9 @@ export interface IHttpUserClient {
 }
 
 export class HttpUserClient implements IHttpUserClient {
-  list(): Promise<HttpUser[]> {
+  list(): Promise<Page<HttpUser>> {
     return axios
-      .get<HttpUser[]>(`${apiBaseUrl}/v2/users`)
+      .get<Page<HttpUser>>(`${apiBaseUrl}/v2/users`)
       .then(extractResponseData);
   }
 
diff --git a/FrontEnd/src/index.tsx b/FrontEnd/src/index.tsx
index 833e2ab8..ea940004 100644
--- a/FrontEnd/src/index.tsx
+++ b/FrontEnd/src/index.tsx
@@ -4,7 +4,7 @@ import "core-js/modules/es.array.iterator";
 import "pepjs";
 
 import React from "react";
-import ReactDOM from "react-dom";
+import { createRoot } from "react-dom/client";
 
 import "./index.css";
 
@@ -14,4 +14,7 @@ import "./service-worker";
 
 import App from "./App";
 
-ReactDOM.render(<App />, document.getElementById("app"));
+const container = document.getElementById("app");
+// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+const root = createRoot(container!);
+root.render(<App />);
diff --git a/FrontEnd/src/views/admin/UserAdmin.tsx b/FrontEnd/src/views/admin/UserAdmin.tsx
index 02fb0d12..d6480bf4 100644
--- a/FrontEnd/src/views/admin/UserAdmin.tsx
+++ b/FrontEnd/src/views/admin/UserAdmin.tsx
@@ -262,7 +262,7 @@ const UserAdmin: React.FC = () => {
       .list()
       .then((us) => {
         if (subscribe) {
-          setUsers(us);
+          setUsers(us.items);
         }
       });
     return () => {
diff --git a/FrontEnd/src/views/common/button/IconButton.tsx b/FrontEnd/src/views/common/button/IconButton.tsx
index 89f570d4..74d7dd36 100644
--- a/FrontEnd/src/views/common/button/IconButton.tsx
+++ b/FrontEnd/src/views/common/button/IconButton.tsx
@@ -3,6 +3,8 @@ import classNames from "classnames";
 
 import { PaletteColorType } from "@/palette";
 
+import "./IconButton.css";
+
 export type IconButtonProps = {
   icon: string;
   color?: PaletteColorType;
-- 
cgit v1.2.3