search

beckn / beckn-ui-workspace

Mono Repo for Beckn UI Workspace
9 stars 11 forks source link

Implement Shared TopHeader and SubHeader Components #1455

Closed aniketceminds closed 3 weeks ago

aniketceminds commented 2 months ago

Description

We need to create reusable components for the top header (navigation bar) and subheader (secondary navigation) that can be shared across multiple applications within the Beckn ecosystem. These components should follow consistent design patterns and ensure a cohesive user experience.

Goals

  1. Design a flexible TopHeader component with navigation links (e.g., Home, About, Contact).
  2. Develop a SubHeader component for additional navigation (e.g., user profile, settings).
  3. Ensure seamless integration of these components into different apps.

Expected Outcome

Modular components for consistent navigation across Beckn applications.

Acceptance Criteria

  1. TopHeader Component:
    • Design a navigation bar with relevant links.
    • Include responsive behavior for different screen sizes.
    • Implement dropdown menus if needed.
  2. SubHeader Component:
    • Create a secondary navigation area (e.g., below the TopHeader).
    • Include links to user-related pages (profile, settings, etc.).
    • Ensure consistent styling with the TopHeader.
  3. Consistency:
    • Maintain uniform styling (colors, fonts) across components.
    • Test components in different app contexts.

Mockups / Wireframes

N/A (This section can be updated later if needed.)

Product Name

Beckn

Domain

Migration

Tech Skills Needed

Complexity

Medium

Category

UI Components

Sub Category

Navigation

aniketceminds commented 2 months ago

resolution: added reusable TopHeader & SubHeader component as well in common packages

aniketceminds commented 2 months ago

Done with the refactoring mentioned by Ankit related to type declaration, to have separate *.types.ts for each component.