Remove home page search bar (Task #22)
The home page previously showed a search input + «بحث» button above the featured opportunities. The user asked to remove it so the home page goes straight to the featured opportunities. Changes (artifacts/ehsan-poc/src/pages/home.tsx): - Deleted the search UI block (label, Search-icon input, search button). - Removed the now-unused `query`/`setQuery` state and the client-side filtering; the featured grid now maps over published requests directly via a `featured` list. - Simplified the empty state to always use t.opportunities.noOpportunities (dropped the search-specific noResults branch). - Removed now-unused imports: `Input` and the `Search` lucide icon. `Button` is kept (still used by the hero CTA). Out of scope (unchanged): opportunities page search/filter, header nav. Unused translation keys (home.searchLabel/searchButton/noResults, common.searchPlaceholder) were left in translations.ts as they are shared strings and harmless; no behavioral impact. Verified: tsc --noEmit clean.
This commit is contained in:
@@ -3,12 +3,11 @@ import { useLanguage } from "../contexts/LanguageContext";
|
|||||||
import { useListPublishedRequests } from "@workspace/api-client-react";
|
import { useListPublishedRequests } from "@workspace/api-client-react";
|
||||||
import { Card, CardContent } from "@/components/ui/card";
|
import { Card, CardContent } from "@/components/ui/card";
|
||||||
import { Button } from "@/components/ui/button";
|
import { Button } from "@/components/ui/button";
|
||||||
import { Input } from "@/components/ui/input";
|
|
||||||
import { Skeleton } from "@/components/ui/skeleton";
|
import { Skeleton } from "@/components/ui/skeleton";
|
||||||
import { OpportunityCard } from "../components/OpportunityCard";
|
import { OpportunityCard } from "../components/OpportunityCard";
|
||||||
import { Reveal } from "../components/Reveal";
|
import { Reveal } from "../components/Reveal";
|
||||||
import { Link } from "wouter";
|
import { Link } from "wouter";
|
||||||
import { Search, Pause, Play } from "lucide-react";
|
import { Pause, Play } from "lucide-react";
|
||||||
import zakatBanner from "@assets/zakatbanarWEB_1780682994527.png";
|
import zakatBanner from "@assets/zakatbanarWEB_1780682994527.png";
|
||||||
import dawriBanner from "@assets/dawribanarWEB_1780682998494.png";
|
import dawriBanner from "@assets/dawribanarWEB_1780682998494.png";
|
||||||
import waqfBanner from "@assets/waqfbanerWEB_1780683002610.png";
|
import waqfBanner from "@assets/waqfbanerWEB_1780683002610.png";
|
||||||
@@ -43,7 +42,6 @@ function Ornament({ className = "" }: { className?: string }) {
|
|||||||
export default function Home() {
|
export default function Home() {
|
||||||
const { t } = useLanguage();
|
const { t } = useLanguage();
|
||||||
const { data: published, isLoading: pubLoading } = useListPublishedRequests();
|
const { data: published, isLoading: pubLoading } = useListPublishedRequests();
|
||||||
const [query, setQuery] = useState("");
|
|
||||||
const [slide, setSlide] = useState(0);
|
const [slide, setSlide] = useState(0);
|
||||||
const [paused, setPaused] = useState(false);
|
const [paused, setPaused] = useState(false);
|
||||||
|
|
||||||
@@ -56,15 +54,7 @@ export default function Home() {
|
|||||||
return () => clearInterval(id);
|
return () => clearInterval(id);
|
||||||
}, [paused]);
|
}, [paused]);
|
||||||
|
|
||||||
const filtered = (published || []).filter((r) => {
|
const featured = published || [];
|
||||||
if (!query.trim()) return true;
|
|
||||||
const q = query.toLowerCase();
|
|
||||||
return (
|
|
||||||
r.caseId.toLowerCase().includes(q) ||
|
|
||||||
r.description.toLowerCase().includes(q) ||
|
|
||||||
r.beneficiaryName.toLowerCase().includes(q)
|
|
||||||
);
|
|
||||||
});
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
@@ -150,36 +140,17 @@ export default function Home() {
|
|||||||
<div className="container mx-auto px-4 py-12">
|
<div className="container mx-auto px-4 py-12">
|
||||||
{/* Featured Opportunities */}
|
{/* Featured Opportunities */}
|
||||||
<section className="mb-16">
|
<section className="mb-16">
|
||||||
{/* Search */}
|
|
||||||
<div className="mb-8 max-w-xl">
|
|
||||||
<label htmlFor="home-search" className="sr-only">{t.home.searchLabel}</label>
|
|
||||||
<div className="flex gap-2">
|
|
||||||
<div className="relative flex-1">
|
|
||||||
<Search className="absolute start-3 top-1/2 -translate-y-1/2 w-4 h-4 text-muted-foreground" />
|
|
||||||
<Input
|
|
||||||
id="home-search"
|
|
||||||
className="ps-9"
|
|
||||||
placeholder={t.common.searchPlaceholder}
|
|
||||||
value={query}
|
|
||||||
onChange={(e) => setQuery(e.target.value)}
|
|
||||||
data-testid="input-search"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<Button data-testid="button-search">{t.home.searchButton}</Button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{pubLoading ? (
|
{pubLoading ? (
|
||||||
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
|
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
|
||||||
{[1, 2, 3].map((i) => <Skeleton key={i} className="h-96 w-full" />)}
|
{[1, 2, 3].map((i) => <Skeleton key={i} className="h-96 w-full" />)}
|
||||||
</div>
|
</div>
|
||||||
) : filtered.length === 0 ? (
|
) : featured.length === 0 ? (
|
||||||
<div className="col-span-full text-center py-12 text-muted-foreground bg-muted/20 rounded-xl border border-dashed">
|
<div className="col-span-full text-center py-12 text-muted-foreground bg-muted/20 rounded-xl border border-dashed">
|
||||||
{query.trim() ? t.home.noResults : t.opportunities.noOpportunities}
|
{t.opportunities.noOpportunities}
|
||||||
</div>
|
</div>
|
||||||
) : (
|
) : (
|
||||||
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
|
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
|
||||||
{filtered.slice(0, 6).map((request, i) => (
|
{featured.slice(0, 6).map((request, i) => (
|
||||||
<Reveal key={request.id} delay={(i % 3) * 0.08} className="h-full">
|
<Reveal key={request.id} delay={(i % 3) * 0.08} className="h-full">
|
||||||
<OpportunityCard request={request} />
|
<OpportunityCard request={request} />
|
||||||
</Reveal>
|
</Reveal>
|
||||||
|
|||||||
Reference in New Issue
Block a user