From 2162f55ac39a9293c7e5b5282d378f39169de08b Mon Sep 17 00:00:00 2001 From: budowski Date: Wed, 18 Dec 2024 09:30:11 +0900 Subject: [PATCH] Fix #2323 - view taxon observations from explore screen by tapping on taxon (#2554) * Fix #2323 - view taxon observations from explore screen by tapping on taxon * Updated test snapshots --- src/components/Explore/TaxonGridItem.tsx | 32 +++++++++++++++++-- .../SharedComponents/INatIcon/index.tsx | 29 +++++++++++------ src/providers/ExploreContext.tsx | 2 ++ .../__snapshots__/CustomTabBar.test.js.snap | 10 +++--- .../__snapshots__/ActivityCount.test.js.snap | 2 +- .../__snapshots__/CommentsCount.test.js.snap | 6 ++-- .../IdentificationsCount.test.js.snap | 6 ++-- .../__snapshots__/INatIconButton.test.js.snap | 2 +- .../__snapshots__/InlineUser.test.js.snap | 4 +-- .../__snapshots__/ObsGridItem.test.js.snap | 4 +-- .../__snapshots__/UploadStatus.test.js.snap | 10 +++--- .../__snapshots__/Checkbox.test.js.snap | 2 +- .../__snapshots__/TaxonResult.test.js.snap | 6 ++-- .../__snapshots__/INatIcon.test.js.snap | 2 +- 14 files changed, 79 insertions(+), 38 deletions(-) diff --git a/src/components/Explore/TaxonGridItem.tsx b/src/components/Explore/TaxonGridItem.tsx index 73d413159e..78c8ba9f22 100644 --- a/src/components/Explore/TaxonGridItem.tsx +++ b/src/components/Explore/TaxonGridItem.tsx @@ -1,23 +1,31 @@ import { useNavigation, useRoute } from "@react-navigation/native"; import ObsImagePreview from "components/ObservationsFlashList/ObsImagePreview"; -import { Body4, DisplayTaxonName } from "components/SharedComponents"; +import { Body4, DisplayTaxonName, INatIcon } from "components/SharedComponents"; import SpeciesSeenCheckmark from "components/SharedComponents/SpeciesSeenCheckmark"; import { Pressable, View } from "components/styledComponents"; +import { + EXPLORE_ACTION, + useExplore +} from "providers/ExploreContext.tsx"; import type { Node } from "react"; import React from "react"; import Photo from "realmModels/Photo"; import { accessibleTaxonName } from "sharedHelpers/taxon"; import { useCurrentUser, useFontScale, useTranslation } from "sharedHooks"; +import colors from "styles/tailwindColors"; interface Props { count: number; showSpeciesSeenCheckmark: boolean; style?: Object; + setCurrentExploreView: Function, // I guess this is expecting an API response and not a RealmTaxon taxon: { default_photo: Object; iconic_taxon_name: string; id: number; + preferred_common_name: string; + name: string; }; } @@ -25,8 +33,10 @@ const TaxonGridItem = ( { count, showSpeciesSeenCheckmark = false, style, - taxon + taxon, + setCurrentExploreView }: Props ): Node => { + const { dispatch } = useExplore( ); const navigation = useNavigation( ); const { t } = useTranslation( ); const currentUser = useCurrentUser( ); @@ -72,6 +82,24 @@ const TaxonGridItem = ( { )} + {count && ( + { + dispatch( { + type: EXPLORE_ACTION.CHANGE_TAXON, + taxon, + taxonId: taxon?.id, + taxonName: taxon?.preferred_common_name || taxon?.name + } ); + setCurrentExploreView( "observations" ); + }} + > + + + )} + {count && ( ( - -); + testID, name, color, size, dropShadow +}: Props ) => { + const style = dropShadow + ? { + shadowOpacity: 2, + textShadowRadius: 4, + textShadowOffset: { width: 2, height: 2 } + } + : null; + return ( + + ); +}; export default INatIcon; diff --git a/src/providers/ExploreContext.tsx b/src/providers/ExploreContext.tsx index 1b6fe9c470..bb39d8b96c 100644 --- a/src/providers/ExploreContext.tsx +++ b/src/providers/ExploreContext.tsx @@ -230,6 +230,8 @@ type Action = {type: EXPLORE_ACTION.RESET} | { type: EXPLORE_ACTION.CHANGE_TAXON, taxon: { id: number } | null, + taxonId: number, + taxonName: string, storedState: State } | { type: EXPLORE_ACTION.FILTER_BY_ICONIC_TAXON_UNKNOWN } diff --git a/tests/unit/components/BottomTabNavigator/__snapshots__/CustomTabBar.test.js.snap b/tests/unit/components/BottomTabNavigator/__snapshots__/CustomTabBar.test.js.snap index 792b8f8674..85a0566e5c 100644 --- a/tests/unit/components/BottomTabNavigator/__snapshots__/CustomTabBar.test.js.snap +++ b/tests/unit/components/BottomTabNavigator/__snapshots__/CustomTabBar.test.js.snap @@ -136,7 +136,7 @@ exports[`CustomTabBar with advanced user layout should render correctly 1`] = ` "color": "#454545", "fontSize": 32, }, - undefined, + null, { "fontFamily": "INatIcon", "fontStyle": "normal", @@ -224,7 +224,7 @@ exports[`CustomTabBar with advanced user layout should render correctly 1`] = ` "color": "#454545", "fontSize": 40, }, - undefined, + null, { "fontFamily": "INatIcon", "fontStyle": "normal", @@ -359,7 +359,7 @@ exports[`CustomTabBar with advanced user layout should render correctly 1`] = ` "color": "#ffffff", "fontSize": 31, }, - undefined, + null, { "fontFamily": "INatIcon", "fontStyle": "normal", @@ -448,7 +448,7 @@ exports[`CustomTabBar with advanced user layout should render correctly 1`] = ` "color": "#74AC00", "fontSize": 40, }, - undefined, + null, { "fontFamily": "INatIcon", "fontStyle": "normal", @@ -536,7 +536,7 @@ exports[`CustomTabBar with advanced user layout should render correctly 1`] = ` "color": "#454545", "fontSize": 32, }, - undefined, + null, { "fontFamily": "INatIcon", "fontStyle": "normal", diff --git a/tests/unit/components/SharedComponents/ActivityCount/__snapshots__/ActivityCount.test.js.snap b/tests/unit/components/SharedComponents/ActivityCount/__snapshots__/ActivityCount.test.js.snap index 5cbb05dea8..1fd5608d01 100644 --- a/tests/unit/components/SharedComponents/ActivityCount/__snapshots__/ActivityCount.test.js.snap +++ b/tests/unit/components/SharedComponents/ActivityCount/__snapshots__/ActivityCount.test.js.snap @@ -26,7 +26,7 @@ exports[`ActivityCount renders reliably 1`] = ` "color": "#454545", "fontSize": 14, }, - undefined, + null, { "fontFamily": "INatIcon", "fontStyle": "normal", diff --git a/tests/unit/components/SharedComponents/ActivityCount/__snapshots__/CommentsCount.test.js.snap b/tests/unit/components/SharedComponents/ActivityCount/__snapshots__/CommentsCount.test.js.snap index fe7e326e04..45438b55c0 100644 --- a/tests/unit/components/SharedComponents/ActivityCount/__snapshots__/CommentsCount.test.js.snap +++ b/tests/unit/components/SharedComponents/ActivityCount/__snapshots__/CommentsCount.test.js.snap @@ -26,7 +26,7 @@ exports[`CommentsCount renders default reliably 1`] = ` "color": "#454545", "fontSize": 14, }, - undefined, + null, { "fontFamily": "INatIcon", "fontStyle": "normal", @@ -101,7 +101,7 @@ exports[`CommentsCount renders filled reliably 1`] = ` "color": "#454545", "fontSize": 14, }, - undefined, + null, { "fontFamily": "INatIcon", "fontStyle": "normal", @@ -176,7 +176,7 @@ exports[`CommentsCount renders white reliably 1`] = ` "color": "#ffffff", "fontSize": 14, }, - undefined, + null, { "fontFamily": "INatIcon", "fontStyle": "normal", diff --git a/tests/unit/components/SharedComponents/ActivityCount/__snapshots__/IdentificationsCount.test.js.snap b/tests/unit/components/SharedComponents/ActivityCount/__snapshots__/IdentificationsCount.test.js.snap index a3c712179a..4a6d07a11c 100644 --- a/tests/unit/components/SharedComponents/ActivityCount/__snapshots__/IdentificationsCount.test.js.snap +++ b/tests/unit/components/SharedComponents/ActivityCount/__snapshots__/IdentificationsCount.test.js.snap @@ -26,7 +26,7 @@ exports[`IdentificationsCount renders default reliably 1`] = ` "color": "#454545", "fontSize": 14, }, - undefined, + null, { "fontFamily": "INatIcon", "fontStyle": "normal", @@ -101,7 +101,7 @@ exports[`IdentificationsCount renders filled reliably 1`] = ` "color": "#454545", "fontSize": 14, }, - undefined, + null, { "fontFamily": "INatIcon", "fontStyle": "normal", @@ -176,7 +176,7 @@ exports[`IdentificationsCount renders white reliably 1`] = ` "color": "#ffffff", "fontSize": 14, }, - undefined, + null, { "fontFamily": "INatIcon", "fontStyle": "normal", diff --git a/tests/unit/components/SharedComponents/Buttons/__snapshots__/INatIconButton.test.js.snap b/tests/unit/components/SharedComponents/Buttons/__snapshots__/INatIconButton.test.js.snap index fa58dbd31d..f923c8fbf2 100644 --- a/tests/unit/components/SharedComponents/Buttons/__snapshots__/INatIconButton.test.js.snap +++ b/tests/unit/components/SharedComponents/Buttons/__snapshots__/INatIconButton.test.js.snap @@ -73,7 +73,7 @@ exports[`INatIconButton renders correctly 1`] = ` "color": "#454545", "fontSize": 18, }, - undefined, + null, { "fontFamily": "INatIcon", "fontStyle": "normal", diff --git a/tests/unit/components/SharedComponents/InlineUser/__snapshots__/InlineUser.test.js.snap b/tests/unit/components/SharedComponents/InlineUser/__snapshots__/InlineUser.test.js.snap index bc6f6f06b9..059979001b 100644 --- a/tests/unit/components/SharedComponents/InlineUser/__snapshots__/InlineUser.test.js.snap +++ b/tests/unit/components/SharedComponents/InlineUser/__snapshots__/InlineUser.test.js.snap @@ -183,7 +183,7 @@ exports[`InlineUser when offline renders reliably 1`] = ` "color": "#454545", "fontSize": 22, }, - undefined, + null, { "fontFamily": "INatIcon", "fontStyle": "normal", @@ -311,7 +311,7 @@ exports[`InlineUser when user has no icon set renders reliably 1`] = ` "color": "#454545", "fontSize": 22, }, - undefined, + null, { "fontFamily": "INatIcon", "fontStyle": "normal", diff --git a/tests/unit/components/SharedComponents/ObservationsFlashList/__snapshots__/ObsGridItem.test.js.snap b/tests/unit/components/SharedComponents/ObservationsFlashList/__snapshots__/ObsGridItem.test.js.snap index c86a88cf52..05d21a1ef1 100644 --- a/tests/unit/components/SharedComponents/ObservationsFlashList/__snapshots__/ObsGridItem.test.js.snap +++ b/tests/unit/components/SharedComponents/ObservationsFlashList/__snapshots__/ObsGridItem.test.js.snap @@ -107,7 +107,7 @@ exports[`ObsGridItem for an observation with a photo should render 1`] = ` "color": "#BFBFBF33", "fontSize": 100, }, - undefined, + null, { "fontFamily": "INatIcon", "fontStyle": "normal", @@ -351,7 +351,7 @@ exports[`ObsGridItem for an observation without a photo should render 1`] = ` "color": "#BFBFBF33", "fontSize": 100, }, - undefined, + null, { "fontFamily": "INatIcon", "fontStyle": "normal", diff --git a/tests/unit/components/SharedComponents/UploadStatus/__snapshots__/UploadStatus.test.js.snap b/tests/unit/components/SharedComponents/UploadStatus/__snapshots__/UploadStatus.test.js.snap index 57e867da87..a33190c0d9 100644 --- a/tests/unit/components/SharedComponents/UploadStatus/__snapshots__/UploadStatus.test.js.snap +++ b/tests/unit/components/SharedComponents/UploadStatus/__snapshots__/UploadStatus.test.js.snap @@ -85,7 +85,7 @@ exports[`UploadStatus displays complete icon when progress is 1 1`] = ` "color": "#74AC00", "fontSize": 28, }, - undefined, + null, { "fontFamily": "INatIcon", "fontStyle": "normal", @@ -190,7 +190,7 @@ exports[`UploadStatus displays progress bar when progress is greater than 5% 1`] "color": "#454545", "fontSize": 15, }, - undefined, + null, { "fontFamily": "INatIcon", "fontStyle": "normal", @@ -275,7 +275,7 @@ exports[`UploadStatus displays rotating circle progress when upload is queued bu "color": "#454545", "fontSize": 15, }, - undefined, + null, { "fontFamily": "INatIcon", "fontStyle": "normal", @@ -323,7 +323,7 @@ exports[`UploadStatus displays rotating circle progress when upload is queued bu "color": "#454545", "fontSize": 33, }, - undefined, + null, { "fontFamily": "INatIcon", "fontStyle": "normal", @@ -429,7 +429,7 @@ exports[`UploadStatus displays start icon when upload is unsynced and not queued "color": "#454545", "fontSize": 33, }, - undefined, + null, { "fontFamily": "INatIcon", "fontStyle": "normal", diff --git a/tests/unit/components/SharedComponents/__snapshots__/Checkbox.test.js.snap b/tests/unit/components/SharedComponents/__snapshots__/Checkbox.test.js.snap index dcf0887a02..0d008f650a 100644 --- a/tests/unit/components/SharedComponents/__snapshots__/Checkbox.test.js.snap +++ b/tests/unit/components/SharedComponents/__snapshots__/Checkbox.test.js.snap @@ -268,7 +268,7 @@ exports[`Checkbox renders reliably being checked 1`] = ` "color": "#ffffff", "fontSize": 19, }, - undefined, + null, { "fontFamily": "INatIcon", "fontStyle": "normal", diff --git a/tests/unit/components/SharedComponents/__snapshots__/TaxonResult.test.js.snap b/tests/unit/components/SharedComponents/__snapshots__/TaxonResult.test.js.snap index e93d776b32..7a9561c13c 100644 --- a/tests/unit/components/SharedComponents/__snapshots__/TaxonResult.test.js.snap +++ b/tests/unit/components/SharedComponents/__snapshots__/TaxonResult.test.js.snap @@ -245,7 +245,7 @@ exports[`TaxonResult should render correctly 1`] = ` "color": "#454545", "fontSize": 22, }, - undefined, + null, { "fontFamily": "INatIcon", "fontStyle": "normal", @@ -497,7 +497,7 @@ exports[`TaxonResult should render correctly 1`] = ` "color": "#454545", "fontSize": 22, }, - undefined, + null, { "fontFamily": "INatIcon", "fontStyle": "normal", @@ -588,7 +588,7 @@ exports[`TaxonResult should render correctly 1`] = ` "color": "#454545", "fontSize": 40, }, - undefined, + null, { "fontFamily": "INatIcon", "fontStyle": "normal", diff --git a/tests/unit/components/__snapshots__/INatIcon.test.js.snap b/tests/unit/components/__snapshots__/INatIcon.test.js.snap index 7c31f74545..13b66324c3 100644 --- a/tests/unit/components/__snapshots__/INatIcon.test.js.snap +++ b/tests/unit/components/__snapshots__/INatIcon.test.js.snap @@ -10,7 +10,7 @@ exports[`INatIcon renders correctly 1`] = ` "color": "#4F8EF7", "fontSize": 20, }, - undefined, + null, { "fontFamily": "INatIcon", "fontStyle": "normal",