refactor(core): improve TransationsFor type

input-output-hk · Apr 28, 2024 · f0badda · f0badda
1 parent dac2d07
commit f0badda
Show file tree

Hide file tree

Showing 3 changed files with 35 additions and 11 deletions.
diff --git a/packages/core/src/ui/components/ActivityDetail/TxDetailsList.tsx b/packages/core/src/ui/components/ActivityDetail/TxDetailsList.tsx
@@ -4,6 +4,7 @@ import cn from 'classnames';
 import React, { useState } from 'react';
 import { DownOutlined, InfoCircleOutlined } from '@ant-design/icons';
 import { Button } from '@lace/common';
+import { TranslationsFor } from '@src/ui/utils/types';
 import { ReactComponent as BracketDown } from '../../assets/icons/bracket-down.component.svg';
 import { DetailRows } from './components';
 import styles from './TransactionInputOutput.module.scss';
@@ -14,7 +15,7 @@ interface TxDetailListProps<T extends string> {
   title: string;
   subTitle: string;
   lists: TxDetails<T>[];
-  translations: Record<T, string>;
+  translations: T extends string ? TranslationsFor<T> : never;
   tooltipContent?: React.ReactNode;
   withSeparatorLine?: boolean;
 }

diff --git a/packages/core/src/ui/components/ActivityDetail/components/DetailRows.tsx b/packages/core/src/ui/components/ActivityDetail/components/DetailRows.tsx
@@ -2,12 +2,13 @@ import React from 'react';
 import cn from 'classnames';
 import { DetailRow } from './DetailRow';
 import { TxDetails } from '../types';
+import { TranslationsFor } from '@src/ui/utils/types';
 import styles from '../TransactionInputOutput.module.scss';
 
 type DetailRowsProps<T extends string> = {
   list: TxDetails<T>;
   testId: string;
-  translations: Record<T, string>;
+  translations: T extends string ? TranslationsFor<T> : never;
 };
 
 export const DetailRows = function DetailRows<T extends string>({

diff --git a/packages/core/src/ui/utils/types.ts b/packages/core/src/ui/utils/types.ts
@@ -3,14 +3,36 @@ export type KeyConfig = {
   jsxElementKey: string;
 };
 
-export type TranslationsFor<Key extends string | KeyConfig> = Record<
-  Key extends string
-    ? Key
-    : Key extends KeyConfig
-    ? Key['stringKey'] extends string
-      ? Key['stringKey']
-      : never
-    : never,
+type NotEmptyKeyOfKeyConfig<Config extends string | KeyConfig, Key extends keyof KeyConfig> = Config extends KeyConfig
+  ? Config[Key] extends string
+    ? Config[Key]
+    : never
+  : never;
+
+/*
+ * Usage:
+ * 1. Union of string param
+ * translations: TranslationsFor<'title' | 'subtitle'>
+ * Creates:
+ * {
+ *   title: string;
+ *   subtitle: string;
+ * }
+ *
+ * 2. Object of sting unions param (both object keys are optional)
+ * translations: TranslationsFor<{
+ *   jsxElementKey: 'description';
+ *   stringKey: 'title' | 'subtitle';
+ * }>
+ * Creates:
+ * {
+ *   description: JSX.Element;
+ *   title: string;
+ *   subtitle: string;
+ * }
+ * */
+export type TranslationsFor<KeyOrConfig extends string | KeyConfig> = Record<
+  KeyOrConfig extends string ? KeyOrConfig : NotEmptyKeyOfKeyConfig<KeyOrConfig, 'stringKey'>,
   string
 > &
-  Record<Key extends KeyConfig ? Key['jsxElementKey'] : never, JSX.Element>;
+  Record<NotEmptyKeyOfKeyConfig<KeyOrConfig, 'jsxElementKey'>, JSX.Element>;