feat: el buscador de Proyectos y Actividades tambien busca en tareas
Buscador de Proyectos: ahora busca tambien en actividades y tareas de cualquier proyecto (antes solo nombre/codigo del proyecto). Resultados en un panel flotante con la ruta completa "Proyecto - Actividad - Tarea"; clic navega al proyecto y abre la actividad encontrada (pestaña Tareas si el resultado era una tarea). Buscador de Actividades (dentro de un proyecto): busca tambien en las tareas de esa actividad, mismo panel con "Actividad - Tarea". Nuevo GET /api/search?q=...&projectId= (global o acotado a un proyecto). Nuevos componentes/hooks reutilizables: SearchResultsDropdown, useDebouncedValue. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
@@ -4,11 +4,14 @@ import { Plus, Save, Trash2, RotateCcw, ArrowLeft } from 'lucide-react';
|
||||
import { useUi } from '../../context/ui-context.jsx';
|
||||
import { useAuth } from '../../context/auth-context.jsx';
|
||||
import { useAsync, useAction } from '../../hooks/useAsync.js';
|
||||
import { useDebouncedValue } from '../../hooks/useDebouncedValue.js';
|
||||
import { listProjects, createProject, deleteProject, restoreProject, permanentlyDeleteProject } from '../../services/projects.js';
|
||||
import { search as searchApi } from '../../services/search.js';
|
||||
import { listCatalog } from '../../services/catalogs.js';
|
||||
import { listDepartments } from '../../services/departments.js';
|
||||
import { ListView } from '../../components/ListView.jsx';
|
||||
import { SearchInput } from '../../components/SearchInput.jsx';
|
||||
import { SearchResultsDropdown } from '../../components/SearchResultsDropdown.jsx';
|
||||
import { Button } from '../../components/Button.jsx';
|
||||
import { Field, FieldRow } from '../../components/Field.jsx';
|
||||
import { ComboBox } from '../../components/ComboBox.jsx';
|
||||
@@ -57,6 +60,33 @@ export default function ProyectosPage() {
|
||||
const [creating, setCreating] = useState(false);
|
||||
const [form, setForm] = useState(EMPTY_FORM);
|
||||
|
||||
// Busca tambien en actividades y tareas de CUALQUIER proyecto (no solo el nombre del proyecto,
|
||||
// que ya filtra la tabla mas abajo via getSearchHaystack) — resultados con su ruta completa
|
||||
// "Proyecto - Actividad - Tarea" en un panel flotante bajo el buscador.
|
||||
const debouncedSearch = useDebouncedValue(search, 300);
|
||||
const searchQuery = debouncedSearch.trim();
|
||||
const { data: searchResults } = useAsync(
|
||||
() => (searchQuery.length >= 2 ? searchApi(searchQuery) : Promise.resolve(null)),
|
||||
[searchQuery]
|
||||
);
|
||||
const searchItems = searchResults ? [
|
||||
...searchResults.projects.map((p) => ({
|
||||
key: `p-${p.id}`,
|
||||
breadcrumb: [`${p.code} — ${p.name}`],
|
||||
onClick: () => { setSearch(''); navigate(`/proyectos/${p.id}`); },
|
||||
})),
|
||||
...searchResults.activities.map((a) => ({
|
||||
key: `a-${a.id}`,
|
||||
breadcrumb: [`${a.project_code} — ${a.project_name}`, `${a.code} — ${a.name}`],
|
||||
onClick: () => { setSearch(''); navigate(`/proyectos/${a.project_id}?tab=activities&activity=${a.id}`); },
|
||||
})),
|
||||
...searchResults.tasks.map((tk) => ({
|
||||
key: `t-${tk.id}`,
|
||||
breadcrumb: [`${tk.project_code} — ${tk.project_name}`, `${tk.activity_code} — ${tk.activity_name}`, tk.name],
|
||||
onClick: () => { setSearch(''); navigate(`/proyectos/${tk.project_id}?tab=activities&activity=${tk.activity_id}&activityTab=tasks`); },
|
||||
})),
|
||||
] : null;
|
||||
|
||||
const deptOptions = deptTree ? flatten(deptTree).map((d) => ({ value: d.id, label: d.name })) : [];
|
||||
const priorityOptions = (priorities || []).map((p) => ({ value: p.id, label: p.name }));
|
||||
const statusOptions = (statuses || []).map((s) => ({ value: s.id, label: s.name }));
|
||||
@@ -169,7 +199,12 @@ export default function ProyectosPage() {
|
||||
{showTrash && <div className="text-muted" style={{ fontSize: '.8rem', marginBottom: 8 }}>{t('project_trash_empty_hint')}</div>}
|
||||
|
||||
<div className="toolbar">
|
||||
<SearchInput value={search} onChange={setSearch} />
|
||||
<div style={{ position: 'relative' }}>
|
||||
<SearchInput value={search} onChange={setSearch} />
|
||||
{searchQuery.length >= 2 && searchItems && (
|
||||
<SearchResultsDropdown items={searchItems} emptyLabel={t('common_search_no_results')} />
|
||||
)}
|
||||
</div>
|
||||
{!showTrash && (
|
||||
<>
|
||||
<div style={{ width: 160 }}>
|
||||
|
||||
Reference in New Issue
Block a user