From 32093dbe39e2e0ce1e2b8500ca069bb3c7907db0 Mon Sep 17 00:00:00 2001 From: LeandraH Date: Thu, 9 Jan 2025 14:41:09 +0100 Subject: [PATCH 01/10] 2926: Redesign of search feedback in web --- translations/translations.json | 14 ++++++- web/src/components/Feedback.tsx | 12 ++---- web/src/components/FeedbackContainer.tsx | 3 -- web/src/components/SearchFeedback.tsx | 42 ++++++++++++++++++- .../components/__tests__/Feedback.spec.tsx | 1 - .../__tests__/SearchFeedback.spec.tsx | 6 ++- web/src/routes/__tests__/SearchPage.spec.tsx | 4 +- 7 files changed, 61 insertions(+), 21 deletions(-) diff --git a/translations/translations.json b/translations/translations.json index 4e2f81ffce..33b8c888a1 100644 --- a/translations/translations.json +++ b/translations/translations.json @@ -4830,7 +4830,12 @@ "positiveRating": "Diese Seite ist hilfreich", "searchTermDescription": "Für den folgenden Begriff konnte kein Ergebnis gefunden werden:", "contactMailAddress": "E-Mail für Rückfragen", - "note": "Bitte wähle eine Reaktion oder schreibe einen Kommentar, um das Feedback abschicken zu können." + "note": "Bitte wähle eine Reaktion oder schreibe einen Kommentar, um das Feedback abschicken zu können.", + "giveFeedback": "Feedback geben", + "checkQuery": "Überprüfen Sie Ihren Suchbegriff oder ändern Sie die eingestellte Sprache der {{appName}}-App.", + "informationMissing": "Hier fehlen Informationen?", + "noResultsInOneLanguage": "Es wurden leider keine passenden Ergebnisse auf {{contentLanguage}} gefunden.", + "noResultsInTwoLanguages": "Es wurden leider keine passenden Ergebnisse auf {{contentLanguage}} oder {{fallbackLanguage}} gefunden." }, "am": { "disclaimer": "የግንኙነት መረጃና ዕትም", @@ -5014,7 +5019,12 @@ "positiveRating": "This site is useful", "searchTermDescription": "No result could be found for the following term:", "contactMailAddress": "E-Mail for further questions", - "note": "Please select a reaction or write a comment in order to send feedback." + "note": "Please select a reaction or write a comment in order to send feedback.", + "giveFeedback": "Give feedback", + "checkQuery": "Check your search term or select a different language in the {{appName}} app", + "informationMissing": "Is information missing?", + "noResultsInOneLanguage": "Sorry, we could not find any matching results in {{contentLanguage}}.", + "noResultsInTwoLanguages": "Sorry, we could not find any matching results in {{contentLanguage}} or {{fallbackLanguage}}." }, "es": { "disclaimer": "Contacto y aviso legal", diff --git a/web/src/components/Feedback.tsx b/web/src/components/Feedback.tsx index 78b1abc9f2..cd718c2fd7 100644 --- a/web/src/components/Feedback.tsx +++ b/web/src/components/Feedback.tsx @@ -4,7 +4,6 @@ import styled from 'styled-components' import buildConfig from '../constants/buildConfig' import dimensions from '../constants/dimensions' -import Failure from './Failure' import FeedbackButtons from './FeedbackButtons' import { SendingStatusType } from './FeedbackContainer' import Note from './Note' @@ -49,7 +48,6 @@ type FeedbackProps = { onFeedbackChanged?: (isPositiveFeedback: boolean | null) => void onSubmit: () => void sendingStatus: SendingStatusType - noResults: boolean | undefined searchTerm: string | undefined setSearchTerm: (newTerm: string) => void closeFeedback: (() => void) | undefined @@ -64,7 +62,6 @@ const Feedback = ({ onCommentChanged, onContactMailChanged, onFeedbackChanged, - noResults, searchTerm, setSearchTerm, closeFeedback, @@ -87,12 +84,9 @@ const Feedback = ({ return ( {isSearchFeedback ? ( - <> - {noResults && } - - - - + + + ) : ( onFeedbackChanged && )} diff --git a/web/src/components/FeedbackContainer.tsx b/web/src/components/FeedbackContainer.tsx index 083be2fc8a..a97360e5be 100644 --- a/web/src/components/FeedbackContainer.tsx +++ b/web/src/components/FeedbackContainer.tsx @@ -12,7 +12,6 @@ type FeedbackContainerProps = { routeType: FeedbackRouteType onClose?: () => void query?: string - noResults?: boolean slug?: string onSubmit?: () => void isPositiveRating: boolean | null @@ -23,7 +22,6 @@ export type SendingStatusType = 'idle' | 'sending' | 'failed' | 'successful' export const FeedbackContainer = ({ query, - noResults, language, routeType, cityCode, @@ -85,7 +83,6 @@ export const FeedbackContainer = ({ searchTerm={searchTerm} setSearchTerm={setSearchTerm} closeFeedback={onClose} - noResults={noResults} /> ) } diff --git a/web/src/components/SearchFeedback.tsx b/web/src/components/SearchFeedback.tsx index 30cfb58d32..6ec35dbbf1 100644 --- a/web/src/components/SearchFeedback.tsx +++ b/web/src/components/SearchFeedback.tsx @@ -3,7 +3,9 @@ import { useTranslation } from 'react-i18next' import styled from 'styled-components' import { SEARCH_ROUTE } from 'shared' +import { config } from 'translations' +import buildConfig from '../constants/buildConfig' import FeedbackContainer from './FeedbackContainer' import TextButton from './base/TextButton' @@ -13,6 +15,22 @@ const Container = styled.div` align-items: center; ` +const CenteredContainer = styled.div` + text-align: center; +` + +const SemiBoldText = styled.p` + font-weight: 600; +` + +const MiddleText = styled.p` + padding-bottom: 1rem; +` + +const StyledButton = styled(TextButton)` + margin-top: 0.5rem; +` + type SearchFeedbackProps = { cityCode: string languageCode: string @@ -26,7 +44,7 @@ const SearchFeedback = ({ cityCode, languageCode, query, noResults }: SearchFeed useEffect(() => setShowFeedback(false), [query]) - if (noResults || showFeedback) { + if (showFeedback) { return ( ) } + if (noResults) { + const getLanguageTranslationFromCode = (code: string): string => + new Intl.DisplayNames(languageCode, { type: 'language' }).of(code) ?? code + + return ( + + + {languageCode === config.sourceLanguage + ? t('noResultsInOneLanguage', { contentLanguage: getLanguageTranslationFromCode(languageCode) }) + : t('noResultsInTwoLanguages', { + contentLanguage: getLanguageTranslationFromCode(languageCode), + fallbackLanguage: getLanguageTranslationFromCode(config.sourceLanguage), + })} + + {t('checkQuery', { appName: buildConfig().appName })} + {t('informationMissing')} + setShowFeedback(true)} /> + + ) + } + return ( setShowFeedback(true)} text={t('informationNotFound')} /> diff --git a/web/src/components/__tests__/Feedback.spec.tsx b/web/src/components/__tests__/Feedback.spec.tsx index da1b5b1e07..ab20adbcbf 100644 --- a/web/src/components/__tests__/Feedback.spec.tsx +++ b/web/src/components/__tests__/Feedback.spec.tsx @@ -89,7 +89,6 @@ describe('Feedback', () => { />, ) expect(getByText('feedback:wantedInformation')).toBeTruthy() - expect(getByText('error:search:nothingFound')).toBeTruthy() }) it('should display error', () => { diff --git a/web/src/components/__tests__/SearchFeedback.spec.tsx b/web/src/components/__tests__/SearchFeedback.spec.tsx index b6c7381926..4c9e0217e8 100644 --- a/web/src/components/__tests__/SearchFeedback.spec.tsx +++ b/web/src/components/__tests__/SearchFeedback.spec.tsx @@ -45,17 +45,18 @@ describe('SearchFeedback', () => { expect(queryByText('feedback:wantedInformation')).toBeNull() }) - it('should show feedback if no results found', () => { + it('should show feedback button if no results found', () => { const { getByText } = renderWithTheme( , ) - expect(getByText('feedback:send')).toBeTruthy() + expect(getByText('feedback:giveFeedback')).toBeTruthy() }) it('should not allow sending search feedback if query term is removed', async () => { const { getByText, rerender } = renderWithTheme( , ) + fireEvent.click(getByText('feedback:giveFeedback')) expect(getByText('feedback:send')).toBeEnabled() // the query is controlled in the parent of SearchFeedback, so we need to update the props @@ -64,6 +65,7 @@ describe('SearchFeedback', () => { , ) + fireEvent.click(getByText('feedback:giveFeedback')) await waitFor(() => expect(getByText('feedback:send')).toBeDisabled()) }) }) diff --git a/web/src/routes/__tests__/SearchPage.spec.tsx b/web/src/routes/__tests__/SearchPage.spec.tsx index e1b76c1361..977fa74907 100644 --- a/web/src/routes/__tests__/SearchPage.spec.tsx +++ b/web/src/routes/__tests__/SearchPage.spec.tsx @@ -79,7 +79,7 @@ describe('SearchPage', () => { }) it('should display nothing found for search', () => { - const { getByRole, getByPlaceholderText } = renderSearch() + const { getByPlaceholderText, getByText } = renderSearch() fireEvent.change(getByPlaceholderText('search:searchPlaceholder'), { target: { @@ -87,7 +87,7 @@ describe('SearchPage', () => { }, }) - expect(getByRole('alert')).toContainHTML('search:nothingFound') + expect(getByText('feedback:noResultsInTwoLanguages')).toBeTruthy() }) describe('url query', () => { From 09bd03843f8b6af30b5a073a56fe44d36c68b7c6 Mon Sep 17 00:00:00 2001 From: LeandraH Date: Thu, 9 Jan 2025 15:59:11 +0100 Subject: [PATCH 02/10] 2926: Refactoring --- web/src/components/SearchFeedback.tsx | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/web/src/components/SearchFeedback.tsx b/web/src/components/SearchFeedback.tsx index 6ec35dbbf1..c202cd9b95 100644 --- a/web/src/components/SearchFeedback.tsx +++ b/web/src/components/SearchFeedback.tsx @@ -62,14 +62,16 @@ const SearchFeedback = ({ cityCode, languageCode, query, noResults }: SearchFeed const getLanguageTranslationFromCode = (code: string): string => new Intl.DisplayNames(languageCode, { type: 'language' }).of(code) ?? code + const fallbackLanguage = config.sourceLanguage + return ( - {languageCode === config.sourceLanguage + {languageCode === fallbackLanguage ? t('noResultsInOneLanguage', { contentLanguage: getLanguageTranslationFromCode(languageCode) }) : t('noResultsInTwoLanguages', { contentLanguage: getLanguageTranslationFromCode(languageCode), - fallbackLanguage: getLanguageTranslationFromCode(config.sourceLanguage), + fallbackLanguage: getLanguageTranslationFromCode(fallbackLanguage), })} {t('checkQuery', { appName: buildConfig().appName })} From 191e096a93a2322580f256807f852abeba4c7c40 Mon Sep 17 00:00:00 2001 From: LeandraH Date: Tue, 4 Feb 2025 12:20:23 +0100 Subject: [PATCH 03/10] 2926: Remove language translations --- translations/translations.json | 8 ++++---- web/src/components/SearchFeedback.tsx | 10 +--------- 2 files changed, 5 insertions(+), 13 deletions(-) diff --git a/translations/translations.json b/translations/translations.json index 33b8c888a1..5bf9444286 100644 --- a/translations/translations.json +++ b/translations/translations.json @@ -4834,8 +4834,8 @@ "giveFeedback": "Feedback geben", "checkQuery": "Überprüfen Sie Ihren Suchbegriff oder ändern Sie die eingestellte Sprache der {{appName}}-App.", "informationMissing": "Hier fehlen Informationen?", - "noResultsInOneLanguage": "Es wurden leider keine passenden Ergebnisse auf {{contentLanguage}} gefunden.", - "noResultsInTwoLanguages": "Es wurden leider keine passenden Ergebnisse auf {{contentLanguage}} oder {{fallbackLanguage}} gefunden." + "noResultsInOneLanguage": "Es wurden leider keine passenden Ergebnisse in Deiner Sprache gefunden.", + "noResultsInTwoLanguages": "Es wurden leider keine passenden Ergebnisse in Deiner Sprache oder auf Deutsch gefunden." }, "am": { "disclaimer": "የግንኙነት መረጃና ዕትም", @@ -5023,8 +5023,8 @@ "giveFeedback": "Give feedback", "checkQuery": "Check your search term or select a different language in the {{appName}} app", "informationMissing": "Is information missing?", - "noResultsInOneLanguage": "Sorry, we could not find any matching results in {{contentLanguage}}.", - "noResultsInTwoLanguages": "Sorry, we could not find any matching results in {{contentLanguage}} or {{fallbackLanguage}}." + "noResultsInOneLanguage": "Sorry, we could not find any matching results in your language.", + "noResultsInTwoLanguages": "Sorry, we could not find any matching results in your language or in German." }, "es": { "disclaimer": "Contacto y aviso legal", diff --git a/web/src/components/SearchFeedback.tsx b/web/src/components/SearchFeedback.tsx index c202cd9b95..ea43eb946e 100644 --- a/web/src/components/SearchFeedback.tsx +++ b/web/src/components/SearchFeedback.tsx @@ -59,20 +59,12 @@ const SearchFeedback = ({ cityCode, languageCode, query, noResults }: SearchFeed } if (noResults) { - const getLanguageTranslationFromCode = (code: string): string => - new Intl.DisplayNames(languageCode, { type: 'language' }).of(code) ?? code - const fallbackLanguage = config.sourceLanguage return ( - {languageCode === fallbackLanguage - ? t('noResultsInOneLanguage', { contentLanguage: getLanguageTranslationFromCode(languageCode) }) - : t('noResultsInTwoLanguages', { - contentLanguage: getLanguageTranslationFromCode(languageCode), - fallbackLanguage: getLanguageTranslationFromCode(fallbackLanguage), - })} + {languageCode === fallbackLanguage ? t('noResultsInOneLanguage') : t('noResultsInTwoLanguages')} {t('checkQuery', { appName: buildConfig().appName })} {t('informationMissing')} From ed4236cfff9692601e29d862816eace9f9405203 Mon Sep 17 00:00:00 2001 From: LeandraH Date: Tue, 4 Feb 2025 12:36:25 +0100 Subject: [PATCH 04/10] 2926: Fix merge conflict --- web/src/components/SearchFeedback.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/web/src/components/SearchFeedback.tsx b/web/src/components/SearchFeedback.tsx index 1dbcf533d4..525407f864 100644 --- a/web/src/components/SearchFeedback.tsx +++ b/web/src/components/SearchFeedback.tsx @@ -52,7 +52,6 @@ const SearchFeedback = ({ cityCode, languageCode, query, noResults }: SearchFeed language={languageCode} routeType={SEARCH_ROUTE} query={query} - noResults={noResults} initialRating={null} /> From 70933bb03709ea7f1c5ef256c6f4f6c5d1d75b65 Mon Sep 17 00:00:00 2001 From: LeandraH Date: Tue, 4 Feb 2025 12:55:16 +0100 Subject: [PATCH 05/10] 2926: Fix test --- web/src/routes/__tests__/SearchPage.spec.tsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/web/src/routes/__tests__/SearchPage.spec.tsx b/web/src/routes/__tests__/SearchPage.spec.tsx index 977fa74907..44952d2c25 100644 --- a/web/src/routes/__tests__/SearchPage.spec.tsx +++ b/web/src/routes/__tests__/SearchPage.spec.tsx @@ -61,7 +61,7 @@ describe('SearchPage', () => { renderRoute(searchPage, { routePattern, pathname, searchParams: query }) it('should not display results if no query entered', () => { - const { queryByText, getByPlaceholderText, getByText } = renderSearch() + const { queryByText, getByPlaceholderText, getAllByText } = renderSearch() expect(queryByText(category1.title)).toBeNull() expect(queryByText(event0.title)).toBeNull() @@ -73,9 +73,9 @@ describe('SearchPage', () => { }, }) - expect(getByText(category1.title)).toBeTruthy() - expect(getByText(event0.title)).toBeTruthy() - expect(getByText(poi0.title)).toBeTruthy() + expect(getAllByText(category1.title)).toBeTruthy() + expect(getAllByText(event0.title)).toBeTruthy() + expect(getAllByText(poi0.title)).toBeTruthy() }) it('should display nothing found for search', () => { From b807330729ad5ce1cb70998097b83ae9487127d8 Mon Sep 17 00:00:00 2001 From: LeandraH Date: Tue, 4 Feb 2025 13:59:34 +0100 Subject: [PATCH 06/10] 2926: Redesign search feedback in native --- native/src/components/Feedback.tsx | 9 +--- native/src/components/FeedbackContainer.tsx | 55 ++++++++++++++++----- 2 files changed, 44 insertions(+), 20 deletions(-) diff --git a/native/src/components/Feedback.tsx b/native/src/components/Feedback.tsx index 823e290050..af3160e4ab 100644 --- a/native/src/components/Feedback.tsx +++ b/native/src/components/Feedback.tsx @@ -9,15 +9,12 @@ import useNavigate from '../hooks/useNavigate' import Caption from './Caption' import FeedbackButtons from './FeedbackButtons' import { SendingStatusType } from './FeedbackContainer' -import HorizontalLine from './HorizontalLine' import LoadingSpinner from './LoadingSpinner' import Note from './Note' -import NothingFound from './NothingFound' import InputSection from './base/InputSection' import TextButton from './base/TextButton' const Wrapper = styled.View` - padding: 20px; gap: 8px; ` @@ -79,11 +76,7 @@ const Feedback = ({ {isSearchFeedback ? ( - <> - - - - + ) : ( <> diff --git a/native/src/components/FeedbackContainer.tsx b/native/src/components/FeedbackContainer.tsx index bc39a50791..18710ec2fa 100644 --- a/native/src/components/FeedbackContainer.tsx +++ b/native/src/components/FeedbackContainer.tsx @@ -1,17 +1,33 @@ import React, { ReactElement, useEffect, useState } from 'react' +import { useTranslation } from 'react-i18next' import styled from 'styled-components/native' import { SEND_FEEDBACK_SIGNAL_NAME } from 'shared' import { createFeedbackEndpoint, FeedbackRouteType } from 'shared/api' +import { config } from 'translations' +import buildConfig from '../constants/buildConfig' import { determineApiUrl } from '../utils/helpers' import sendTrackingSignal from '../utils/sendTrackingSignal' import { reportError } from '../utils/sentry' import Feedback from './Feedback' +import Text from './base/Text' +import TextButton from './base/TextButton' const Container = styled.View` flex: 1; background-color: ${props => props.theme.colors.backgroundColor}; + padding: 8px 20px; + gap: 8px; +` + +const BoldText = styled(Text)` + font-weight: 600; +` + +const TextBeforeButton = styled(BoldText)` + margin-top: 8px; + text-align: center; ` export type SendingStatusType = 'idle' | 'sending' | 'failed' | 'successful' @@ -30,6 +46,8 @@ const FeedbackContainer = ({ query, language, routeType, cityCode, slug }: Feedb const [isPositiveRating, setIsPositiveRating] = useState(null) const [sendingStatus, setSendingStatus] = useState('idle') const [searchTerm, setSearchTerm] = useState(query) + const [showFeedback, setShowFeedback] = useState(query === undefined) + const { t } = useTranslation('feedback') useEffect(() => { setSearchTerm(query) @@ -70,20 +88,33 @@ const FeedbackContainer = ({ query, language, routeType, cityCode, slug }: Feedb }) } + const fallbackLanguage = config.sourceLanguage + return ( - + {showFeedback ? ( + + ) : ( + <> + + {language === fallbackLanguage ? t('noResultsInOneLanguage') : t('noResultsInTwoLanguages')} + + {t('checkQuery', { appName: buildConfig().appName })} + {t('informationMissing')} + setShowFeedback(true)} /> + + )} ) } From cea73169fca95cf3fd1a2f7a2dec542d697e4d7e Mon Sep 17 00:00:00 2001 From: LeandraH Date: Tue, 4 Feb 2025 13:59:44 +0100 Subject: [PATCH 07/10] 2926: Fix test --- native/src/components/__tests__/Feedback.spec.tsx | 1 - .../src/components/__tests__/FeedbackContainer.spec.tsx | 8 +++++++- native/src/routes/__tests__/SearchModal.spec.tsx | 2 +- 3 files changed, 8 insertions(+), 3 deletions(-) diff --git a/native/src/components/__tests__/Feedback.spec.tsx b/native/src/components/__tests__/Feedback.spec.tsx index 7955207f10..71e3190c10 100644 --- a/native/src/components/__tests__/Feedback.spec.tsx +++ b/native/src/components/__tests__/Feedback.spec.tsx @@ -82,7 +82,6 @@ describe('Feedback', () => { , ) - expect(getByText('search:nothingFound')).toBeDefined() expect(getByText('searchTermDescription')).toBeDefined() }) diff --git a/native/src/components/__tests__/FeedbackContainer.spec.tsx b/native/src/components/__tests__/FeedbackContainer.spec.tsx index 4e630c7e92..331b2fbed5 100644 --- a/native/src/components/__tests__/FeedbackContainer.spec.tsx +++ b/native/src/components/__tests__/FeedbackContainer.spec.tsx @@ -123,6 +123,8 @@ describe('FeedbackContainer', () => { , ) + const buttonToOpenFeedback = getByText('giveFeedback') + fireEvent.press(buttonToOpenFeedback) const button = getByText('send') fireEvent.press(button) expect(await findByText('thanksMessage')).toBeDefined() @@ -148,6 +150,8 @@ describe('FeedbackContainer', () => { , ) + const buttonToOpenFeedback = getByText('giveFeedback') + fireEvent.press(buttonToOpenFeedback) const input = getByDisplayValue(query) fireEvent.changeText(input, fullSearchTerm) const button = getByText('send') @@ -168,11 +172,13 @@ describe('FeedbackContainer', () => { }) it('should disable send button if query term is removed', async () => { - const { findByText, getByDisplayValue } = render( + const { findByText, getByDisplayValue, getByText } = render( , ) + const buttonToOpenFeedback = getByText('giveFeedback') + fireEvent.press(buttonToOpenFeedback) expect(await findByText('send')).not.toBeDisabled() const input = getByDisplayValue('query') fireEvent.changeText(input, '') diff --git a/native/src/routes/__tests__/SearchModal.spec.tsx b/native/src/routes/__tests__/SearchModal.spec.tsx index c48a319772..51bf6a5545 100644 --- a/native/src/routes/__tests__/SearchModal.spec.tsx +++ b/native/src/routes/__tests__/SearchModal.spec.tsx @@ -125,7 +125,7 @@ describe('SearchModal', () => { fireEvent.changeText(getByPlaceholderText('searchPlaceholder'), 'no results, please') - expect(getByText('search:nothingFound')).toBeTruthy() + expect(getByText('noResultsInOneLanguage')).toBeTruthy() }) it('should open with an initial search text if one is supplied', () => { From bfc481ca9a3682b5012b7ee3fee122903f05aef9 Mon Sep 17 00:00:00 2001 From: LeandraH Date: Mon, 10 Feb 2025 18:07:06 +0100 Subject: [PATCH 08/10] 2926: Refactoring --- translations/translations.json | 10 +++++----- web/src/components/SearchFeedback.tsx | 18 +++++++++--------- web/src/routes/__tests__/SearchPage.spec.tsx | 2 +- 3 files changed, 15 insertions(+), 15 deletions(-) diff --git a/translations/translations.json b/translations/translations.json index 95a6ed7194..482c7db0d2 100644 --- a/translations/translations.json +++ b/translations/translations.json @@ -4767,8 +4767,8 @@ "giveFeedback": "Feedback geben", "checkQuery": "Überprüfen Sie Ihren Suchbegriff oder ändern Sie die eingestellte Sprache der {{appName}}-App.", "informationMissing": "Hier fehlen Informationen?", - "noResultsInOneLanguage": "Es wurden leider keine passenden Ergebnisse in Deiner Sprache gefunden.", - "noResultsInTwoLanguages": "Es wurden leider keine passenden Ergebnisse in Deiner Sprache oder auf Deutsch gefunden." + "noResultsInUserLanguage": "Es wurden leider keine passenden Ergebnisse in Deiner Sprache gefunden.", + "noResultsInUserAndSourceLanguage": "Es wurden leider keine passenden Ergebnisse in Deiner Sprache oder auf Deutsch gefunden." }, "am": { "disclaimer": "የግንኙነት መረጃና ዕትም", @@ -4954,10 +4954,10 @@ "contactMailAddress": "E-Mail for further questions", "note": "Please select a reaction or write a comment in order to send feedback.", "giveFeedback": "Give feedback", - "checkQuery": "Check your search term or select a different language in the {{appName}} app", + "checkQuery": "Check your search term or select a different language in the {{appName}} app.", "informationMissing": "Is information missing?", - "noResultsInOneLanguage": "Sorry, we could not find any matching results in your language.", - "noResultsInTwoLanguages": "Sorry, we could not find any matching results in your language or in German." + "noResultsInUserLanguage": "Sorry, we could not find any matching results in your language.", + "noResultsInUserAndSourceLanguage": "Sorry, we could not find any matching results in your language or in German." }, "es": { "disclaimer": "Contacto y aviso legal", diff --git a/web/src/components/SearchFeedback.tsx b/web/src/components/SearchFeedback.tsx index 525407f864..1f65e9af36 100644 --- a/web/src/components/SearchFeedback.tsx +++ b/web/src/components/SearchFeedback.tsx @@ -19,16 +19,16 @@ const CenteredContainer = styled.div` text-align: center; ` -const SemiBoldText = styled.p` +const SmallTitle = styled.p` font-weight: 600; ` -const MiddleText = styled.p` - padding-bottom: 1rem; +const Hint = styled.p` + padding-bottom: 16px; ` const StyledButton = styled(TextButton)` - margin-top: 0.5rem; + margin-top: 8px; ` type SearchFeedbackProps = { @@ -63,11 +63,11 @@ const SearchFeedback = ({ cityCode, languageCode, query, noResults }: SearchFeed return ( - - {languageCode === fallbackLanguage ? t('noResultsInOneLanguage') : t('noResultsInTwoLanguages')} - - {t('checkQuery', { appName: buildConfig().appName })} - {t('informationMissing')} + + {languageCode === fallbackLanguage ? t('noResultsInUserLanguage') : t('noResultsInUserAndSourceLanguage')} + + {t('checkQuery', { appName: buildConfig().appName })} + {t('informationMissing')} setShowFeedback(true)} /> ) diff --git a/web/src/routes/__tests__/SearchPage.spec.tsx b/web/src/routes/__tests__/SearchPage.spec.tsx index 44952d2c25..d0d436bc4c 100644 --- a/web/src/routes/__tests__/SearchPage.spec.tsx +++ b/web/src/routes/__tests__/SearchPage.spec.tsx @@ -87,7 +87,7 @@ describe('SearchPage', () => { }, }) - expect(getByText('feedback:noResultsInTwoLanguages')).toBeTruthy() + expect(getByText('feedback:noResultsInUserAndSourceLanguage')).toBeTruthy() }) describe('url query', () => { From 738b8577b330b1348227762bee1b08a8e38f2b44 Mon Sep 17 00:00:00 2001 From: LeandraH Date: Mon, 10 Feb 2025 18:07:06 +0100 Subject: [PATCH 09/10] 2926: Refactoring --- translations/translations.json | 10 +++++----- web/src/components/SearchFeedback.tsx | 18 +++++++++--------- web/src/routes/__tests__/SearchPage.spec.tsx | 2 +- 3 files changed, 15 insertions(+), 15 deletions(-) diff --git a/translations/translations.json b/translations/translations.json index 95a6ed7194..482c7db0d2 100644 --- a/translations/translations.json +++ b/translations/translations.json @@ -4767,8 +4767,8 @@ "giveFeedback": "Feedback geben", "checkQuery": "Überprüfen Sie Ihren Suchbegriff oder ändern Sie die eingestellte Sprache der {{appName}}-App.", "informationMissing": "Hier fehlen Informationen?", - "noResultsInOneLanguage": "Es wurden leider keine passenden Ergebnisse in Deiner Sprache gefunden.", - "noResultsInTwoLanguages": "Es wurden leider keine passenden Ergebnisse in Deiner Sprache oder auf Deutsch gefunden." + "noResultsInUserLanguage": "Es wurden leider keine passenden Ergebnisse in Deiner Sprache gefunden.", + "noResultsInUserAndSourceLanguage": "Es wurden leider keine passenden Ergebnisse in Deiner Sprache oder auf Deutsch gefunden." }, "am": { "disclaimer": "የግንኙነት መረጃና ዕትም", @@ -4954,10 +4954,10 @@ "contactMailAddress": "E-Mail for further questions", "note": "Please select a reaction or write a comment in order to send feedback.", "giveFeedback": "Give feedback", - "checkQuery": "Check your search term or select a different language in the {{appName}} app", + "checkQuery": "Check your search term or select a different language in the {{appName}} app.", "informationMissing": "Is information missing?", - "noResultsInOneLanguage": "Sorry, we could not find any matching results in your language.", - "noResultsInTwoLanguages": "Sorry, we could not find any matching results in your language or in German." + "noResultsInUserLanguage": "Sorry, we could not find any matching results in your language.", + "noResultsInUserAndSourceLanguage": "Sorry, we could not find any matching results in your language or in German." }, "es": { "disclaimer": "Contacto y aviso legal", diff --git a/web/src/components/SearchFeedback.tsx b/web/src/components/SearchFeedback.tsx index 525407f864..1f65e9af36 100644 --- a/web/src/components/SearchFeedback.tsx +++ b/web/src/components/SearchFeedback.tsx @@ -19,16 +19,16 @@ const CenteredContainer = styled.div` text-align: center; ` -const SemiBoldText = styled.p` +const SmallTitle = styled.p` font-weight: 600; ` -const MiddleText = styled.p` - padding-bottom: 1rem; +const Hint = styled.p` + padding-bottom: 16px; ` const StyledButton = styled(TextButton)` - margin-top: 0.5rem; + margin-top: 8px; ` type SearchFeedbackProps = { @@ -63,11 +63,11 @@ const SearchFeedback = ({ cityCode, languageCode, query, noResults }: SearchFeed return ( - - {languageCode === fallbackLanguage ? t('noResultsInOneLanguage') : t('noResultsInTwoLanguages')} - - {t('checkQuery', { appName: buildConfig().appName })} - {t('informationMissing')} + + {languageCode === fallbackLanguage ? t('noResultsInUserLanguage') : t('noResultsInUserAndSourceLanguage')} + + {t('checkQuery', { appName: buildConfig().appName })} + {t('informationMissing')} setShowFeedback(true)} /> ) diff --git a/web/src/routes/__tests__/SearchPage.spec.tsx b/web/src/routes/__tests__/SearchPage.spec.tsx index 44952d2c25..d0d436bc4c 100644 --- a/web/src/routes/__tests__/SearchPage.spec.tsx +++ b/web/src/routes/__tests__/SearchPage.spec.tsx @@ -87,7 +87,7 @@ describe('SearchPage', () => { }, }) - expect(getByText('feedback:noResultsInTwoLanguages')).toBeTruthy() + expect(getByText('feedback:noResultsInUserAndSourceLanguage')).toBeTruthy() }) describe('url query', () => { From 5c870f4bb829e78b47fa3a2221b9f8fa8d40e52d Mon Sep 17 00:00:00 2001 From: LeandraH Date: Mon, 10 Feb 2025 19:02:50 +0100 Subject: [PATCH 10/10] 2926: Refactoring --- native/src/components/FeedbackContainer.tsx | 38 ++++++++++--------- .../src/routes/__tests__/SearchModal.spec.tsx | 2 +- 2 files changed, 22 insertions(+), 18 deletions(-) diff --git a/native/src/components/FeedbackContainer.tsx b/native/src/components/FeedbackContainer.tsx index 18710ec2fa..af4c7afc2f 100644 --- a/native/src/components/FeedbackContainer.tsx +++ b/native/src/components/FeedbackContainer.tsx @@ -21,11 +21,11 @@ const Container = styled.View` gap: 8px; ` -const BoldText = styled(Text)` +const Title = styled(Text)` font-weight: 600; ` -const TextBeforeButton = styled(BoldText)` +const Hint = styled(Title)` margin-top: 8px; text-align: center; ` @@ -88,11 +88,9 @@ const FeedbackContainer = ({ query, language, routeType, cityCode, slug }: Feedb }) } - const fallbackLanguage = config.sourceLanguage - - return ( - - {showFeedback ? ( + if (showFeedback) { + return ( + - ) : ( - <> - - {language === fallbackLanguage ? t('noResultsInOneLanguage') : t('noResultsInTwoLanguages')} - - {t('checkQuery', { appName: buildConfig().appName })} - {t('informationMissing')} - setShowFeedback(true)} /> - - )} + + ) + } + + const fallbackLanguage = config.sourceLanguage + + return ( + + <> + + {language === fallbackLanguage ? t('noResultsInUserLanguage') : t('noResultsInUserAndSourceLanguage')} + + {t('checkQuery', { appName: buildConfig().appName })} + {t('informationMissing')} + setShowFeedback(true)} /> + ) } diff --git a/native/src/routes/__tests__/SearchModal.spec.tsx b/native/src/routes/__tests__/SearchModal.spec.tsx index 51bf6a5545..98f552c8af 100644 --- a/native/src/routes/__tests__/SearchModal.spec.tsx +++ b/native/src/routes/__tests__/SearchModal.spec.tsx @@ -125,7 +125,7 @@ describe('SearchModal', () => { fireEvent.changeText(getByPlaceholderText('searchPlaceholder'), 'no results, please') - expect(getByText('noResultsInOneLanguage')).toBeTruthy() + expect(getByText('noResultsInUserLanguage')).toBeTruthy() }) it('should open with an initial search text if one is supplied', () => {