Gradient App Bar - Copy this React, Mui Component to your project

**UI Header Description:** 1. **Background**: The header features a smooth gradient background, transitioning from deep blue to black, creating a modern and elegant feel. 2. **Logo**: On the left side, there is a simple, recognizable logo, which could be an icon or the brand name. 3. **Breadcrumb Navigation**: Just below the logo, there is a breadcrumb navigation bar displaying the current page path (e.g., "Home / Dashboard"). The text is white, ensuring readability against the dark background. 4. **Title**: In the center of the header, there is a large title (e.g., "Dashboard") in bold font, colored white, making it stand out. 5. **Search Bar**: To the right of the title, there is a search bar with soft edges, featuring a placeholder text "Type here..." for easy information searching. 6. **Sign In Button**: In the top right corner, there is a prominent "Sign in" button, easily identifiable with a standout color. This button may have a user icon next to it. 7. **Settings and Notification Icons**: Next to the "Sign in" button, there are icons for settings and notifications, allowing users quick access to important functions. 8. **Responsive Design**: The header is designed to display well on both desktop and mobile devices, with elements automatically adjusting in size and position.