diff --git a/frontend/src/common/utils/i18n/resources/en/report.json b/frontend/src/common/utils/i18n/resources/en/report.json index 0e4cf661..0a94b751 100644 --- a/frontend/src/common/utils/i18n/resources/en/report.json +++ b/frontend/src/common/utils/i18n/resources/en/report.json @@ -49,9 +49,10 @@ "filterBookmarked": "Bookmarked", "noBookmarksTitle": "No Bookmarked Reports", "noBookmarksMessage": "Bookmark reports to find them quickly here", - "noMatchesTitle": "No Matching Reports", - "noMatchesMessage": "No reports match your current filters. Try changing or clearing your filters.", + "noMatchesTitle": "No matching reports found", + "noMatchesMessage": "Try clearing or adjusting your filters to see available results.", "clearFilters": "Clear Filters", + "changeFilters": "Change Filters", "sortButton": "Sort reports", "filterButton": "Filter reports" }, diff --git a/frontend/src/common/utils/i18n/resources/es/report.json b/frontend/src/common/utils/i18n/resources/es/report.json index a46e17a1..d3bc6ab6 100644 --- a/frontend/src/common/utils/i18n/resources/es/report.json +++ b/frontend/src/common/utils/i18n/resources/es/report.json @@ -49,9 +49,10 @@ "filterBookmarked": "Guardados", "noBookmarksTitle": "No Hay Informes Guardados", "noBookmarksMessage": "Guarda informes como favoritos para encontrarlos rápidamente aquí", - "noMatchesTitle": "No Hay Informes Coincidentes", - "noMatchesMessage": "Ningún informe coincide con los filtros actuales. Intenta cambiar o eliminar los filtros.", + "noMatchesTitle": "No se encontraron informes coincidentes", + "noMatchesMessage": "Intente borrar o ajustar sus filtros para ver los resultados disponibles.", "clearFilters": "Eliminar Filtros", + "changeFilters": "Cambiar Filtros", "sortButton": "Ordenar informes", "filterButton": "Filtrar informes" }, diff --git a/frontend/src/common/utils/i18n/resources/fr/report.json b/frontend/src/common/utils/i18n/resources/fr/report.json index fb970cd8..ef9be5a3 100644 --- a/frontend/src/common/utils/i18n/resources/fr/report.json +++ b/frontend/src/common/utils/i18n/resources/fr/report.json @@ -49,9 +49,10 @@ "filterBookmarked": "Favoris", "noBookmarksTitle": "Aucun Rapport en Favoris", "noBookmarksMessage": "Marquez des rapports comme favoris pour les trouver rapidement ici", - "noMatchesTitle": "Aucun Rapport Correspondant", - "noMatchesMessage": "Aucun rapport ne correspond à vos filtres actuels. Essayez de modifier ou de supprimer vos filtres.", + "noMatchesTitle": "Aucun rapport correspondant trouvé", + "noMatchesMessage": "Essayez de supprimer ou d'ajuster vos filtres pour voir les résultats disponibles.", "clearFilters": "Effacer les Filtres", + "changeFilters": "Modifier les Filtres", "sortButton": "Trier les rapports", "filterButton": "Filtrer les rapports" }, diff --git a/frontend/src/pages/Reports/ReportsListPage.tsx b/frontend/src/pages/Reports/ReportsListPage.tsx index 309ff817..a6c0becb 100644 --- a/frontend/src/pages/Reports/ReportsListPage.tsx +++ b/frontend/src/pages/Reports/ReportsListPage.tsx @@ -28,6 +28,7 @@ import sortSvg from 'assets/icons/sort.svg'; import filterOutlineIcon from 'assets/icons/filter-outline.svg'; import FilterPanel, { CategoryOption } from './components/FilterPanel/FilterPanel'; import CategoryTag from './components/CategoryTag/CategoryTag'; +import ReportsFilterEmpty from './components/ReportsFilterEmpty/ReportsFilterEmpty'; import './ReportsListPage.scss'; @@ -225,13 +226,11 @@ const ReportsListPage: React.FC = () => {

{t('list.noBookmarksMessage', { ns: 'report' })}

) : selectedCategories.length > 0 ? ( -
-

{t('list.noMatchesTitle', { ns: 'report' })}

-

{t('list.noMatchesMessage', { ns: 'report' })}

- - {t('list.clearFilters', { ns: 'report' })} - -
+ 0} + /> ) : ( )} @@ -331,8 +330,8 @@ const ReportsListPage: React.FC = () => { isOpen={showFilterModal} onDidDismiss={() => setShowFilterModal(false)} className="reports-list-page__filter-modal" - initialBreakpoint={0.9} - breakpoints={[0, 0.9]} + initialBreakpoint={1} + breakpoints={[0, 0.25, 0.5, 0.75, 1]} > void; + onClearFilters: () => void; + showClearButton?: boolean; + hasSelectedFilters?: boolean; +} + +/** + * Component to display when no reports match the current filter criteria + */ +const ReportsFilterEmpty: React.FC = ({ + onChangeFilters, + onClearFilters, + showClearButton = true, + hasSelectedFilters = true, +}) => { + const { t } = useTranslation(['report', 'common']); + + return ( +
+
+ +
+ +

+ {t('list.noMatchesTitle', { ns: 'report' })} +

+ +

+ {t('list.noMatchesMessage', { ns: 'report' })} +

+ +
+ + {t('list.changeFilters', { ns: 'report' })} + + + {showClearButton && hasSelectedFilters && ( + + {t('list.clearFilters', { ns: 'report' })} + + )} +
+
+ ); +}; + +export default ReportsFilterEmpty; diff --git a/frontend/src/pages/Reports/components/ReportsFilterEmpty/index.ts b/frontend/src/pages/Reports/components/ReportsFilterEmpty/index.ts new file mode 100644 index 00000000..77f40edd --- /dev/null +++ b/frontend/src/pages/Reports/components/ReportsFilterEmpty/index.ts @@ -0,0 +1 @@ +export { default } from './ReportsFilterEmpty'; diff --git a/frontend/src/types/custom.d.ts b/frontend/src/types/custom.d.ts new file mode 100644 index 00000000..e21ed019 --- /dev/null +++ b/frontend/src/types/custom.d.ts @@ -0,0 +1,26 @@ +declare module '*.svg' { + import * as React from 'react'; + export const ReactComponent: React.FC>; + const src: string; + export default src; +} + +declare module '*.png' { + const content: string; + export default content; +} + +declare module '*.jpg' { + const content: string; + export default content; +} + +declare module '*.jpeg' { + const content: string; + export default content; +} + +declare module '*.gif' { + const content: string; + export default content; +} diff --git a/frontend/tsconfig.json b/frontend/tsconfig.json index 8dbcb5fc..ee4831a2 100644 --- a/frontend/tsconfig.json +++ b/frontend/tsconfig.json @@ -25,6 +25,6 @@ "test/*": ["./src/test/*"] } }, - "include": ["src"], + "include": ["src", "src/types"], "references": [{ "path": "./tsconfig.node.json" }] }