@solidstarters/solid-core-ui 1.1.73 → 1.1.75

package/dist/components/auth/Register.tsx

@@ -1,239 +0,0 @@
-"use client";
-
-import { useRegisterMutation } from "@/redux/api/authApi";
-import { FetchBaseQueryError } from "@reduxjs/toolkit/query/react";
-import { useFormik } from "formik";
-import Link from "next/link";
-import { useRouter } from "next/navigation";
-import { Button } from "primereact/button";
-import { Checkbox } from "primereact/checkbox";
-import { Divider } from "primereact/divider";
-import { InputText } from "primereact/inputtext";
-import { Message } from "primereact/message";
-import { Password } from "primereact/password";
-import { Toast } from "primereact/toast";
-import { classNames } from "primereact/utils";
-import { ChangeEventHandler, useEffect, useRef, useState } from "react";
-import * as Yup from "yup";
-import AuthBanner from "../common/AuthBanner";
-import { SocialMediaLogin } from "../common/SocialMediaLogin";
-
-const Register = () => {
-  const toast = useRef<Toast>(null);
-  const [password, setPassword] = useState("");
-  const [checked, setChecked] = useState<boolean>(false);
-  const [showPassword, setShowPassword] = useState(false);
-  const [user, setUser] = useState({
-    name: "",
-    email: "",
-    password: "",
-  });
-
-  const validationSchema = Yup.object({
-    username: Yup.string().required("User Name is required"),
-    email: Yup.string()
-      .email("Invalid email address")
-      .required("Email is required"),
-    password: Yup.string().required("Password is required"),
-  });
-
-  const router = useRouter();
-
-  const isFormFieldValid = (formik: any, fieldName: string) =>
-    formik.touched[fieldName] && formik.errors[fieldName];
-
-  const [register, { isLoading, error, isSuccess,data }] = useRegisterMutation();
-
-  const onChange: ChangeEventHandler<HTMLInputElement> = (e) => {
-    setUser({ ...user, [e.target.name]: e.target.value });
-  };
-
-  const initialValues = {
-    username: "",
-    email: "",
-    password: "",
-  }
-
-  const formik = useFormik({
-    initialValues,
-    validationSchema,
-    enableReinitialize: true,
-    onSubmit: async (values) => {
-      try {
-      const userData = {
-        username: values.username,
-        email: values.email,
-        password: values.password,
-      };
-
-      await register(userData);
-      } catch (err) {
-        console.log('inside', err);
-      } 
-    }
-  });
-
-  const showError = () => {
-    if (error) {
-      if ("data" in error) {
-        const apiError = error as FetchBaseQueryError;
-        const errorMessages = Array.isArray(apiError.data?.message)
-          ? apiError.data?.message
-          : [apiError.data?.message];
-
-        toast.current?.show({
-          severity: "error",
-          summary: "Error",
-          detail: errorMessages.join(", "),
-          life: 3000,
-        });
-      } else {
-        const serializedError = error as Error;
-        toast.current?.show({
-          severity: "error",
-          summary: "Error",
-          detail: serializedError.message || "An error occurred",
-          life: 3000,
-        });
-      }
-    }
-  };
-
-  useEffect(() => {
-    if (error) {
-      showError();
-    }
-  }, [error]);
-
-  useEffect(() => {
-    if (isSuccess) {
-      router.replace("/auth/login");
-    }
-  }, [isSuccess])
-  
-  return (
-    <div className="h-screen">
-      <Toast ref={toast} />
-      <div className="grid m-0 h-full">
-        <div className="col-12 md:col-12 lg:col-6">
-          <div className="flex justify-content-center align-items-center h-full">
-            <div className="col-12 sm:col-8">
-              <h2 className="text-4xl text-semibold text-start secondary-color mb-0">
-                Sign up to Radix Solutions
-              </h2>
-              <p className="text-sm">Create your account</p>
-                  <form onSubmit={formik.handleSubmit}>
-                    <div className="flex flex-column gap-2">
-                      <label
-                        htmlFor="username"
-                        className="text-color-secondary"
-                      >
-                        Username
-                      </label>
-                      <InputText
-                        id="username"
-                        name="username"
-                        placeholder="username"
-                        onChange={formik.handleChange}
-                        value={formik.values.username}
-                        className={classNames("p-inputtext-sm w-full", {
-                          "p-invalid": isFormFieldValid(formik, "name"),
-                        })}
-                      />
-                      {isFormFieldValid(formik, "username") && <Message
-                        className="text-red-500 text-sm"
-                        severity="error" 
-                        text={formik?.errors?.username?.toString()}
-                      />}
-                    </div>
-                    <div className="flex flex-column gap-2 mt-4">
-                      <label htmlFor="email" className="text-color-secondary">
-                        Email
-                      </label>
-                      {/* <img
-                                                                style={{ cursor: "pointer" }}
-                                                                src={`/images/mail-icon.png`}
-                                                                alt="Solid"
-                                                            /> */}
-                      <InputText
-                        id="email"
-                        name="email"
-                        placeholder="Yourgmail@123.com"
-                        onChange={formik.handleChange}
-                        value={formik.values.email}
-                        className={classNames("p-inputtext-sm w-full", {
-                          "p-invalid": isFormFieldValid(formik, "name"),
-                        })}
-                      />
-                      {isFormFieldValid(formik, "email") && <Message
-                        className="text-red-500 text-sm"
-                        severity="error" text={formik?.errors?.email?.toString()}
-                      />}
-                    </div>
-                    <div className="flex flex-column gap-2 mt-4" style={{}}>
-                      <label
-                        htmlFor="password"
-                        className="text-color-secondary"
-                      >
-                        Password
-                      </label>
-                      <Password
-                        id="password"
-                        name="password"
-                        value={formik.values.password}
-                        onChange={formik.handleChange}
-                        // value={formik.values.password}}
-                        toggleMask
-                        inputClassName="w-full"
-                        className={classNames("p-inputtext-sm w-full s-password-input", {
-                          "p-invalid": isFormFieldValid(formik, "password"),
-                        })}
-                      />
-                      {isFormFieldValid(formik, "password") && <Message
-                        className="text-red-500 text-sm"
-                        severity="error" text={formik?.errors?.password?.toString()}
-                      />}
-                    </div>
-                    <div className="flex align-items-center mt-4">
-                      <Checkbox
-                        inputId="remember"
-                        onChange={(e: any) => setChecked(e.checked)}
-                        checked={checked}
-                      />
-                      <label htmlFor="remember" className="ml-2">
-                        Remember me
-                      </label>
-                    </div>
-                    <div className="mt-4">
-                      <Button
-                        className="w-full secondary-bg-color"
-                        label="Create your account"
-                        style={{ borderColor: "currentcolor" }}
-                        type="submit"
-                      />
-                    </div>
-                  </form>
-              <Divider align="center">
-                <div className="inline-flex align-items-center text-400">
-                  or continue with
-                </div>
-              </Divider>
-              <div className="text-center">
-                <div className="text-sm text-400">
-                  Don’t have an account ?{" "}
-                  <Link href="/auth/login">Sign in</Link>
-                </div>
-              </div>
-              <SocialMediaLogin />
-            </div>
-          </div>
-        </div>
-        <div className="col-12 md:col-12 lg:col-6 hidden lg:block p-0">
-          <AuthBanner></AuthBanner>
-        </div>
-      </div>
-    </div>
-  );
-};
-
-export default Register;

