diff --git a/src/pages/index.js b/src/pages/index.js
index ac2277e..db873db 100644
--- a/src/pages/index.js
+++ b/src/pages/index.js
@@ -1,5 +1,5 @@
import React, { useState } from 'react';
-import Link from 'next/link';
+import { TabGroup, TabPanel, TabPanels, TabList, Tab } from '@headlessui/react';
import AnimeList from '../components/AnimeList';
import Timetable from '../components/Timetable';
import TopAnimeList from '../components/TopAnimeList';
@@ -14,11 +14,12 @@ const api = process.env.NEXTAUTH_URL;
const HomePage = ({ initialLatestAnime, topAnime, initialPage, newsPosts }) => {
const [latestAnime, setLatestAnime] = useState(initialLatestAnime);
const [page, setPage] = useState(initialPage);
+ const [type, setType] = useState(1); // 1 for subs, 2 for dubs
const handlePagination = async (newPage) => {
try {
const { data } = await axios.get('/api/latest', {
- params: { page: newPage, limit: 12 },
+ params: { page: newPage, limit: 12, type },
});
setLatestAnime(data);
setPage(newPage);
@@ -27,39 +28,85 @@ const HomePage = ({ initialLatestAnime, topAnime, initialPage, newsPosts }) => {
}
};
+ const handleTabChange = async (tabIndex) => {
+ const newType = tabIndex === 1 ? 2 : 1; // 0 for subbed, 1 for dubbed
+ setType(newType);
+ try {
+ const { data } = await axios.get('/api/latest', {
+ params: { page: 1, limit: 12, type: newType },
+ });
+ setLatestAnime(data);
+ setPage(1);
+ } catch (error) {
+ console.error('Error fetching episodes:', error);
+ }
+ };
+
return (
{/* Main Content */}
-
-
+
+
Recently Updated
-
- {page > 1 && (
-
- )}
-
-
+
+
+
+
+ selected
+ ? 'py-1 px-2 sm:py-2 sm:px-4 text-sm sm:text-base leading-5 font-medium text-gray-800 bg-yellow-500 rounded transition duration-150 ease-in-out'
+ : 'py-1 px-2 sm:py-2 sm:px-4 text-sm sm:text-base leading-5 font-medium text-gray-400 hover:text-gray-800 hover:bg-yellow-600 rounded transition duration-150 ease-in-out'
+ }
+ >
+ Sub
+
+
+ selected
+ ? 'py-1 px-2 sm:py-2 sm:px-4 text-sm sm:text-base leading-5 font-medium text-gray-800 bg-yellow-500 rounded transition duration-150 ease-in-out'
+ : 'py-1 px-2 sm:py-2 sm:px-4 text-sm sm:text-base leading-5 font-medium text-gray-400 hover:text-gray-800 hover:bg-yellow-600 rounded transition duration-150 ease-in-out'
+ }
+ >
+ Dub
+
+
+
+ {page > 1 && (
+
+ )}
+
+
+
-
-
@@ -73,7 +120,7 @@ export async function getServerSideProps({ query }) {
try {
const [latestResponse, topAnimeResponse] = await Promise.all([
axios.get(`${api}/api/latest`, {
- params: { page: initialPage, limit: 12 },
+ params: { page: initialPage, limit: 12, type: 1 }, // default to subbed
}),
axios.get(`${api}/api/top10`),
]);
diff --git a/src/pages/search.js b/src/pages/search.js
index 9f98bb6..8ed9c92 100644
--- a/src/pages/search.js
+++ b/src/pages/search.js
@@ -58,16 +58,19 @@ const SearchResults = () => {