Re-Quest/frontend
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Redesign header with mobile menu and authenticated user profile, add search input validation to the hero section, and enhance user session data.

Browse Source
This commit is contained in:
pradeepkumar
2026-01-31 22:42:29 +05:30
parent 81d182c526
commit db331e5a2b
5 changed files with 193 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
src/components/home/HeroSection.tsx
View File

@@ -15,6 +15,7 @@ export function HeroSection() {
location: '',
});
const [openDropdown, setOpenDropdown] = useState<string | null>(null);
const [validationError, setValidationError] = useState<string | null>(null);
// Fetch agent types on mount
useEffect(() => {
@@ -30,6 +31,19 @@ export function HeroSection() {
}, []);
const handleSearch = () => {
// Validate that at least one field has a value
const hasType = searchParams.type.trim() !== '';
const hasName = searchParams.name.trim() !== '';
const hasLocation = searchParams.location.trim() !== '';
if (!hasType && !hasName && !hasLocation) {
setValidationError('Please enter at least one search criteria (Type, Name/Keyword, or Location)');
return;
}
// Clear any previous validation error
setValidationError(null);
const params = new URLSearchParams();
if (searchParams.type) params.set('type', searchParams.type);
if (searchParams.name) params.set('name', searchParams.name);
@@ -48,6 +62,12 @@ export function HeroSection() {
const selectType = (value: string) => {
setSearchParams({ ...searchParams, type: value });
setOpenDropdown(null);
setValidationError(null); // Clear error when user selects a type
};
const handleInputChange = (field: 'name' | 'location', value: string) => {
setSearchParams({ ...searchParams, [field]: value });
setValidationError(null); // Clear error when user starts typing
};
return (
@@ -116,7 +136,7 @@ export function HeroSection() {
type="text"
placeholder="Name or Keyword"
value={searchParams.name}
onChange={(e) => setSearchParams({ ...searchParams, name: e.target.value })}
onChange={(e) => handleInputChange('name', e.target.value)}
className="w-full h-[42px] px-4 rounded-[7px] border border-[#00293d]/10 bg-white font-serif text-sm text-[#00293d] placeholder:text-[#00293d] focus:outline-none"
/>
</div>
@@ -127,7 +147,7 @@ export function HeroSection() {
type="text"
placeholder="Location"
value={searchParams.location}
onChange={(e) => setSearchParams({ ...searchParams, location: e.target.value })}
onChange={(e) => handleInputChange('location', e.target.value)}
className="w-full h-[42px] px-4 rounded-[7px] border border-[#00293d]/10 bg-white font-serif text-sm text-[#00293d] placeholder:text-[#00293d] focus:outline-none"
/>
</div>
@@ -146,6 +166,15 @@ export function HeroSection() {
</div>
</div>
{/* Validation Error Message */}
{validationError && (
<div className="mt-3 text-center">
<p className="text-white font-serif text-sm bg-red-500/90 rounded-[7px] py-2 px-4 inline-block">
{validationError}
</p>
</div>
)}
</div>
{/* Bottom Section - pushed to bottom */}