package/dist/components/auth/SolidChangeForcePassword.tsx

@@ -1,145 +0,0 @@
-"use client"
-import { useChangePasswordMutation } from '@/redux/api/authApi';
-import { useFormik } from 'formik';
-import { signOut, useSession } from 'next-auth/react';
-import { Button } from 'primereact/button';
-import { InputText } from 'primereact/inputtext';
-import { Message } from 'primereact/message';
-import { Password } from 'primereact/password';
-import { Toast } from 'primereact/toast';
-import { classNames } from 'primereact/utils';
-import { useRef } from 'react';
-import * as Yup from 'yup';
-const SolidChangeForcePassword = () => {
-    const toast = useRef<Toast>(null);
-    const [changePassword] = useChangePasswordMutation();
-
-    const session: any = useSession();
-    const showToast = (severity: "success" | "error", summary: string, detail: string) => {
-        toast.current?.show({
-            severity,
-            summary,
-            detail,
-            life: 3000,
-        });
-    };
-    const validationSchema = Yup.object({
-        email: Yup.string().email('Invalid email format').required('Email is required'),
-        currentPassword: Yup.string().min(6, 'Password must be at least 6 characters').required('Current password is required'),
-        newPassword: Yup.string().min(6, 'Password must be at least 6 characters').required('New password is required'),
-        confirmPassword: Yup.string().oneOf([Yup.ref('newPassword')], 'Passwords must match').required('Confirm password is required'),
-        id: Yup.number().required('User ID is required'),
-    });
-    const formik = useFormik({
-        initialValues: {
-            email: session?.data?.user?.user?.email,
-            currentPassword: "",
-            newPassword: "",
-            confirmPassword: "",
-            id: session?.data?.user?.user?.id,
-        },
-        validationSchema,
-        onSubmit: async (values, { setErrors }) => {
-            try {
-                const payload = {
-                    id: values.id,
-                    email: session?.data?.user?.user?.email,
-                    currentPassword: values.currentPassword,
-                    newPassword: values.newPassword,
-                };
-                console.log("Payload:", payload);
-
-                // Call the mutation and handle the response
-                const response = await changePassword(payload).unwrap(); // Await the API call and unwrap to handle errors.
-                if (response?.error) {
-                    showToast("error", "Error", response.error)
-                    setErrors({
-                        currentPassword: "Incorrect Current Password",
-                        newPassword: "Passwords must match",
-                        confirmPassword: "Passwords must match",
-                    })
-                } else {
-                    showToast("success", "Force Password Change Success", "Password Change Successfully");
-                    signOut({ callbackUrl: "/auth/login" })
-                }
-            } catch (err: any) {
-                showToast("error", "Login Failed", err?.data?.message);
-                // setErrors({
-                //     currentPassword: "Incorrect Current Password",
-                // })
-            }
-        },
-    });
-    const isFormFieldValid = (formik: any, fieldName: string) =>
-        formik.touched[fieldName] && formik.errors[fieldName];
-
-    return (
-        <>
-            <Toast ref={toast} />
-
-            <form onSubmit={formik.handleSubmit} className='d-flex flex-column gap-3 auth-form'>
-                <div className="flex flex-column gap-2 mt-2" style={{}}>
-                    <label htmlFor="currentPassword" className="solid-auth-input-label">Current Password</label>
-                    <Password
-                        id="currentPassword"
-                        name="currentPassword"
-                        value={formik.values.currentPassword}
-                        onChange={formik.handleChange}
-                        onBlur={formik.handleBlur}
-                        toggleMask
-                        invalid={!!formik.errors.currentPassword}
-                        inputClassName="w-full"
-                        feedback={false}
-                    />
-                    {isFormFieldValid(formik, "currentPassword") && <Message
-                        className="text-red-500 text-sm"
-                        severity="error"
-                        text={formik?.errors?.currentPassword?.toString()}
-                    />}
-                </div>
-                <div className="flex flex-column gap-2 mt-4" style={{}}>
-                    <label htmlFor="password" className="solid-auth-input-label">New Password</label>
-                    <Password
-                        id="newPassword"
-                        name="newPassword"
-                        value={formik.values.newPassword}
-                        onChange={formik.handleChange}
-                        onBlur={formik.handleBlur}
-                        toggleMask
-                        invalid={!!formik.errors.newPassword}
-                        inputClassName="w-full"
-                        feedback={false}
-                    />
-                    {isFormFieldValid(formik, "newPassword") && <Message
-                        className="text-red-500 text-sm"
-                        severity="error"
-                        text={formik?.errors?.newPassword?.toString()}
-                    />}
-                </div>
-                <div className="flex flex-column gap-2 mt-4" style={{}}>
-                    <label htmlFor="password" className="solid-auth-input-label">Confirm Password</label>
-                    <Password
-                        id="confirmPassword"
-                        name="confirmPassword"
-                        value={formik.values.confirmPassword}
-                        onChange={formik.handleChange}
-                        onBlur={formik.handleBlur}
-                        toggleMask
-                        invalid={!!formik.errors.confirmPassword}
-                        inputClassName="w-full"
-                        feedback={false}
-                    />
-                    {isFormFieldValid(formik, "confirmPassword") && <Message
-                        className="text-red-500 text-sm"
-                        severity="error"
-                        text={formik?.errors?.confirmPassword?.toString()}
-                    />}
-                </div>
-                <div className="mt-4">
-                    <Button className="w-full font-light auth-submit-button" label="Change Password" disabled={formik.isSubmitting} loading={formik.isSubmitting} />
-                </div>
-            </form>
-        </>
-    )
-}
-export default SolidChangeForcePassword

