From b90ac368f75a52742daeb319c927a13ced9fbace Mon Sep 17 00:00:00 2001 From: notmd Date: Mon, 16 Jan 2023 12:27:40 +0700 Subject: [PATCH] wip --- website/package-lock.json | 22 +++++++++++++++++ website/package.json | 1 + website/src/pages/admin/manage_user/[id].tsx | 26 +++++++++++++++++++- 3 files changed, 48 insertions(+), 1 deletion(-) diff --git a/website/package-lock.json b/website/package-lock.json index 3f3d1870..a531a0a6 100644 --- a/website/package-lock.json +++ b/website/package-lock.json @@ -40,6 +40,7 @@ "react": "18.2.0", "react-dom": "18.2.0", "react-feature-flags": "^1.0.0", + "react-hook-form": "^7.42.1", "react-icons": "^4.7.1", "react-table": "^7.8.0", "sharp": "^0.31.3", @@ -32527,6 +32528,21 @@ "node": ">=10" } }, + "node_modules/react-hook-form": { + "version": "7.42.1", + "resolved": "https://registry.npmjs.org/react-hook-form/-/react-hook-form-7.42.1.tgz", + "integrity": "sha512-2UIGqwMZksd5HS55crTT1ATLTr0rAI4jS7yVuqTaoRVDhY2Qc4IyjskCmpnmdYqUNOYFy04vW253tb2JRVh+IQ==", + "engines": { + "node": ">=12.22.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/react-hook-form" + }, + "peerDependencies": { + "react": "^16.8.0 || ^17 || ^18" + } + }, "node_modules/react-icons": { "version": "4.7.1", "resolved": "https://registry.npmjs.org/react-icons/-/react-icons-4.7.1.tgz", @@ -61952,6 +61968,12 @@ } } }, + "react-hook-form": { + "version": "7.42.1", + "resolved": "https://registry.npmjs.org/react-hook-form/-/react-hook-form-7.42.1.tgz", + "integrity": "sha512-2UIGqwMZksd5HS55crTT1ATLTr0rAI4jS7yVuqTaoRVDhY2Qc4IyjskCmpnmdYqUNOYFy04vW253tb2JRVh+IQ==", + "requires": {} + }, "react-icons": { "version": "4.7.1", "resolved": "https://registry.npmjs.org/react-icons/-/react-icons-4.7.1.tgz", diff --git a/website/package.json b/website/package.json index 855feb1d..ed2da87e 100644 --- a/website/package.json +++ b/website/package.json @@ -57,6 +57,7 @@ "react": "18.2.0", "react-dom": "18.2.0", "react-feature-flags": "^1.0.0", + "react-hook-form": "^7.42.1", "react-icons": "^4.7.1", "react-table": "^7.8.0", "sharp": "^0.31.3", diff --git a/website/src/pages/admin/manage_user/[id].tsx b/website/src/pages/admin/manage_user/[id].tsx index 90698f4a..9b460616 100644 --- a/website/src/pages/admin/manage_user/[id].tsx +++ b/website/src/pages/admin/manage_user/[id].tsx @@ -1,9 +1,11 @@ import { Button, Container, FormControl, FormLabel, Input, Select, Stack, useToast } from "@chakra-ui/react"; import { Field, Form, Formik } from "formik"; +import { InferGetServerSidePropsType } from "next"; import Head from "next/head"; import { useRouter } from "next/router"; import { useSession } from "next-auth/react"; import { useEffect } from "react"; +import { useForm } from "react-hook-form"; import { getAdminLayout } from "src/components/Layout"; import { UserMessagesCell } from "src/components/UserMessagesCell"; import { post } from "src/lib/api"; @@ -11,7 +13,16 @@ import { oasstApiClient } from "src/lib/oasst_api_client"; import prisma from "src/lib/prismadb"; import useSWRMutation from "swr/mutation"; -const ManageUser = ({ user }) => { +interface UserForm { + user_id: string; + id: string; + auth_method: string; + display_name: string; + role: string; + notes: string; +} + +const ManageUser = ({ user }: InferGetServerSidePropsType) => { const toast = useToast(); const router = useRouter(); const { data: session, status } = useSession(); @@ -51,6 +62,10 @@ const ManageUser = ({ user }) => { }, }); + const { register } = useForm({ + defaultValues: user, + }); + return ( <> @@ -105,6 +120,15 @@ const ManageUser = ({ user }) => { +
+ + + + + Display Name + + +