문제 발생

rsuite라는 dae picker 라이브러리가 있다. 날짜와 시간에 관련된 라이브러리 답게 로케일 기능이 내장되어있다.

import type enUS from 'rsuite/locales/en_US'
import type koKR from 'rsuite/locales/ko_KR'

위와같이 내장된 로케일을 불러오는데 유독 헝가리에서만 문제가 생겼다.

(alias) const koKR: {
    code: string;
    common: {
        loading: string;
        emptyMessage: string;
        remove: string;
        clear: string;
    };

한국어 뿐 아니라 모든 로케일들은 위와 같이 common 아래에 loading emptyMessage remove clear가 있다

(alias) const huHU: {
    code: string;
    common: {
        loading: string;
        emptyMessage: string;
    };

하지만 헝가리어만은 remove와 clear가 없었다. 이것때문에 rsuite의 DatePicker에서 locale을 불러올때 문제가 발생한 것이었다.

해결법

해결법 1 - 헝가리 삭제

제일 단순하다 헝가리어를 로케일 목록에서 제거해 버리는 것이다. 다행히(?) 헝가리의 서비스가 아니기 때문에 문제가 없을 것이다

해결법 2 - 패치

헝가리의 타입을 불러 온 뒤 스프레드 연산자...를 이용해서 common에 clear와 remove를 추가하는 것이다
단순히 추가를 한다면 유지보수 과정에서 이 버그가 해결되었어도 내가한 야매 패치를 그대로 쓰게 되기 때문에 Or 연산자||를 사용하였다.

const huImportWrapper = async () => {
  const { default: defaultModule } = await import('rsuite/locales/hu_HU')
  const updatedCommon = {
    ...defaultModule.common,
    // eslint-disable-next-line @typescript-eslint/no-explicit-any
    clear: (defaultModule.common as any).clear || 'Törlés',
    // eslint-disable-next-line @typescript-eslint/no-explicit-any
    remove: (defaultModule.common as any).remove || 'Eltávolítás',
  }

  return {
    default: {
      ...defaultModule,
      common: updatedCommon,
    },
  }
}
(중략)
export const rsuiteLocale = createLanguageNamespace<LanguageResolver>({
  hu: huImportWrapper,