Fix JobFeeds search and filtering logic, reactive prop syncing, and add Reset Filters button
This commit is contained in:
-22
File diff suppressed because one or more lines are too long
@@ -32,16 +32,29 @@ export const JobFeeds: React.FC<JobFeedsProps> = ({
|
|||||||
const [isFetchingFeeds, setIsFetchingFeeds] = useState(false);
|
const [isFetchingFeeds, setIsFetchingFeeds] = useState(false);
|
||||||
const [localFeeds, setLocalFeeds] = useState<JobFeedItem[]>(jobFeeds);
|
const [localFeeds, setLocalFeeds] = useState<JobFeedItem[]>(jobFeeds);
|
||||||
|
|
||||||
|
// Synchronize localFeeds whenever jobFeeds prop updates from parent
|
||||||
|
React.useEffect(() => {
|
||||||
|
if (jobFeeds && jobFeeds.length > 0) {
|
||||||
|
setLocalFeeds(jobFeeds);
|
||||||
|
}
|
||||||
|
}, [jobFeeds]);
|
||||||
|
|
||||||
const displayFeeds = localFeeds.length > 0 ? localFeeds : jobFeeds;
|
const displayFeeds = localFeeds.length > 0 ? localFeeds : jobFeeds;
|
||||||
|
|
||||||
const filteredFeeds = displayFeeds.filter(feed => {
|
const filteredFeeds = displayFeeds.filter(feed => {
|
||||||
const matchesSearch =
|
const term = searchTerm.toLowerCase().trim();
|
||||||
feed.title.toLowerCase().includes(searchTerm.toLowerCase()) ||
|
if (!term && selectedPlatform === 'ALL' && minMatch === 0) return true;
|
||||||
feed.company.toLowerCase().includes(searchTerm.toLowerCase()) ||
|
|
||||||
feed.location.toLowerCase().includes(searchTerm.toLowerCase());
|
|
||||||
|
|
||||||
|
const titleMatch = (feed.title || '').toLowerCase().includes(term);
|
||||||
|
const companyMatch = (feed.company || '').toLowerCase().includes(term);
|
||||||
|
const locationMatch = (feed.location || '').toLowerCase().includes(term);
|
||||||
|
const platformMatchStr = (feed.platform || '').toLowerCase().includes(term);
|
||||||
|
const descMatch = (feed.description || '').toLowerCase().includes(term);
|
||||||
|
const skillsMatch = (feed.requiredSkills || []).some(s => (s || '').toLowerCase().includes(term));
|
||||||
|
|
||||||
|
const matchesSearch = !term || titleMatch || companyMatch || locationMatch || platformMatchStr || descMatch || skillsMatch;
|
||||||
const matchesPlatform = selectedPlatform === 'ALL' || feed.platform === selectedPlatform;
|
const matchesPlatform = selectedPlatform === 'ALL' || feed.platform === selectedPlatform;
|
||||||
const matchesMatch = (feed.estimatedMatch || 80) >= minMatch;
|
const matchesMatch = (feed.estimatedMatch ?? 80) >= minMatch;
|
||||||
|
|
||||||
return matchesSearch && matchesPlatform && matchesMatch;
|
return matchesSearch && matchesPlatform && matchesMatch;
|
||||||
});
|
});
|
||||||
@@ -140,6 +153,19 @@ export const JobFeeds: React.FC<JobFeedsProps> = ({
|
|||||||
className="w-20 accent-indigo-500 cursor-pointer"
|
className="w-20 accent-indigo-500 cursor-pointer"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
{(searchTerm || selectedPlatform !== 'ALL' || minMatch > 0) && (
|
||||||
|
<button
|
||||||
|
onClick={() => {
|
||||||
|
setSearchTerm('');
|
||||||
|
setSelectedPlatform('ALL');
|
||||||
|
setMinMatch(0);
|
||||||
|
}}
|
||||||
|
className="px-3 py-2 rounded-xl bg-slate-800 hover:bg-slate-700 text-slate-300 text-xs font-semibold transition"
|
||||||
|
>
|
||||||
|
Reset Filters
|
||||||
|
</button>
|
||||||
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user