package/dist/components/auth/SolidForgotPassword.tsx

@@ -1,125 +0,0 @@
-"use client";
-
-import { useInitiateChangePasswordMutation } from "@/redux/api/authApi";
-import { useFormik } from "formik";
-import Link from "next/link";
-import { useRouter } from "next/navigation";
-import { Button } from "primereact/button";
-import { InputText } from "primereact/inputtext";
-import { Message } from "primereact/message";
-import { Toast } from "primereact/toast";
-import { useContext, useEffect, useRef } from "react";
-import * as Yup from "yup";
-import { LayoutContext } from "../layout/context/layoutcontext";
-import { useLazyGetAuthSettingsQuery } from "@/redux/api/solidSettingsApi";
-import { AppTitle } from "@/helpers/AppTitle";
-import Image from "next/image";
-import SolidLogo from '../../resources/images/SS-Logo.png'
-
-const SolidForgotPassword = () => {
-    const [trigger, { data: solidSettingsData }] = useLazyGetAuthSettingsQuery()
-    useEffect(() => {
-        trigger("") // Fetch settings on mount
-    }, [trigger])
-    const toast = useRef<Toast>(null);
-    const router = useRouter();
-    const showToast = (severity: "success" | "error", summary: string, detail: string) => {
-        toast.current?.show({
-            severity,
-            summary,
-            detail,
-            life: 3000,
-        });
-    };
-    const [initiateChangePassword] = useInitiateChangePasswordMutation();
-    const validationSchema = Yup.object({
-        email: Yup.string()
-            .email('Invalid email format')
-            .required('Email is required'),
-    });
-    function maskEmail(email: string) {
-        const [localPart, domain] = email.split('@');
-        const maskedLocal = localPart.slice(0, 3) + '*'.repeat(localPart.length - 3);
-        const maskedDomain = domain.slice(-8).padStart(domain.length, '*');
-        return `${maskedLocal}@${maskedDomain}`;
-    }
-
-    const formik = useFormik({
-        initialValues: {
-            email: "",
-        },
-        validationSchema,
-        onSubmit: async (values) => {
-            try {
-                const payload = {
-                    email: values.email,
-                };
-                const response = await initiateChangePassword(payload).unwrap();
-                if (response?.statusCode === 200) {
-                    const email = response?.data?.data?.user?.email;
-                    const maskedEmail = maskEmail(email);
-                    router.push(`/auth/initiate-forgot-password-thank-you?email=${maskedEmail}`)
-                } else (
-                    showToast("error", "Login Error", response.error)
-                )
-            } catch (err: any) {
-                showToast("error", "Login Error", err?.data ? err?.data?.message : "Something Went Wrong");
-            }
-        },
-    });
-
-    const isFormFieldValid = (formik: any, fieldName: string) =>
-        formik.touched[fieldName] && formik.errors[fieldName];
-
-    return (
-        <>
-            <Toast ref={toast} />
-            <div className={`auth-container ${solidSettingsData?.data?.authPagesLayout === 'center' ? 'center' : 'side'}`}>
-                {solidSettingsData?.data?.authPagesLayout === 'center' &&
-                    <div className="flex justify-content-center">
-                        <div className="solid-logo flex align-items-center gap-3">
-                            <Image
-                                alt="solid logo"
-                                src={SolidLogo}
-                                className="relative"
-                                fill
-                            />
-                            <AppTitle title={solidSettingsData} />
-                        </div>
-                    </div>
-                }
-                <h2 className={`solid-auth-title ${solidSettingsData?.data?.authPagesLayout === 'center' ? 'text-center' : 'text-left'}`}>Forgot Password</h2>
-                {/* <p className="solid-auth-subtitle text-sm">By continuing, you agree to the <Link href={'#'}>Terms of Service</Link> and acknowledge you’ve read our  <Link href={'#'}>Privacy Policy.</Link> </p> */}
-                <form onSubmit={formik.handleSubmit}>
-                    <div className="flex flex-column gap-2">
-                        <label htmlFor="email" className="solid-auth-input-label">Username or Email</label>
-                        <InputText
-                            id="email"
-                            name="email"
-                            placeholder="Email ID"
-                            value={formik.values.email}
-                            onChange={formik.handleChange}
-                            onBlur={formik.handleBlur}
-                        />
-                        {isFormFieldValid(formik, "email") && <Message
-                            className="text-red-500 text-sm"
-                            severity="error"
-                            text={formik?.errors?.email?.toString()}
-                        />}
-                    </div>
-                    <div className="mt-4">
-                        <Button className="w-full font-light auth-submit-button" label="Send OTP" disabled={formik.isSubmitting} loading={formik.isSubmitting} />
-                        <Button type="button" label="Back" className="w-full auth-back-button text-center mt-1" link onClick={() => (window.location.href = '/auth/login')} />
-                    </div>
-                </form>
-            </div>
-            {/* <div className="text-center mt-5">
-                <div className="text-sm text-400 secondary-dark-color">
-                    {'<'} Back to <Link className="font-bold" href="/auth/login">Sign In</Link>
-                </div>
-            </div> */}
-        </>
-    );
-};
-
-export default SolidForgotPassword;

