fix(types): remove "as unknown as" type unsafe casts

fix most of the underlying type problems (apolloClient's type is still handled without type safety, add FIXME for that): - related to react-helsinki-headless-cms Config type - add missing fields to returned field named `copy` - handle `currentLanguageCode` field type safely - fix incorrect parameter and return type of `utils.getEventCardProps` - fix incorrect parameter type of `utils.getRoutedInternalHref` also: - fix sonarcloud issue typescript:S6606 "Nullish coalescing should be preferred" by using `??` instead of `||` refs HH-189
City-of-Helsinki · Jan 9, 2024 · 3761bca · 3761bca
1 parent a337aa7
commit 3761bca
Show file tree

Hide file tree

Showing 19 changed files with 233 additions and 92 deletions.
diff --git a/apps/events-helsinki/config/jest/TestProviders.tsx b/apps/events-helsinki/config/jest/TestProviders.tsx
@@ -1,11 +1,17 @@
-import type { ApolloCache, ApolloClient, InMemoryCache } from '@apollo/client';
+import type {
+  ApolloCache,
+  ApolloClient,
+  InMemoryCache,
+  NormalizedCacheObject,
+} from '@apollo/client';
 import { useApolloClient } from '@apollo/client';
 import type { MockedResponse } from '@apollo/client/testing';
 import { MockedProvider } from '@apollo/client/testing';
 import {
   AppRoutingProvider,
   CmsHelperProvider,
   DEFAULT_LANGUAGE,
+  getLanguageCode,
   NavigationContext,
 } from '@events-helsinki/components';
 import { RouterContext } from 'next/dist/shared/lib/router-context';
@@ -81,7 +87,10 @@ function RHHCConfigProviderWithMockedApolloClient({ children, router }: Props) {
   );
 }
 
