From cd29f53e5b149d24797be867c845c83151a78ffe Mon Sep 17 00:00:00 2001 From: Pyry Koivisto Date: Sat, 21 Oct 2023 12:35:16 +0300 Subject: [PATCH] AKR(Frontend): Migrate to updated LanguageSelect [deploy] --- frontend/packages/akr/package.json | 2 +- .../authorisation/AuthorisationFields.tsx | 9 ++++---- .../ClerkTranslatorAutocompleteFilters.tsx | 12 ++++++++-- .../filters/PublicTranslatorFilters.tsx | 23 ++++++++++++++++--- .../akr/src/interfaces/publicTranslator.ts | 4 ++-- frontend/yarn.lock | 2 +- 6 files changed, 38 insertions(+), 14 deletions(-) diff --git a/frontend/packages/akr/package.json b/frontend/packages/akr/package.json index f8bd791d8f..e5b3a7b43e 100644 --- a/frontend/packages/akr/package.json +++ b/frontend/packages/akr/package.json @@ -22,6 +22,6 @@ "akr:tslint": "yarn g:tsc --pretty --noEmit" }, "dependencies": { - "shared": "npm:@opetushallitus/kieli-ja-kaantajatutkinnot.shared@1.9.28" + "shared": "npm:@opetushallitus/kieli-ja-kaantajatutkinnot.shared@1.10.0" } } diff --git a/frontend/packages/akr/src/components/clerkTranslator/authorisation/AuthorisationFields.tsx b/frontend/packages/akr/src/components/clerkTranslator/authorisation/AuthorisationFields.tsx index 9157b127cc..1924ae37ea 100644 --- a/frontend/packages/akr/src/components/clerkTranslator/authorisation/AuthorisationFields.tsx +++ b/frontend/packages/akr/src/components/clerkTranslator/authorisation/AuthorisationFields.tsx @@ -80,13 +80,12 @@ export const AuthorisationFields = ({ }, [setAuthorisation]); const handleLanguageSelectChange = - (fieldName: string) => - ({}, value: AutocompleteValue) => { + (fieldName: string) => (language?: string) => { setAuthorisation({ ...authorisation, languagePair: { ...authorisation.languagePair, - [fieldName]: value?.value, + [fieldName]: language, }, }); setIsAuthorisationDataChanged(true); @@ -207,7 +206,7 @@ export const AuthorisationFields = ({ label={t('fieldPlaceholders.from')} variant={TextFieldVariant.Outlined} value={getLanguageSelectValue(authorisation.languagePair.from)} - onChange={handleLanguageSelectChange('from')} + onLanguageChange={handleLanguageSelectChange('from')} languages={AuthorisationUtils.selectableLanguagesForLanguageFilter( AuthorisationUtils.getKoodistoLangKeys(), authorisation.languagePair.to @@ -226,7 +225,7 @@ export const AuthorisationFields = ({ label={t('fieldPlaceholders.to')} variant={TextFieldVariant.Outlined} value={getLanguageSelectValue(authorisation.languagePair.to)} - onChange={handleLanguageSelectChange('to')} + onLanguageChange={handleLanguageSelectChange('to')} languages={AuthorisationUtils.selectableLanguagesForLanguageFilter( AuthorisationUtils.getKoodistoLangKeys(), authorisation.languagePair.from diff --git a/frontend/packages/akr/src/components/clerkTranslator/filters/ClerkTranslatorAutocompleteFilters.tsx b/frontend/packages/akr/src/components/clerkTranslator/filters/ClerkTranslatorAutocompleteFilters.tsx index 9eaf047e63..30820a2755 100644 --- a/frontend/packages/akr/src/components/clerkTranslator/filters/ClerkTranslatorAutocompleteFilters.tsx +++ b/frontend/packages/akr/src/components/clerkTranslator/filters/ClerkTranslatorAutocompleteFilters.tsx @@ -67,6 +67,14 @@ export const ClerkTranslatorAutocompleteFilters = () => { dispatch(addClerkTranslatorFilter({ [filter]: value?.value })); dispatch(setPage(0)); }; + const handleFromLanguageChange = (language?: string) => { + dispatch(addClerkTranslatorFilter({ fromLang: language })); + dispatch(setPage(0)); + }; + const handleToLanguageChange = (language?: string) => { + dispatch(addClerkTranslatorFilter({ toLang: language })); + dispatch(setPage(0)); + }; const getPermissionToPublishSelectValues = () => Object.values(PermissionToPublish).map((v) => ({ @@ -93,7 +101,7 @@ export const ClerkTranslatorAutocompleteFilters = () => { label={t('languagePair.fromPlaceholder')} value={getLanguageSelectValue(filters.fromLang)} variant={TextFieldVariant.Outlined} - onChange={handleFilterChange('fromLang')} + onLanguageChange={handleFromLanguageChange} languages={AuthorisationUtils.selectableLanguagesForLanguageFilter( langs.from, filters.toLang @@ -108,7 +116,7 @@ export const ClerkTranslatorAutocompleteFilters = () => { label={t('languagePair.toPlaceholder')} value={getLanguageSelectValue(filters.toLang)} variant={TextFieldVariant.Outlined} - onChange={handleFilterChange('toLang')} + onLanguageChange={handleToLanguageChange} languages={AuthorisationUtils.selectableLanguagesForLanguageFilter( langs.to, filters.fromLang diff --git a/frontend/packages/akr/src/components/publicTranslator/filters/PublicTranslatorFilters.tsx b/frontend/packages/akr/src/components/publicTranslator/filters/PublicTranslatorFilters.tsx index 2d8284bb24..37dd4c0c30 100644 --- a/frontend/packages/akr/src/components/publicTranslator/filters/PublicTranslatorFilters.tsx +++ b/frontend/packages/akr/src/components/publicTranslator/filters/PublicTranslatorFilters.tsx @@ -80,8 +80,8 @@ export const PublicTranslatorFilters = ({ const [filters, setFilters] = useState(defaultFiltersState); const [searchButtonDisabled, setSearchButtonDisabled] = useState(false); const defaultValuesState: PublicTranslatorFilterValues = { - fromLang: null, - toLang: null, + fromLang: '', + toLang: '', name: '', town: null, }; @@ -187,6 +187,21 @@ export const PublicTranslatorFilters = ({ setSearchButtonDisabled(false); }; + const onLanguageChange = + (languageField: SearchFilter.FromLang | SearchFilter.ToLang) => + (language?: string) => { + setFilters((prevState) => ({ + ...prevState, + [languageField]: language || '', + })); + setValues((prevState) => ({ + ...prevState, + [languageField]: language || '', + })); + dispatch(removePublicTranslatorFilterError(languageField)); + setSearchButtonDisabled(false); + }; + const handleTextFieldFilterChange = (filterName: SearchFilter) => (event: React.ChangeEvent) => { @@ -207,7 +222,6 @@ export const PublicTranslatorFilters = ({ value: values[fieldName] as AutocompleteValue, autoHighlight: true, variant: TextFieldVariant.Outlined, - onChange: handleComboboxFilterChange(fieldName), }); const handleKeyUp = (event: KeyboardEvent) => { @@ -290,6 +304,7 @@ export const PublicTranslatorFilters = ({ primaryLanguages={AuthorisationUtils.primaryLangs} excludedLanguage={filters.toLang} translateLanguage={translateLanguage} + onLanguageChange={onLanguageChange(SearchFilter.FromLang)} /> @@ -333,6 +349,7 @@ export const PublicTranslatorFilters = ({ id="filters-town" values={towns.map(townAsComboboxOption)} onKeyUp={handleKeyUp} + onChange={handleComboboxFilterChange(SearchFilter.Town)} /> diff --git a/frontend/packages/akr/src/interfaces/publicTranslator.ts b/frontend/packages/akr/src/interfaces/publicTranslator.ts index b53dd56fb9..268a49f4a1 100644 --- a/frontend/packages/akr/src/interfaces/publicTranslator.ts +++ b/frontend/packages/akr/src/interfaces/publicTranslator.ts @@ -21,8 +21,8 @@ export interface PublicTranslatorFilter { } export interface PublicTranslatorFilterValues { - fromLang: AutocompleteValue; - toLang: AutocompleteValue; + fromLang: string; + toLang: string; name: string; town: AutocompleteValue; } diff --git a/frontend/yarn.lock b/frontend/yarn.lock index 6effa861e7..44d4519266 100644 --- a/frontend/yarn.lock +++ b/frontend/yarn.lock @@ -2890,7 +2890,7 @@ __metadata: version: 0.0.0-use.local resolution: "@opetushallitus/kieli-ja-kaantajatutkinnot.akr@workspace:packages/akr" dependencies: - shared: "npm:@opetushallitus/kieli-ja-kaantajatutkinnot.shared@1.9.28" + shared: "npm:@opetushallitus/kieli-ja-kaantajatutkinnot.shared@1.10.0" languageName: unknown linkType: soft