+ {/* Search Bar for smaller devices */}
+
- {currentPath.includes('courses') && bookmarkPageUrl && (
-
- )}
-
+
+
+
+ {currentPath.includes('courses') && bookmarkPageUrl && (
+
+ )}
-
+
+
+
+
+
+
-
-
-
@@ -107,14 +112,15 @@ export const Appbar = () => {
-
diff --git a/src/components/Signup.tsx b/src/components/Signup.tsx
new file mode 100644
index 000000000..b81f75575
--- /dev/null
+++ b/src/components/Signup.tsx
@@ -0,0 +1,194 @@
+'use client';
+import { Button } from '@/components/ui/button';
+import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
+import { Input } from '@/components/ui/input';
+import { Label } from '@/components/ui/label';
+import { Toaster } from '@/components/ui/sonner';
+import { signIn } from 'next-auth/react';
+import { useRouter } from 'next/navigation';
+import React, { useRef, useState } from 'react';
+
+import { toast } from 'sonner';
+const Signup = () => {
+ const [isPasswordVisible, setIsPasswordVisible] = useState(false);
+ const [requiredError, setRequiredError] = useState({
+ emailReq: false,
+ passReq: false,
+ });
+
+ function togglePasswordVisibility() {
+ setIsPasswordVisible((prevState: any) => !prevState);
+ }
+ const router = useRouter();
+ const email = useRef('');
+ const password = useRef('');
+ const name = useRef('');
+
+ const handleSubmit = async (e?: React.FormEvent
) => {
+ if (e) {
+ e.preventDefault();
+ }
+
+ if (!email.current || !password.current) {
+ setRequiredError({
+ emailReq: email.current ? false : true,
+ passReq: password.current ? false : true,
+ });
+ return;
+ }
+
+ const register = await fetch('/api/auth/register', {
+ method: 'POST',
+ body: JSON.stringify({
+ name: name.current,
+ email: email.current,
+ password: password.current,
+ }),
+ });
+ const data = await register.json();
+
+ if (register.status !== 201) {
+ toast(data.error, {
+ action: {
+ label: 'Close',
+ onClick: () => console.log('Closed Toast'),
+ },
+ });
+ return;
+ }
+
+ const res = await signIn('credentials', {
+ username: email.current,
+ password: password.current,
+ redirect: false,
+ });
+
+ if (!res?.error) {
+ router.push('/');
+ } else {
+ toast('Error Signing in', {
+ action: {
+ label: 'Close',
+ onClick: () => console.log('Closed Toast'),
+ },
+ });
+ }
+ };
+ return (
+
+
+
+ Signup
+
+
+
+
+
+ {
+ name.current = e.target.value;
+ }}
+ />
+
+
+
+ {
+ setRequiredError((prevState) => ({
+ ...prevState,
+ emailReq: false,
+ }));
+ email.current = e.target.value;
+ }}
+ />
+ {requiredError.emailReq && (
+ Email is required
+ )}
+
+
+
+
+
{
+ setRequiredError((prevState) => ({
+ ...prevState,
+ passReq: false,
+ }));
+ password.current = e.target.value;
+ }}
+ onKeyDown={async (e) => {
+ if (e.key === 'Enter') {
+ setIsPasswordVisible(false);
+ handleSubmit();
+ }
+ }}
+ />
+
+
+ {requiredError.passReq && (
+
Password is required
+ )}
+
+