package/dist/components/auth/SolidInitialLoginOtp.tsx

@@ -1,152 +0,0 @@
-"use client";
-
-import { AppTitle } from "@/helpers/AppTitle";
-import { useConfirmOtpLoginMutation } from "@/redux/api/authApi";
-import { useLazyGetAuthSettingsQuery } from "@/redux/api/solidSettingsApi";
-import { Form, Formik } from "formik";
-import Image from "next/image";
-import Link from "next/link";
-import { useRouter, useSearchParams } from "next/navigation";
-import { Button } from "primereact/button";
-import { InputOtp } from "primereact/inputotp";
-import { Message } from "primereact/message";
-import { Toast } from "primereact/toast";
-import { useEffect, useRef } from "react";
-import * as Yup from "yup";
-import SolidLogo from '../../resources/images/SS-Logo.png'
-import { signIn } from "next-auth/react";
-
-const SolidInitialLoginOtp = () => {
-    const searchParams = useSearchParams();
-    const tempEmail = searchParams.get('email');
-    const email = tempEmail ? decodeURIComponent(tempEmail) : '';
-    const [trigger, { data: solidSettingsData }] = useLazyGetAuthSettingsQuery();
-    useEffect(() => {
-        trigger("")
-    }, [trigger])
-    const [initiateOtpLogin] = useConfirmOtpLoginMutation();
-
-    const toast = useRef<Toast>(null);
-    const router = useRouter();
-
-    const validationSchema = Yup.object({
-        otp: Yup.string()
-            .matches(/^\d{6}$/, "OTP must be a 6-digit number")
-            .required("OTP is required"),
-    });
-
-    const showToast = (severity: "success" | "error", summary: string, detail: string) => {
-        toast.current?.show({
-            severity,
-            summary,
-            detail,
-            life: 3000,
-        });
-    };
-
-    const isFormFieldValid = (formik: any, fieldName: string) =>
-        formik.touched[fieldName] && formik.errors[fieldName];
-
-    return (
-        <>
-            <Toast ref={toast} />
-            <div className={`auth-container ${solidSettingsData?.data?.authPagesLayout === 'center' ? 'center' : 'side'}`} style={{ minWidth: 480 }}>
-                {solidSettingsData?.data?.authPagesLayout === 'center' &&
-                    <div className="flex justify-content-center">
-                        <div className="solid-logo flex align-items-center gap-3">
-                            <Image
-                                alt="solid logo"
-                                src={SolidLogo}
-                                className="relative"
-                                fill
-                            />
-                            <AppTitle title={solidSettingsData} />
-                        </div>
-                    </div>
-                }
-                <h2 className={`solid-auth-title ${solidSettingsData?.data?.authPagesLayout === 'center' ? 'text-center' : 'text-left'}`}>OTP Verification</h2>
-                <p className="solid-auth-subtitle text-sm">
-                    Please enter the OTP sent to your email to complete verification
-                </p>
-                <>
-                    <Formik
-                        initialValues={{
-                            otp: "",
-                        }}
-                        validationSchema={validationSchema}
-                        onSubmit={async (values, { setSubmitting, setErrors }) => {
-                            try {
-                                const payload = {
-                                    type: "email",
-                                    identifier: email,
-                                    otp: values.otp
-                                };
-
-                                const response = await initiateOtpLogin(payload).unwrap(); // Call mutation trigger
-
-                                if (response?.statusCode === 200) {
-                                    const otpResponse = await signIn("credentials", {
-                                        redirect: false,
-                                        accessToken: response?.data?.accessToken,
-                                        email: response?.data?.user?.email,
-                                    });
-
-                                    if (otpResponse?.error) {
-                                        showToast("error", "Login Error", otpResponse.error);
-                                    } else {
-                                        showToast("success", "Login Success", "Redirecting to dashboard...");
-                                        router.push(`${process.env.NEXT_PUBLIC_LOGIN_REDIRECT_URL}`);
-                                    }
-                                } else {
-                                    showToast("error", "Invalid OTP", response.error);
-                                    setErrors({
-                                        otp: "Invalid OTP",
-                                    });
-                                }
-                            } catch (err: any) {
-                                showToast("error", "Login Error", err?.data ? err?.data?.message : "Something Went Wrong");
-                            } finally {
-                                setSubmitting(false);
-                            }
-                        }}
-                    >
-                        {(formik) => (
-                            <Form>
-                                <div className="flex flex-column gap-2">
-                                    <label htmlFor="otp" className="solid-auth-input-label">Enter OTP</label>
-                                    <InputOtp
-                                        value={formik.values.otp}
-                                        onChange={(e) => formik.setFieldValue("otp", e.value)}
-                                        length={6}
-                                        style={{ width: '100%' }}
-                                        invalid={!!formik.errors.otp}
-                                    />
-                                    {isFormFieldValid(formik, "otp") && (
-                                        <Message className="text-red-500 text-sm" severity="error" text={formik.errors.otp?.toString()} />
-                                    )}
-                                    <div className="flex align-items-center justify-content-between">
-                                        <Button type="button" icon='pi pi-refresh' iconPos="left" link label="Resend Code" className="px-0 text-sm font-normal" />
-                                        <p className="m-0 text-sm text-color">
-                                            Time left: 00:28
-                                        </p>
-                                    </div>
-                                </div>
-                                <div className="mt-4">
-                                    <Button type="submit" className="w-full font-light auth-submit-button" label="Verify" disabled={formik.isSubmitting} loading={formik.isSubmitting} />
-                                    <Button type="button" label="Back" className="w-full auth-back-button text-center mt-1" link onClick={() => (window.location.href = '/auth/login')} />
-                                </div>
-                            </Form>
-                        )}
-                    </Formik>
-                </>
-            </div>
-            {/* <div className="text-center mt-5">
-                <div className="text-sm text-400 secondary-dark-color">
-                    {'<'} Back to <Link className="font-bold" href="/auth/login">Back</Link>
-                </div>
-            </div> */}
-        </>
-    );
-};
-
-export default SolidInitialLoginOtp;