-function getRHHCConfig(router: NextRouter, apolloClient: ApolloClient<object>) {
+function getRHHCConfig(
+  router: NextRouter,
+  apolloClient: ApolloClient<object>
+): RHHCConfig {
   const locale = DEFAULT_LANGUAGE;
 
   const getIsHrefExternal = (href: string) => {
@@ -127,11 +136,15 @@ function getRHHCConfig(router: NextRouter, apolloClient: ApolloClient<object>) {
     return routerHelper.getLocalizedCmsItemUrl(link, {}, locale);
   };
 
+  // FIXME: Fix types of apolloClient/RHHCConfig so they are compatible without casting
+  const normalizedCacheObjectApolloClient =
+    apolloClient as ApolloClient<NormalizedCacheObject>;
+
   return {
     ...rhhcDefaultConfig,
     siteName: 'appName',
-    currentLanguageCode: locale.toUpperCase(),
-    apolloClient,
+    currentLanguageCode: getLanguageCode(locale),
+    apolloClient: normalizedCacheObjectApolloClient,
     components: {
       ...rhhcDefaultConfig.components,
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -151,7 +164,12 @@ function getRHHCConfig(router: NextRouter, apolloClient: ApolloClient<object>) {
       ),
       openInNewTabAriaLabel: i18n.t('common:srOnly.opensInANewTab'),
       closeButtonLabelText: i18n.t('common:button.close'),
+      loadMoreButtonLabelText: i18n.t('common:button.loadMore'),
+      showAllText: i18n.t('common:button.showAll'),
+      next: i18n.t('common:next'),
+      previous: i18n.t('common:previous'),
       archiveSearch: {
+        title: i18n.t('cms:archiveSearch.title'),
         searchTextPlaceholder: i18n.t(
           'cms:archiveSearch.searchTextPlaceholder'
         ),
@@ -161,7 +179,9 @@ function getRHHCConfig(router: NextRouter, apolloClient: ApolloClient<object>) {
         loadMoreButtonLabelText: i18n.t(
           'cms:archiveSearch.loadMoreButtonLabelText'
         ),
+        noResultsTitle: i18n.t('cms:archiveSearch.noResultsTitle'),
         noResultsText: i18n.t('cms:archiveSearch.noResultsText'),
+        clearAll: i18n.t('cms:archiveSearch.buttonClearFilters'),
       },
     },
     utils: {
@@ -171,7 +191,7 @@ function getRHHCConfig(router: NextRouter, apolloClient: ApolloClient<object>) {
       getRoutedInternalHref,
     },
     internalHrefOrigins,
-  } as unknown as RHHCConfig;
+  };
 }
 
 export default TestProviders;
diff --git a/apps/events-helsinki/src/hooks/useEventsRHHCConfig.tsx b/apps/events-helsinki/src/hooks/useEventsRHHCConfig.tsx
@@ -1,7 +1,7 @@
-/* eslint-disable @typescript-eslint/naming-convention */
 import type { ApolloClient, NormalizedCacheObject } from '@apollo/client';
 import type { EventFieldsFragment } from '@events-helsinki/components';
 import {
+  getLanguageCode,
   getLinkArrowLabel,
   useLocale,
   useCommonTranslation,
@@ -15,7 +15,7 @@ import {
 import Head from 'next/head';
 import Link from 'next/link';
 import React from 'react';
-import type { Config } from 'react-helsinki-headless-cms';
+import type { CardProps, Config } from 'react-helsinki-headless-cms';
 import {
   defaultConfig as rhhcDefaultConfig,
   ModuleItemTypeEnum,
@@ -39,7 +39,7 @@ const LINKEDEVENTS_API_EVENT_ENDPOINT = new URL(
 
 export default function useEventsRHHCConfig(args: {
   apolloClient: ApolloClient<NormalizedCacheObject>;
-}) {
+}): Config {
   const { apolloClient } = args;
   const { t: commonTranslation } = useCommonTranslation();
   const { t: appTranslation } = useAppEventsTranslation();
@@ -87,20 +87,24 @@ export default function useEventsRHHCConfig(args: {
         ),
       },
       siteName: appTranslation('appEvents:appName'),
-      currentLanguageCode: locale.toUpperCase(),
+      currentLanguageCode: getLanguageCode(locale),
       apolloClient,
       eventsApolloClient: apolloClient,
       venuesApolloClient: apolloClient,
       utils: {
         ...rhhcDefaultConfig.utils,
         getEventCardProps: AppConfig.showEnrolmentStatusInCardDetails
-          ? (item: EventFieldsFragment, locale: string) => ({
+          ? (
+              item: EventFieldsFragment,
+              organisationPrefixes: string[],
+              locale: string
+            ): CardProps => ({
               ...rhhcDefaultConfig.utils.getEventCardProps(
                 item,
-                CITY_OF_HELSINKI_LINKED_EVENTS_ORGANIZATION_PREFIXES,
+                organisationPrefixes,
                 locale
               ),
-              getLinkArrowLabel: getLinkArrowLabel({
+              linkArrowLabel: getLinkArrowLabel({
                 item,
                 locale,
                 eventTranslation,
@@ -109,25 +113,25 @@ export default function useEventsRHHCConfig(args: {
             })
           : rhhcDefaultConfig.utils.getEventCardProps,
         getRoutedInternalHref: (
-          link: string,
-          _type: ModuleItemTypeEnum
+          link?: string | null,
+          type?: ModuleItemTypeEnum
         ): string => {
-          if (_type === ModuleItemTypeEnum.Venue) {
+          if (type === ModuleItemTypeEnum.Venue) {
             // quick fix for venue url rewrites
             return routerHelper.getLocalizedCmsItemUrl(
               ROUTES.VENUES,
               {
-                venueId: getVenueSourceId(link),
+                venueId: getVenueSourceId(link ?? ''),
               },
               locale
             );
           }
-          return link || '#';
+          return link ?? '#';
         },
         getIsHrefExternal,
       },
       internalHrefOrigins,
-    } as unknown as Config;
+    };
   }, [
     commonConfig,
     appTranslation,

diff --git a/apps/events-helsinki/src/pages/articles/[...slug].tsx b/apps/events-helsinki/src/pages/articles/[...slug].tsx
@@ -9,6 +9,7 @@ import {
   getLanguageOrDefault,
   useAppEventsTranslation,
   RouteMeta,
+  getLanguageCodeFilter,
 } from '@events-helsinki/components';
 import type { AppLanguage } from '@events-helsinki/components';
 import { logger } from '@events-helsinki/components/loggers/logger';
@@ -23,7 +24,6 @@ import type {
   Breadcrumb,
   CollectionType,
   ArticleType,
-  LanguageCodeFilterEnum,
 } from 'react-helsinki-headless-cms';
 import {
   getCollections,
@@ -68,7 +68,7 @@ const NextCmsArticle: NextPage<{
     useCategoriesQuery({
       variables: {
         first: CATEGORIES_AMOUNT,
-        language: currentLanguageCode as unknown as LanguageCodeFilterEnum,
+        language: getLanguageCodeFilter(currentLanguageCode),
       },
     });
 

diff --git a/apps/events-helsinki/src/pages/articles/index.tsx b/apps/events-helsinki/src/pages/articles/index.tsx
@@ -10,6 +10,7 @@ import {
   FooterSection,
   getLanguageOrDefault,
   RouteMeta,
+  getLanguageCodeFilter,
 } from '@events-helsinki/components';
 import type { GetStaticPropsContext } from 'next';
 import { useRouter } from 'next/router';
@@ -23,11 +24,7 @@ import {
   useConfig,
   TemplateEnum,
 } from 'react-helsinki-headless-cms';
-import type {
-  ArticleType,
-  LanguageCodeFilterEnum,
-  PageType,
-} from 'react-helsinki-headless-cms';
+import type { ArticleType, PageType } from 'react-helsinki-headless-cms';
 import {
   useCategoriesQuery,
   PageByTemplateDocument,
@@ -106,7 +103,7 @@ export default function ArticleArchive({
     variables: {
       first: BLOCK_SIZE,
       search: searchFilters?.text ?? '',
-      language: currentLanguageCode as unknown as LanguageCodeFilterEnum,
+      language: getLanguageCodeFilter(currentLanguageCode),
       categories: searchFilters?.tags ?? [],
     },
   });
@@ -115,7 +112,7 @@ export default function ArticleArchive({
     useCategoriesQuery({
       variables: {
         first: CATEGORIES_AMOUNT,
-        language: currentLanguageCode as unknown as LanguageCodeFilterEnum,
+        language: getLanguageCodeFilter(currentLanguageCode),
       },
     });
 

diff --git a/apps/hobbies-helsinki/config/jest/TestProviders.tsx b/apps/hobbies-helsinki/config/jest/TestProviders.tsx
@@ -1,11 +1,17 @@
-import type { ApolloCache, ApolloClient, InMemoryCache } from '@apollo/client';
+import type {
+  ApolloCache,
+  ApolloClient,
+  InMemoryCache,
+  NormalizedCacheObject,
+} from '@apollo/client';
 import { useApolloClient } from '@apollo/client';
 import type { MockedResponse } from '@apollo/client/testing';
 import { MockedProvider } from '@apollo/client/testing';
 import {
   AppRoutingProvider,
   CmsHelperProvider,
   DEFAULT_LANGUAGE,
+  getLanguageCode,
   NavigationContext,
 } from '@events-helsinki/components';
 import { RouterContext } from 'next/dist/shared/lib/router-context';
@@ -81,7 +87,10 @@ function RHHCConfigProviderWithMockedApolloClient({ children, router }: Props) {
   );
 }
 
-function getRHHCConfig(router: NextRouter, apolloClient: ApolloClient<object>) {
+function getRHHCConfig(
+  router: NextRouter,
+  apolloClient: ApolloClient<object>
+): RHHCConfig {
   const locale = DEFAULT_LANGUAGE;
 
   const getIsHrefExternal = (href: string) => {
@@ -127,11 +136,15 @@ function getRHHCConfig(router: NextRouter, apolloClient: ApolloClient<object>) {
     return routerHelper.getLocalizedCmsItemUrl(link, {}, locale);
   };
 
+  // FIXME: Fix types of apolloClient/RHHCConfig so they are compatible without casting
+  const normalizedCacheObjectApolloClient =
+    apolloClient as ApolloClient<NormalizedCacheObject>;
+
   return {
     ...rhhcDefaultConfig,
     siteName: 'appName',
-    currentLanguageCode: locale.toUpperCase(),
-    apolloClient,
+    currentLanguageCode: getLanguageCode(locale),
+    apolloClient: normalizedCacheObjectApolloClient,
     components: {
       ...rhhcDefaultConfig.components,
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -151,7 +164,12 @@ function getRHHCConfig(router: NextRouter, apolloClient: ApolloClient<object>) {
       ),
       openInNewTabAriaLabel: i18n.t('common:srOnly.opensInANewTab'),
       closeButtonLabelText: i18n.t('common:button.close'),
+      loadMoreButtonLabelText: i18n.t('common:button.loadMore'),
+      showAllText: i18n.t('common:button.showAll'),
+      next: i18n.t('common:next'),
+      previous: i18n.t('common:previous'),
       archiveSearch: {
+        title: i18n.t('cms:archiveSearch.title'),
         searchTextPlaceholder: i18n.t(
           'cms:archiveSearch.searchTextPlaceholder'
         ),
@@ -161,7 +179,9 @@ function getRHHCConfig(router: NextRouter, apolloClient: ApolloClient<object>) {
         loadMoreButtonLabelText: i18n.t(
           'cms:archiveSearch.loadMoreButtonLabelText'
         ),
+        noResultsTitle: i18n.t('cms:archiveSearch.noResultsTitle'),
         noResultsText: i18n.t('cms:archiveSearch.noResultsText'),
+        clearAll: i18n.t('cms:archiveSearch.buttonClearFilters'),
       },
     },
     utils: {
@@ -171,7 +191,7 @@ function getRHHCConfig(router: NextRouter, apolloClient: ApolloClient<object>) {
       getRoutedInternalHref,
     },
     internalHrefOrigins,
-  } as unknown as RHHCConfig;
+  };
 }
 
 export default TestProviders;
diff --git a/apps/hobbies-helsinki/src/hooks/useHobbiesRHHCConfig.tsx b/apps/hobbies-helsinki/src/hooks/useHobbiesRHHCConfig.tsx
@@ -1,7 +1,7 @@
-/* eslint-disable @typescript-eslint/naming-convention */
 import type { ApolloClient, NormalizedCacheObject } from '@apollo/client';
 import type { EventFieldsFragment } from '@events-helsinki/components';
 import {
+  getLanguageCode,
   getLinkArrowLabel,
   useLocale,
   useCommonTranslation,
@@ -15,7 +15,7 @@ import {
 import Head from 'next/head';
 import Link from 'next/link';
 import React from 'react';
-import type { Config } from 'react-helsinki-headless-cms';
+import type { CardProps, Config } from 'react-helsinki-headless-cms';
 import {
   defaultConfig as rhhcDefaultConfig,
   ModuleItemTypeEnum,
@@ -39,7 +39,7 @@ const LINKEDEVENTS_API_EVENT_ENDPOINT = new URL(
 
 export default function useHobbiesRHHCConfig(args: {
   apolloClient: ApolloClient<NormalizedCacheObject>;
-}) {
+}): Config {
   const { apolloClient } = args;
   const { t: commonTranslation } = useCommonTranslation();
   const { t: appTranslation } = useAppHobbiesTranslation();
@@ -88,17 +88,21 @@ export default function useHobbiesRHHCConfig(args: {
         ),
       },
       siteName: appTranslation('appHobbies:appName'),
-      currentLanguageCode: locale.toUpperCase(),
+      currentLanguageCode: getLanguageCode(locale),
       apolloClient,
       eventsApolloClient: apolloClient,
       venuesApolloClient: apolloClient,
       utils: {
         ...rhhcDefaultConfig.utils,
         getEventCardProps: AppConfig.showEnrolmentStatusInCardDetails
-          ? (item: EventFieldsFragment, locale: string) => ({
+          ? (
+              item: EventFieldsFragment,
+              organisationPrefixes: string[],
+              locale: string
+            ): CardProps => ({
               ...rhhcDefaultConfig.utils.getEventCardProps(
                 item,
-                CITY_OF_HELSINKI_LINKED_EVENTS_ORGANIZATION_PREFIXES,
+                organisationPrefixes,
                 locale
               ),
               linkArrowLabel: getLinkArrowLabel({
@@ -110,25 +114,25 @@ export default function useHobbiesRHHCConfig(args: {
             })
           : rhhcDefaultConfig.utils.getEventCardProps,
         getRoutedInternalHref: (
-          link: string,
-          _type: ModuleItemTypeEnum
+          link?: string | null,
+          type?: ModuleItemTypeEnum
         ): string => {
-          if (_type === ModuleItemTypeEnum.Venue) {
+          if (type === ModuleItemTypeEnum.Venue) {
             // quick fix for venue url rewrites
             return routerHelper.getLocalizedCmsItemUrl(
               ROUTES.VENUES,
               {
-                venueId: getVenueSourceId(link),
+                venueId: getVenueSourceId(link ?? ''),
               },
               locale
             );
           }
-          return link || '#';
+          return link ?? '#';
         },
         getIsHrefExternal,
       },
       internalHrefOrigins,
-    } as unknown as Config;
+    };
   }, [
     commonConfig,
     appTranslation,