Hotfix: expand landing-page search to all requests

2026-03-03 13:24:25 +13:00
parent 5f2dc52771
commit 42d4caa474
11 changed files with 212 additions and 59 deletions
--- a/frontend/app/admin/requests-all/page.tsx
+++ b/frontend/app/admin/requests-all/page.tsx
@@ -15,6 +15,17 @@ type RequestRow = {
  createdAt?: string | null
 }

+const REQUEST_STAGE_OPTIONS = [
+  { value: 'all', label: 'All stages' },
+  { value: 'pending', label: 'Waiting for approval' },
+  { value: 'approved', label: 'Approved' },
+  { value: 'in_progress', label: 'In progress' },
+  { value: 'working', label: 'Working on it' },
+  { value: 'partial', label: 'Partially ready' },
+  { value: 'ready', label: 'Ready to watch' },
+  { value: 'declined', label: 'Declined' },
+]
+
 const formatDateTime = (value?: string | null) => {
  if (!value) return 'Unknown'
  const date = new Date(value)
@@ -30,6 +41,7 @@ export default function AdminRequestsAllPage() {
  const [error, setError] = useState<string | null>(null)
  const [pageSize, setPageSize] = useState(50)
  const [page, setPage] = useState(1)
+  const [stage, setStage] = useState('all')

  const pageCount = useMemo(() => {
    if (!total || pageSize <= 0) return 1
@@ -46,8 +58,15 @@ export default function AdminRequestsAllPage() {
    try {
      const baseUrl = getApiBase()
      const skip = (page - 1) * pageSize
+      const params = new URLSearchParams({
+        take: String(pageSize),
+        skip: String(skip),
+      })
+      if (stage !== 'all') {
+        params.set('stage', stage)
+      }
      const response = await authFetch(
-        `${baseUrl}/admin/requests/all?take=${pageSize}&skip=${skip}`
+        `${baseUrl}/admin/requests/all?${params.toString()}`
      )
      if (!response.ok) {
        if (response.status === 401) {
@@ -74,7 +93,7 @@ export default function AdminRequestsAllPage() {

  useEffect(() => {
    void load()
-  }, [page, pageSize])
+  }, [page, pageSize, stage])

  useEffect(() => {
    if (page > pageCount) {
@@ -82,6 +101,10 @@ export default function AdminRequestsAllPage() {
    }
  }, [pageCount, page])

+  useEffect(() => {
+    setPage(1)
+  }, [stage])
+
  return (
    <AdminShell
      title="All requests"
@@ -98,6 +121,16 @@ export default function AdminRequestsAllPage() {
            <span>{total.toLocaleString()} total</span>
          </div>
          <div className="admin-toolbar-actions">
+            <label className="admin-select">
+              <span>Stage</span>
+              <select value={stage} onChange={(e) => setStage(e.target.value)}>
+                {REQUEST_STAGE_OPTIONS.map((option) => (
+                  <option key={option.value} value={option.value}>
+                    {option.label}
+                  </option>
+                ))}
+              </select>
+            </label>
            <label className="admin-select">
              <span>Per page</span>
              <select value={pageSize} onChange={(e) => setPageSize(Number(e.target.value))}>
--- a/frontend/app/globals.css
+++ b/frontend/app/globals.css
@@ -1527,6 +1527,13 @@ button span {
  color: var(--ink-muted);
 }

+.recent-filter-group {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 10px;
+  align-items: center;
+}
+
 .recent-filter select {
  padding: 8px 12px;
  font-size: 13px;
--- a/frontend/app/page.tsx
+++ b/frontend/app/page.tsx
@@ -22,6 +22,17 @@ const normalizeRecentResults = (items: any[]) =>
      }
    })

+const REQUEST_STAGE_OPTIONS = [
+  { value: 'all', label: 'All stages' },
+  { value: 'pending', label: 'Waiting' },
+  { value: 'approved', label: 'Approved' },
+  { value: 'in_progress', label: 'In progress' },
+  { value: 'working', label: 'Working' },
+  { value: 'partial', label: 'Partial' },
+  { value: 'ready', label: 'Ready' },
+  { value: 'declined', label: 'Declined' },
+]
+
 export default function HomePage() {
  const router = useRouter()
  const [query, setQuery] = useState('')
@@ -38,11 +49,20 @@ export default function HomePage() {
  const [recentError, setRecentError] = useState<string | null>(null)
  const [recentLoading, setRecentLoading] = useState(false)
  const [searchResults, setSearchResults] = useState<
-    { title: string; year?: number; type?: string; requestId?: number; statusLabel?: string }[]
+    {
+      title: string
+      year?: number
+      type?: string
+      requestId?: number
+      statusLabel?: string
+      requestedBy?: string | null
+      accessible?: boolean
+    }[]
  >([])
  const [searchError, setSearchError] = useState<string | null>(null)
  const [role, setRole] = useState<string | null>(null)
  const [recentDays, setRecentDays] = useState(90)
+  const [recentStage, setRecentStage] = useState('all')
  const [authReady, setAuthReady] = useState(false)
  const [servicesStatus, setServicesStatus] = useState<
    { overall: string; services: { name: string; status: string; message?: string }[] } | null
@@ -143,9 +163,14 @@ export default function HomePage() {
        setRole(userRole)
        setAuthReady(true)
        const take = userRole === 'admin' ? 50 : 6
-        const response = await authFetch(
-          `${baseUrl}/requests/recent?take=${take}&days=${recentDays}`
-        )
+        const params = new URLSearchParams({
+          take: String(take),
+          days: String(recentDays),
+        })
+        if (recentStage !== 'all') {
+          params.set('stage', recentStage)
+        }
+        const response = await authFetch(`${baseUrl}/requests/recent?${params.toString()}`)
        if (!response.ok) {
          if (response.status === 401) {
            clearToken()
@@ -167,7 +192,7 @@ export default function HomePage() {
    }

    load()
-  }, [recentDays])
+  }, [recentDays, recentStage])

  useEffect(() => {
    if (!authReady) {
@@ -222,7 +247,14 @@ export default function HomePage() {
      try {
        const streamToken = await getEventStreamToken()
        if (closed) return
-        const streamUrl = `${baseUrl}/events/stream?stream_token=${encodeURIComponent(streamToken)}&recent_days=${encodeURIComponent(String(recentDays))}`
+        const params = new URLSearchParams({
+          stream_token: streamToken,
+          recent_days: String(recentDays),
+        })
+        if (recentStage !== 'all') {
+          params.set('recent_stage', recentStage)
+        }
+        const streamUrl = `${baseUrl}/events/stream?${params.toString()}`
        source = new EventSource(streamUrl)

        source.onopen = () => {
@@ -282,7 +314,7 @@ export default function HomePage() {
      setLiveStreamConnected(false)
      source?.close()
    }
-  }, [authReady, recentDays])
+  }, [authReady, recentDays, recentStage])

  const runSearch = async (term: string) => {
    try {
@@ -299,14 +331,16 @@ export default function HomePage() {
      const data = await response.json()
      if (Array.isArray(data?.results)) {
        setSearchResults(
-          data.results.map((item: any) => ({
-            title: item.title,
-            year: item.year,
-            type: item.type,
-            requestId: item.requestId,
-            statusLabel: item.statusLabel,
-          }))
-        )
+            data.results.map((item: any) => ({
+              title: item.title,
+              year: item.year,
+              type: item.type,
+              requestId: item.requestId,
+              statusLabel: item.statusLabel,
+              requestedBy: item.requestedBy ?? null,
+              accessible: Boolean(item.accessible),
+            }))
+          )
        setSearchError(null)
      }
    } catch (error) {
@@ -403,19 +437,34 @@ export default function HomePage() {
            <div className="recent-header">
              <h2>{role === 'admin' ? 'All requests' : 'My recent requests'}</h2>
              {authReady && (
-                <label className="recent-filter">
-                  <span>Show</span>
-                  <select
-                    value={recentDays}
-                    onChange={(event) => setRecentDays(Number(event.target.value))}
-                  >
-                    <option value={0}>All</option>
-                    <option value={30}>30 days</option>
-                    <option value={60}>60 days</option>
-                    <option value={90}>90 days</option>
-                    <option value={180}>180 days</option>
-                  </select>
-                </label>
+                <div className="recent-filter-group">
+                  <label className="recent-filter">
+                    <span>Show</span>
+                    <select
+                      value={recentDays}
+                      onChange={(event) => setRecentDays(Number(event.target.value))}
+                    >
+                      <option value={0}>All</option>
+                      <option value={30}>30 days</option>
+                      <option value={60}>60 days</option>
+                      <option value={90}>90 days</option>
+                      <option value={180}>180 days</option>
+                    </select>
+                  </label>
+                  <label className="recent-filter">
+                    <span>Stage</span>
+                    <select
+                      value={recentStage}
+                      onChange={(event) => setRecentStage(event.target.value)}
+                    >
+                      {REQUEST_STAGE_OPTIONS.map((option) => (
+                        <option key={option.value} value={option.value}>
+                          {option.label}
+                        </option>
+                      ))}
+                    </select>
+                  </label>
+                </div>
              )}
            </div>
            <div className="recent-grid">
@@ -467,9 +516,10 @@ export default function HomePage() {
        <aside className="side-panel">
          <section className="main-panel find-panel">
            <div className="find-header">
-              <h1>Find my request</h1>
+              <h1>Search all requests</h1>
              <p className="lede">
-                Search by title + year, paste a request number, or pick from your recent requests.
+                Search any request by title + year or request number and see whether it already
+                exists in the system.
              </p>
            </div>
            <div className="find-controls">
@@ -517,15 +567,21 @@ export default function HomePage() {
                    <button
                      key={`${item.title || 'Untitled'}-${index}`}
                      type="button"
-                      disabled={!item.requestId}
-                      onClick={() => item.requestId && router.push(`/requests/${item.requestId}`)}
+                      disabled={!item.requestId || !item.accessible}
+                      onClick={() =>
+                        item.requestId && item.accessible && router.push(`/requests/${item.requestId}`)
+                      }
                    >
                      {item.title || 'Untitled'} {item.year ? `(${item.year})` : ''}{' '}
                      {!item.requestId
                        ? '- not requested'
-                        : item.statusLabel
-                          ? `- ${item.statusLabel}`
-                          : ''}
+                        : !item.accessible
+                          ? `- ${item.statusLabel || 'Requested'} · requested by ${
+                              item.requestedBy || 'another user'
+                            }`
+                          : item.statusLabel
+                            ? `- ${item.statusLabel}`
+                            : ''}
                    </button>
                  ))
                )}