Skip to content

Conversation

@Suhaibinator
Copy link
Collaborator

Summary

  • add CategoryTabs component
  • add HadithSidebar component for nested navigation
  • create collections layout to wrap pages with sidebar
  • show tabs on collections, books and hadith pages

Testing

  • npm run lint (fails: next: not found)

Copy link

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull Request Overview

This PR adds a sidebar navigation and category tabs to enhance page organization for Hadith collections, books, and individual hadith pages. The key changes include:

  • Adding a new HadithSidebar component that wraps page content with a sidebar navigation.
  • Introducing a CategoryTabs component to provide tabbed navigation across different content types.
  • Updating various pages and layouts to integrate the sidebar and tab navigation.

Reviewed Changes

Copilot reviewed 7 out of 7 changed files in this pull request and generated 1 comment.

Show a summary per file
File Description
fe/src/components/hadith-sidebar.tsx Introduces the sidebar navigation with collections, books, and hadith links.
fe/src/components/category-tabs.tsx Adds tabbed navigation for switching between collections, books, and hadiths.
fe/src/app/collections/page.tsx Integrates CategoryTabs into the collections overview page.
fe/src/app/collections/layout.tsx Updates the layout to wrap pages in the new sidebar navigation.
fe/src/app/collections/[collectionId]/page.tsx Updates the collection page to include CategoryTabs with "books" active.
fe/src/app/collections/[collectionId]/[bookId]/page.tsx Updates the book page to include CategoryTabs with "hadiths" active.
fe/src/app/collections/[collectionId]/[bookId]/[hadithId]/page.tsx Updates the hadith page to include CategoryTabs with "hadiths" active.
Comments suppressed due to low confidence (1)

fe/src/app/collections/layout.tsx:26

  • New logic in CollectionsLayout introduces a branch based on the presence of a collectionId. Please ensure there is adequate test coverage for both cases.
if (params.collectionId) {


export function CategoryTabs({ active, collectionId, bookId }: CategoryTabsProps) {
return (
<Tabs defaultValue={active} className="mb-4">
Copy link

Copilot AI May 17, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

[nitpick] Consider using a controlled Tabs component (using the 'value' prop with an onChange handler) if the active tab might change after the initial render, ensuring the UI reflects prop updates.

Copilot uses AI. Check for mistakes.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants