From 48221c0d04e6482af4daddd85718b1704c495ebf Mon Sep 17 00:00:00 2001
From: deshi <de.shirokov@qiwi.com>
Date: Tue, 6 Apr 2021 15:55:26 +0300
Subject: [PATCH] feat(@qiwi/pijma-desktop): add overrides prop

---
 packages/desktop/src/markdown/Markdown.tsx | 40 ++++++++++++----------
 packages/mobile/src/markdown/Markdown.tsx  | 40 ++++++++++++----------
 2 files changed, 44 insertions(+), 36 deletions(-)

diff --git a/packages/desktop/src/markdown/Markdown.tsx b/packages/desktop/src/markdown/Markdown.tsx
index c0ebcb494..435a6a6ee 100644
--- a/packages/desktop/src/markdown/Markdown.tsx
+++ b/packages/desktop/src/markdown/Markdown.tsx
@@ -1,5 +1,5 @@
 import React, {Children, FC} from 'react'
-import MarkdownComponent from 'markdown-to-jsx'
+import MarkdownComponent, {MarkdownOptions} from 'markdown-to-jsx'
 import {Paragraph, Heading, Text} from '../typography'
 import {Link} from '../link'
 import {List} from '../list'
@@ -8,6 +8,7 @@ import {styled, Box, Image} from '@qiwi/pijma-core'
 export interface MarkdownProps {
   size?: 's' | 'm' | 'l'
   children: string
+  overrides?: Record<string, FC<any>>
 }
 
 const MarkdownBox = styled(Box)({
@@ -127,7 +128,7 @@ const ol: FC<NumericListProps> = ({size, start, children}) => (
   </MarkdownBox>
 )
 
-const overrides: {[tag: string]: FC<any>} = {
+const defaultOverrides: MarkdownProps['overrides'] = {
   p,
   h1,
   h2,
@@ -143,21 +144,24 @@ const overrides: {[tag: string]: FC<any>} = {
   img,
 }
 
-export const Markdown: FC<MarkdownProps> = ({size = 'm', children}) => (
-  <MarkdownComponent
-    children={children}
-    options={{
-      overrides: Object.keys(overrides).reduce((prev, tag) => ({
-        ...prev,
-        ...{
-          [tag]: {
-            component: overrides[tag],
-            props: {
-              size,
+export const Markdown: FC<MarkdownProps> = ({size = 'm', children, overrides = {}}) => {
+  const allOverrides = {...defaultOverrides, ...overrides}
+  return (
+    <MarkdownComponent
+      children={children}
+      options={{
+        overrides: Object.keys(allOverrides).reduce<MarkdownOptions['overrides']>((prev, tag) => ({
+          ...prev,
+          ...{
+            [tag]: {
+              component: allOverrides[tag],
+              props: {
+                size,
+              },
             },
           },
-        },
-      }), {}),
-    }}
-  />
-)
+        }), {}),
+      }}
+    />
+  )
+}
diff --git a/packages/mobile/src/markdown/Markdown.tsx b/packages/mobile/src/markdown/Markdown.tsx
index 3b36c7f1b..e99d98f7c 100644
--- a/packages/mobile/src/markdown/Markdown.tsx
+++ b/packages/mobile/src/markdown/Markdown.tsx
@@ -1,5 +1,5 @@
 import React, {Children, FC} from 'react'
-import MarkdownComponent from 'markdown-to-jsx'
+import MarkdownComponent, {MarkdownOptions} from 'markdown-to-jsx'
 import {Paragraph, Heading, Text} from '../typography'
 import {Link} from '../link'
 import {List} from '../list'
@@ -8,6 +8,7 @@ import {styled, Box, Image} from '@qiwi/pijma-core'
 export interface MarkdownProps {
   size?: 's' | 'm' | 'l'
   children: string
+  overrides?: Record<string, FC<any>>
 }
 
 const MarkdownBox = styled(Box)({
@@ -121,7 +122,7 @@ const ol: FC<NumericListProps> = ({size, start, children}) => (
   </MarkdownBox>
 )
 
-const overrides: {[tag: string]: FC<any>} = {
+const defaultOverrides: MarkdownProps['overrides'] = {
   p,
   h1,
   h2,
@@ -136,21 +137,24 @@ const overrides: {[tag: string]: FC<any>} = {
   img,
 }
 
-export const Markdown: FC<MarkdownProps> = ({size = 'm', children}) => (
-  <MarkdownComponent
-    children={children}
-    options={{
-      overrides: Object.keys(overrides).reduce((prev, tag) => ({
-        ...prev,
-        ...{
-          [tag]: {
-            component: overrides[tag],
-            props: {
-              size,
+export const Markdown: FC<MarkdownProps> = ({size = 'm', children, overrides = {}}) => {
+  const allOverrides = {...defaultOverrides, ...overrides}
+  return (
+    <MarkdownComponent
+      children={children}
+      options={{
+        overrides: Object.keys(allOverrides).reduce<MarkdownOptions['overrides']>((prev, tag) => ({
+          ...prev,
+          ...{
+            [tag]: {
+              component: allOverrides[tag],
+              props: {
+                size,
+              },
             },
           },
-        },
-      }), {}),
-    }}
-  />
-)
+        }), {}),
+      }}
+    />
+  )
+}