Fix dropdown not working on page transition

This commit is contained in:
Salman
2024-02-11 00:40:17 +05:30
parent da377f6fda
commit 3f96f0a8fb
@@ -1,4 +1,4 @@
import { FormEvent, useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { useRouter } from "next/router"; import { useRouter } from "next/router";
import { faAt } from "@fortawesome/free-solid-svg-icons"; import { faAt } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
@@ -65,9 +65,7 @@ export const AdminDashboardPage = () => {
} }
}, [config]); }, [config]);
async function handleSubmit(e: FormEvent) { const handleSubmit = async () => {
e.preventDefault();
config.allowSignUp = signUpMode !== "disabled"; config.allowSignUp = signUpMode !== "disabled";
config.inviteOnlySignUp = signUpMode === "invite-only"; config.inviteOnlySignUp = signUpMode === "invite-only";
config.allowSpecificDomainSignUp = signUpMode === "anyone" ? allowSpecificDomain : ""; config.allowSpecificDomainSignUp = signUpMode === "anyone" ? allowSpecificDomain : "";
@@ -99,16 +97,13 @@ export const AdminDashboardPage = () => {
</div> </div>
</TabList> </TabList>
<TabPanel value={TabSections.Settings}> <TabPanel value={TabSections.Settings}>
<form <div className="mb-6 rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-4">
onSubmit={handleSubmit}
className="mb-6 rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-4"
>
<div className="flex justify-between"> <div className="flex justify-between">
<div className="mb-4 text-xl font-semibold text-mineshaft-100"> <div className="mb-4 text-xl font-semibold text-mineshaft-100">
Allow user to Sign Up Allow user to Sign Up
</div> </div>
<Select <Select
className="w-60 bg-mineshaft-700" className="w-72 bg-mineshaft-700"
dropdownContainerClassName="bg-mineshaft-700" dropdownContainerClassName="bg-mineshaft-700"
onValueChange={(state) => setSignUpMode(state as SignUpMode)} onValueChange={(state) => setSignUpMode(state as SignUpMode)}
value={signUpMode} value={signUpMode}
@@ -125,8 +120,8 @@ export const AdminDashboardPage = () => {
<div className="mb-4 flex text-mineshaft-100"> <div className="mb-4 flex text-mineshaft-100">
Allow email with only specific domain Allow email with only specific domain
</div> </div>
<FormControl label="Leave blank to allow any domain handle"> <FormControl label="Leave blank to allow any domain handle" className="w-72">
<div className="w-60"> <div>
<Input <Input
placeholder="domain.com" placeholder="domain.com"
leftIcon={<FontAwesomeIcon icon={faAt} />} leftIcon={<FontAwesomeIcon icon={faAt} />}
@@ -138,10 +133,10 @@ export const AdminDashboardPage = () => {
</div> </div>
)} )}
<Button colorSchema="primary" variant="outline_bg" type="submit"> <Button colorSchema="primary" variant="outline_bg" onClick={handleSubmit}>
Save Save
</Button> </Button>
</form> </div>
</TabPanel> </TabPanel>
</Tabs> </Tabs>
</div> </div>