+ {/* Search Bar for smaller devices */}
+ 
);
diff --git a/src/components/landing/us-section/why-us-card/why-us-content.ts b/src/components/landing/us-section/why-us-card/why-us-content.ts
index 96f986b7f..302b9e830 100644
--- a/src/components/landing/us-section/why-us-card/why-us-content.ts
+++ b/src/components/landing/us-section/why-us-card/why-us-content.ts
@@ -51,6 +51,6 @@ export const whyUs: TwhyUs = [
tagline: 'Assignments',
headline: 'Learn by doing',
description:
- 'Harkirat personally creates assignments after every lecture, so it\'s extremely hands on.',
+ "Harkirat personally creates assignments after every lecture, so it's extremely hands on.",
},
];
diff --git a/src/components/razorpay/Razorpay.tsx b/src/components/razorpay/Razorpay.tsx
new file mode 100644
index 000000000..95a98ad34
--- /dev/null
+++ b/src/components/razorpay/Razorpay.tsx
@@ -0,0 +1,102 @@
+'use client';
+import { Button } from '../ui/button';
+import { toast } from 'sonner';
+import { useRouter } from 'next/navigation';
+
+const initializeRazorpay = () => {
+ return new Promise((resolve) => {
+ const script = document.createElement('script');
+ script.src = 'https://checkout.razorpay.com/v1/checkout.js';
+
+ script.onload = () => {
+ resolve(true);
+ };
+ script.onerror = () => {
+ resolve(false);
+ };
+
+ document.body.appendChild(script);
+ });
+};
+
+type RazorPayInputType = {
+ courseId: number;
+ userId: string;
+};
+
+export const RazorPayComponent = ({ courseId, userId }: RazorPayInputType) => {
+ const router = useRouter();
+
+ const makePayment = async () => {
+ const res = await initializeRazorpay();
+
+ if (!res) {
+ alert('Razorpay SDK Failed to load');
+ return;
+ }
+
+ const data = await fetch('/api/razorpay', {
+ method: 'POST',
+ body: JSON.stringify({
+ courseId,
+ userId,
+ }),
+ }).then((res) => res.json());
+
+ const options = {
+ key_id: data.razorPayKey,
+ name: '100xdevs',
+ currency: data.currency,
+ amount: data.amount,
+ order_id: data.id,
+ description: 'Thank you for purchasing course',
+ image: '/harkirat.png',
+ handler: async (response: any) => {
+ const verify = await fetch('/api/razorpay/verify', {
+ method: 'POST',
+ body: JSON.stringify({ ...response, userId, courseId }),
+ });
+ const data = await verify.json();
+ if (verify.status !== 200) {
+ toast(data.error, {
+ action: {
+ label: 'Close',
+ onClick: () => console.log('Closed Toast'),
+ },
+ });
+ } else {
+ toast(data.message, {
+ action: {
+ label: 'Close',
+ onClick: () => console.log('Closed Toast'),
+ },
+ });
+ router.push('/');
+ }
+ },
+ };
+
+ const paymentObject = new (window as any).Razorpay(options);
+ paymentObject.on('payment.failed', () => {
+ toast('Payment did not execute', {
+ action: {
+ label: 'Close',
+ onClick: () => console.log('Closed Toast'),
+ },
+ });
+ });
+ paymentObject.open();
+ };
+
+ return (
+
- {currentPath.includes('courses') && bookmarkPageUrl && (
-
- )}
-
+
+
+
+ {currentPath.includes('courses') && bookmarkPageUrl && (
+
+ )}
-
+
+
+
-
-
{course.totalVideos !== undefined &&
course.totalVideosWatched !== undefined && (
-
diff --git a/src/components/Sidebar.tsx b/src/components/Sidebar.tsx
index 6bdac5d62..89f7469b1 100644
--- a/src/components/Sidebar.tsx
+++ b/src/components/Sidebar.tsx
@@ -157,16 +157,16 @@ export function ToggleButton({
);
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
+
+
+
+
+
+ );
+};
+
+export default Signup;
diff --git a/src/components/VideoPlayer.tsx b/src/components/VideoPlayer.tsx
index ef1cbb434..92ef05e61 100644
--- a/src/components/VideoPlayer.tsx
+++ b/src/components/VideoPlayer.tsx
@@ -22,23 +22,23 @@ export const VideoPlayer = ({
}
const handleKeyPress = (event: any) => {
switch (event.code) {
- case 'Space': // Space bar for play/pause
- if (player.paused()) {
- player.play();
+ case 'Space': // Space bar for play/pause
+ if (player.paused()) {
+ player.play();
+ event.stopPropagation();
+ } else {
+ player.pause();
+ event.stopPropagation();
+ }
+ break;
+ case 'ArrowRight': // Right arrow for seeking forward 5 seconds
+ player.currentTime(player.currentTime() + 5);
event.stopPropagation();
- } else {
- player.pause();
+ break;
+ case 'ArrowLeft': // Left arrow for seeking backward 5 seconds
+ player.currentTime(player.currentTime() - 5);
event.stopPropagation();
- }
- break;
- case 'ArrowRight': // Right arrow for seeking forward 5 seconds
- player.currentTime(player.currentTime() + 5);
- event.stopPropagation();
- break;
- case 'ArrowLeft': // Left arrow for seeking backward 5 seconds
- player.currentTime(player.currentTime() - 5);
- event.stopPropagation();
- break;
+ break;
}
};
diff --git a/src/components/VideoPlayer2.tsx b/src/components/VideoPlayer2.tsx
index b14d2bfa1..87342c837 100644
--- a/src/components/VideoPlayer2.tsx
+++ b/src/components/VideoPlayer2.tsx
@@ -77,40 +77,40 @@ export const VideoPlayer: FunctionComponent = ({
const newIndexDown =
currentIndexDown !== 0 ? currentIndexDown - 1 : currentIndexDown;
switch (event.code) {
- case 'Period': // Increase playback speed
- player.playbackRate(PLAYBACK_RATES[newIndexPeriod]);
- event.stopPropagation();
- break;
- case 'Comma': // Decrease playback speed
- player.playbackRate(PLAYBACK_RATES[newIndexComma]);
- event.stopPropagation();
- break;
- case 'ArrowUp': // Increase volume
- videoRef.current?.children[0].children[6].children[3].classList.add(
- 'vjs-hover',
- );
- if (volumeSetTimeout !== null) clearTimeout(volumeSetTimeout);
- volumeSetTimeout = setTimeout(() => {
- videoRef.current?.children[0].children[6].children[3].classList.remove(
+ case 'Period': // Increase playback speed
+ player.playbackRate(PLAYBACK_RATES[newIndexPeriod]);
+ event.stopPropagation();
+ break;
+ case 'Comma': // Decrease playback speed
+ player.playbackRate(PLAYBACK_RATES[newIndexComma]);
+ event.stopPropagation();
+ break;
+ case 'ArrowUp': // Increase volume
+ videoRef.current?.children[0].children[6].children[3].classList.add(
'vjs-hover',
);
- }, 1000);
- player.volume(VOLUME_LEVELS[newIndexUp]);
- event.stopPropagation();
- break;
- case 'ArrowDown': // Decrease volume
- videoRef.current?.children[0].children[6].children[3].classList.add(
- 'vjs-hover',
- );
- if (volumeSetTimeout !== null) clearTimeout(volumeSetTimeout);
- volumeSetTimeout = setTimeout(() => {
- videoRef.current?.children[0].children[6].children[3].classList.remove(
+ if (volumeSetTimeout !== null) clearTimeout(volumeSetTimeout);
+ volumeSetTimeout = setTimeout(() => {
+ videoRef.current?.children[0].children[6].children[3].classList.remove(
+ 'vjs-hover',
+ );
+ }, 1000);
+ player.volume(VOLUME_LEVELS[newIndexUp]);
+ event.stopPropagation();
+ break;
+ case 'ArrowDown': // Decrease volume
+ videoRef.current?.children[0].children[6].children[3].classList.add(
'vjs-hover',
);
- }, 1000);
- player.volume(VOLUME_LEVELS[newIndexDown]);
- event.stopPropagation();
- break;
+ if (volumeSetTimeout !== null) clearTimeout(volumeSetTimeout);
+ volumeSetTimeout = setTimeout(() => {
+ videoRef.current?.children[0].children[6].children[3].classList.remove(
+ 'vjs-hover',
+ );
+ }, 1000);
+ player.volume(VOLUME_LEVELS[newIndexDown]);
+ event.stopPropagation();
+ break;
}
} else if (event.code === 'KeyT') {
player.playbackRate(2);
@@ -126,70 +126,70 @@ export const VideoPlayer: FunctionComponent = ({
return; // Do nothing if the active element is an input or textarea
}
switch (event.code) {
- case 'Space': // Space bar for play/pause
- if (player.paused()) {
- player.play();
+ case 'Space': // Space bar for play/pause
+ if (player.paused()) {
+ player.play();
+ event.stopPropagation();
+ } else {
+ player.pause();
+ event.stopPropagation();
+ }
+ event.preventDefault();
+ break;
+ case 'ArrowRight': // Right arrow for seeking forward 5 seconds
+ player.currentTime(player.currentTime() + 5);
event.stopPropagation();
- } else {
- player.pause();
+ break;
+ case 'ArrowLeft': // Left arrow for seeking backward 5 seconds
+ player.currentTime(player.currentTime() - 5);
event.stopPropagation();
- }
- event.preventDefault();
- break;
- case 'ArrowRight': // Right arrow for seeking forward 5 seconds
- player.currentTime(player.currentTime() + 5);
- event.stopPropagation();
- break;
- case 'ArrowLeft': // Left arrow for seeking backward 5 seconds
- player.currentTime(player.currentTime() - 5);
- event.stopPropagation();
- break;
- case 'KeyF': // F key for fullscreen
- if (player.isFullscreen_) document.exitFullscreen();
- else player.requestFullscreen();
- event.stopPropagation();
- break;
- case 'KeyR': // 'R' key to restart playback from the beginning
- player.currentTime(0);
- event.stopPropagation();
- break;
- case 'KeyM': // 'M' key to toggle mute/unmute
- if (player.volume() === 0) {
- player.volume(1);
- } else {
- player.volume(0);
- }
- event.stopPropagation();
- break;
- case 'KeyK': // 'K' key for play/pause toggle
- if (player.paused()) {
- player.play();
- } else {
- player.pause();
- }
- event.stopPropagation();
- break;
- case 'KeyJ': // 'J' key for seeking backward 10 seconds multiplied by the playback rate
- player.currentTime(
- player.currentTime() - 10 * player.playbackRate(),
- );
- event.stopPropagation();
- break;
- case 'KeyL': // 'L' key for seeking forward 10 seconds multiplied by the playback rate
- player.currentTime(
- player.currentTime() + 10 * player.playbackRate(),
- );
- event.stopPropagation();
- break;
- case 'KeyC':
- if (subtitles && player.textTracks().length) {
- if (player.textTracks()[0].mode === 'showing') {
- player.textTracks()[0].mode = 'hidden';
+ break;
+ case 'KeyF': // F key for fullscreen
+ if (player.isFullscreen_) document.exitFullscreen();
+ else player.requestFullscreen();
+ event.stopPropagation();
+ break;
+ case 'KeyR': // 'R' key to restart playback from the beginning
+ player.currentTime(0);
+ event.stopPropagation();
+ break;
+ case 'KeyM': // 'M' key to toggle mute/unmute
+ if (player.volume() === 0) {
+ player.volume(1);
} else {
- player.textTracks()[0].mode = 'showing';
+ player.volume(0);
}
- }
- break;
+ event.stopPropagation();
+ break;
+ case 'KeyK': // 'K' key for play/pause toggle
+ if (player.paused()) {
+ player.play();
+ } else {
+ player.pause();
+ }
+ event.stopPropagation();
+ break;
+ case 'KeyJ': // 'J' key for seeking backward 10 seconds multiplied by the playback rate
+ player.currentTime(
+ player.currentTime() - 10 * player.playbackRate(),
+ );
+ event.stopPropagation();
+ break;
+ case 'KeyL': // 'L' key for seeking forward 10 seconds multiplied by the playback rate
+ player.currentTime(
+ player.currentTime() + 10 * player.playbackRate(),
+ );
+ event.stopPropagation();
+ break;
+ case 'KeyC':
+ if (subtitles && player.textTracks().length) {
+ if (player.textTracks()[0].mode === 'showing') {
+ player.textTracks()[0].mode = 'hidden';
+ } else {
+ player.textTracks()[0].mode = 'showing';
+ }
+ }
+ break;
}
}
};
diff --git a/src/components/bookmark/BookmarkView.tsx b/src/components/bookmark/BookmarkView.tsx
index bed0c839d..649ca34cc 100644
--- a/src/components/bookmark/BookmarkView.tsx
+++ b/src/components/bookmark/BookmarkView.tsx
@@ -19,12 +19,12 @@ const BookmarkView = ({
{bookmarkData === null ||
'error' in bookmarkData ||
!bookmarkData.length ? (
-
+
+
+
+
+ {
+ 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
+ )}
+
-
- ) : (
- No bookmark added yet!
-
+
+ ) : (
+ No bookmark added yet!
+