TobaOjo/Mav-Mobile-UI
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

updated NPED code

Browse Source
This commit is contained in:
Toba Ojo
2025-08-29 10:07:59 +01:00
parent 5ededd8e05
commit d2b8827987
16 changed files with 285 additions and 150 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
src/components/SettingForms/NPED/NPEDCard.tsx
View File

@@ -1,8 +1,11 @@
import Card from "../../UI/Card";
import CardHeader from "../../UI/CardHeader";
import NPEDFields from "./NPEDFields";
import { useNPEDContext } from "../../../context/NPEDUserContext";
const NPEDCard = () => {
const { user } = useNPEDContext();
console.log(user);
return (
<Card>
<CardHeader title={"NPED Config"} />

123
src/components/SettingForms/NPED/NPEDFields.tsx
View File

@@ -1,62 +1,97 @@
import { Form, Formik, Field } from "formik";
import FormGroup from "../components/FormGroup";
import type { NPEDFieldType } from "../../../types/types";
import { useNPEDAuth } from "../../../hooks/useNPEDAuh";
import type { NPEDErrorValues, NPEDFieldType } from "../../../types/types";
import { useNPEDAuth } from "../../../hooks/useNPEDAuth";
import { toast } from "sonner";
const NPEDFields = () => {
const { signIn, isError } = useNPEDAuth();
const { signIn } = useNPEDAuth();
const initialValues = {
username: "",
password: "",
clientId: "",
frontId: "NPEDFront",
rearId: "NPEDRear",
};
const handleSubmit = (values: NPEDFieldType) => {
console.log(isError);
signIn(values);
const valuesToSend = {
...values,
};
signIn(valuesToSend);
toast("Signed in successfully");
};
const validateValues = (values: NPEDFieldType) => {
const errors: NPEDErrorValues = {};
if (!values.username) errors.username = "Required";
if (!values.password) errors.password = "Required";
if (!values.clientId) errors.clientId = "Required";
return errors;
};
return (
<Formik initialValues={initialValues} onSubmit={handleSubmit}>
<Form className="flex flex-col space-y-2">
<FormGroup>
<label htmlFor="username">Username</label>
<Field
name="username"
type="text"
id="username"
placeholder="NPED username"
className="p-1.5 border border-gray-400 rounded-lg"
/>
</FormGroup>
<FormGroup>
<label htmlFor="password">Password</label>
<Field
name="password"
type="password"
id="password"
placeholder="NPED Password"
className="p-1.5 border border-gray-400 rounded-lg"
/>
</FormGroup>
<FormGroup>
<label htmlFor="clientId">Client ID</label>
<Field
name="clientId"
type="text"
id="clientId"
placeholder="NPED client ID"
className="p-1.5 border border-gray-400 rounded-lg"
/>
</FormGroup>
<button
type="submit"
className="w-1/4 text-white bg-green-700 hover:bg-green-800 font-small rounded-lg text-sm px-2 py-2.5"
>
Login
</button>
</Form>
<Formik
initialValues={initialValues}
onSubmit={handleSubmit}
validate={validateValues}
>
{({ errors, touched }) => (
<Form className="flex flex-col space-y-5">
<FormGroup>
<label htmlFor="username">Username</label>
{touched.username && errors.username && (
<small className="absolute right-0 -top-5 text-red-500">
{errors.username}
</small>
)}
<Field
name="username"
type="text"
id="username"
placeholder="NPED username"
className="p-1.5 border border-gray-400 rounded-lg"
/>
</FormGroup>
<FormGroup>
<label htmlFor="password">Password</label>
{touched.password && errors.password && (
<small className="absolute right-0 -top-5 text-red-500">
{errors.password}
</small>
)}
<Field
name="password"
type="password"
id="password"
placeholder="NPED Password"
className="p-1.5 border border-gray-400 rounded-lg"
/>
</FormGroup>
<FormGroup>
<label htmlFor="clientId">Client ID</label>
{touched.clientId && errors.clientId && (
<small className="absolute right-0 -top-5 text-red-500">
{errors.clientId}
</small>
)}
<Field
name="clientId"
type="text"
id="clientId"
placeholder="NPED client ID"
className="p-1.5 border border-gray-400 rounded-lg"
/>
</FormGroup>
<button
type="submit"
className="w-1/4 text-white bg-green-700 hover:bg-green-800 font-small rounded-lg text-sm px-2 py-2.5"
>
Login
</button>
</Form>
)}
</Formik>
);
};