From 7e155b6f194fe8d528d6d2d2553f8afaf533db55 Mon Sep 17 00:00:00 2001 From: Gaurav Tewari Date: Mon, 10 Feb 2025 15:25:33 +0530 Subject: [PATCH] feat: add engage and translate icon (#2537) * feat: add engage and tanslate icon * chore: add changeset * feat: add tests * feat: update changeset --- .changeset/rare-pens-learn.md | 5 + packages/blade/scripts/icons.json | 6 +- .../EngageIcon/EngageIcon.native.test.tsx | 11 ++ .../Icons/EngageIcon/EngageIcon.tsx | 24 ++++ .../Icons/EngageIcon/EngageIcon.web.test.tsx | 11 ++ .../EngageIcon.native.test.tsx.snap | 86 +++++++++++++ .../EngageIcon.web.test.tsx.snap | 28 +++++ .../src/components/Icons/EngageIcon/index.ts | 1 + .../TranslateIcon.native.test.tsx | 11 ++ .../Icons/TranslateIcon/TranslateIcon.tsx | 32 +++++ .../TranslateIcon/TranslateIcon.web.test.tsx | 11 ++ .../TranslateIcon.native.test.tsx.snap | 114 ++++++++++++++++++ .../TranslateIcon.web.test.tsx.snap | 38 ++++++ .../components/Icons/TranslateIcon/index.ts | 1 + .../blade/src/components/Icons/iconMap.ts | 4 + packages/blade/src/components/Icons/index.ts | 2 + 16 files changed, 382 insertions(+), 3 deletions(-) create mode 100644 .changeset/rare-pens-learn.md create mode 100644 packages/blade/src/components/Icons/EngageIcon/EngageIcon.native.test.tsx create mode 100644 packages/blade/src/components/Icons/EngageIcon/EngageIcon.tsx create mode 100644 packages/blade/src/components/Icons/EngageIcon/EngageIcon.web.test.tsx create mode 100644 packages/blade/src/components/Icons/EngageIcon/__snapshots__/EngageIcon.native.test.tsx.snap create mode 100644 packages/blade/src/components/Icons/EngageIcon/__snapshots__/EngageIcon.web.test.tsx.snap create mode 100644 packages/blade/src/components/Icons/EngageIcon/index.ts create mode 100644 packages/blade/src/components/Icons/TranslateIcon/TranslateIcon.native.test.tsx create mode 100644 packages/blade/src/components/Icons/TranslateIcon/TranslateIcon.tsx create mode 100644 packages/blade/src/components/Icons/TranslateIcon/TranslateIcon.web.test.tsx create mode 100644 packages/blade/src/components/Icons/TranslateIcon/__snapshots__/TranslateIcon.native.test.tsx.snap create mode 100644 packages/blade/src/components/Icons/TranslateIcon/__snapshots__/TranslateIcon.web.test.tsx.snap create mode 100644 packages/blade/src/components/Icons/TranslateIcon/index.ts diff --git a/.changeset/rare-pens-learn.md b/.changeset/rare-pens-learn.md new file mode 100644 index 00000000000..06061f057f5 --- /dev/null +++ b/.changeset/rare-pens-learn.md @@ -0,0 +1,5 @@ +--- +'@razorpay/blade': minor +--- + +feat(blade): add engage and translate icons diff --git a/packages/blade/scripts/icons.json b/packages/blade/scripts/icons.json index 4ff4576a036..51b54ca9573 100644 --- a/packages/blade/scripts/icons.json +++ b/packages/blade/scripts/icons.json @@ -1,8 +1,8 @@ [ { - "prompt": "\n\n\n\n\n" + "engage": "\n\n\n\n" }, { - "sort": "\n\n\n\n" + "translate": "\n\n\n\n\n\n" } -] \ No newline at end of file +] diff --git a/packages/blade/src/components/Icons/EngageIcon/EngageIcon.native.test.tsx b/packages/blade/src/components/Icons/EngageIcon/EngageIcon.native.test.tsx new file mode 100644 index 00000000000..14711b3b465 --- /dev/null +++ b/packages/blade/src/components/Icons/EngageIcon/EngageIcon.native.test.tsx @@ -0,0 +1,11 @@ +import EngageIcon from '.'; +import renderWithTheme from '~utils/testing/renderWithTheme.native'; + +describe('', () => { + it('should render EngageIcon', () => { + const renderTree = renderWithTheme( + , + ).toJSON(); + expect(renderTree).toMatchSnapshot(); + }); +}); diff --git a/packages/blade/src/components/Icons/EngageIcon/EngageIcon.tsx b/packages/blade/src/components/Icons/EngageIcon/EngageIcon.tsx new file mode 100644 index 00000000000..b438d11e857 --- /dev/null +++ b/packages/blade/src/components/Icons/EngageIcon/EngageIcon.tsx @@ -0,0 +1,24 @@ +import { Svg, Path } from '../_Svg'; +import type { IconComponent } from '..'; +import useIconProps from '../useIconProps'; + +const EngageIcon: IconComponent = ({ size, color, ...styledProps }) => { + const { height, width, iconColor } = useIconProps({ size, color }); + + return ( + + + + + ); +}; + +export default EngageIcon; diff --git a/packages/blade/src/components/Icons/EngageIcon/EngageIcon.web.test.tsx b/packages/blade/src/components/Icons/EngageIcon/EngageIcon.web.test.tsx new file mode 100644 index 00000000000..94fbe5ffc07 --- /dev/null +++ b/packages/blade/src/components/Icons/EngageIcon/EngageIcon.web.test.tsx @@ -0,0 +1,11 @@ +import EngageIcon from './'; +import renderWithTheme from '~utils/testing/renderWithTheme.web'; + +describe('', () => { + it('should render EngageIcon', () => { + const { container } = renderWithTheme( + , + ); + expect(container).toMatchSnapshot(); + }); +}); diff --git a/packages/blade/src/components/Icons/EngageIcon/__snapshots__/EngageIcon.native.test.tsx.snap b/packages/blade/src/components/Icons/EngageIcon/__snapshots__/EngageIcon.native.test.tsx.snap new file mode 100644 index 00000000000..2135d6e7d96 --- /dev/null +++ b/packages/blade/src/components/Icons/EngageIcon/__snapshots__/EngageIcon.native.test.tsx.snap @@ -0,0 +1,86 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[` should render EngageIcon 1`] = ` + + + + + + + + +`; diff --git a/packages/blade/src/components/Icons/EngageIcon/__snapshots__/EngageIcon.web.test.tsx.snap b/packages/blade/src/components/Icons/EngageIcon/__snapshots__/EngageIcon.web.test.tsx.snap new file mode 100644 index 00000000000..a4d5854b8e1 --- /dev/null +++ b/packages/blade/src/components/Icons/EngageIcon/__snapshots__/EngageIcon.web.test.tsx.snap @@ -0,0 +1,28 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[` should render EngageIcon 1`] = ` +
+ +
+`; diff --git a/packages/blade/src/components/Icons/EngageIcon/index.ts b/packages/blade/src/components/Icons/EngageIcon/index.ts new file mode 100644 index 00000000000..50804d4fe1b --- /dev/null +++ b/packages/blade/src/components/Icons/EngageIcon/index.ts @@ -0,0 +1 @@ +export { default } from './EngageIcon'; diff --git a/packages/blade/src/components/Icons/TranslateIcon/TranslateIcon.native.test.tsx b/packages/blade/src/components/Icons/TranslateIcon/TranslateIcon.native.test.tsx new file mode 100644 index 00000000000..49c0488407f --- /dev/null +++ b/packages/blade/src/components/Icons/TranslateIcon/TranslateIcon.native.test.tsx @@ -0,0 +1,11 @@ +import TranslateIcon from '.'; +import renderWithTheme from '~utils/testing/renderWithTheme.native'; + +describe('', () => { + it('should render TranslateIcon', () => { + const renderTree = renderWithTheme( + , + ).toJSON(); + expect(renderTree).toMatchSnapshot(); + }); +}); diff --git a/packages/blade/src/components/Icons/TranslateIcon/TranslateIcon.tsx b/packages/blade/src/components/Icons/TranslateIcon/TranslateIcon.tsx new file mode 100644 index 00000000000..b9aa042d6c0 --- /dev/null +++ b/packages/blade/src/components/Icons/TranslateIcon/TranslateIcon.tsx @@ -0,0 +1,32 @@ +import { Svg, Path } from '../_Svg'; +import type { IconComponent } from '..'; +import useIconProps from '../useIconProps'; + +const TranslateIcon: IconComponent = ({ size, color, ...styledProps }) => { + const { height, width, iconColor } = useIconProps({ size, color }); + + return ( + + + + + + + ); +}; + +export default TranslateIcon; diff --git a/packages/blade/src/components/Icons/TranslateIcon/TranslateIcon.web.test.tsx b/packages/blade/src/components/Icons/TranslateIcon/TranslateIcon.web.test.tsx new file mode 100644 index 00000000000..c1378a2b8d6 --- /dev/null +++ b/packages/blade/src/components/Icons/TranslateIcon/TranslateIcon.web.test.tsx @@ -0,0 +1,11 @@ +import TranslateIcon from './'; +import renderWithTheme from '~utils/testing/renderWithTheme.web'; + +describe('', () => { + it('should render TranslateIcon', () => { + const { container } = renderWithTheme( + , + ); + expect(container).toMatchSnapshot(); + }); +}); diff --git a/packages/blade/src/components/Icons/TranslateIcon/__snapshots__/TranslateIcon.native.test.tsx.snap b/packages/blade/src/components/Icons/TranslateIcon/__snapshots__/TranslateIcon.native.test.tsx.snap new file mode 100644 index 00000000000..beb5b5aa197 --- /dev/null +++ b/packages/blade/src/components/Icons/TranslateIcon/__snapshots__/TranslateIcon.native.test.tsx.snap @@ -0,0 +1,114 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[` should render TranslateIcon 1`] = ` + + + + + + + + + + +`; diff --git a/packages/blade/src/components/Icons/TranslateIcon/__snapshots__/TranslateIcon.web.test.tsx.snap b/packages/blade/src/components/Icons/TranslateIcon/__snapshots__/TranslateIcon.web.test.tsx.snap new file mode 100644 index 00000000000..f02a34b542e --- /dev/null +++ b/packages/blade/src/components/Icons/TranslateIcon/__snapshots__/TranslateIcon.web.test.tsx.snap @@ -0,0 +1,38 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[` should render TranslateIcon 1`] = ` +
+ +
+`; diff --git a/packages/blade/src/components/Icons/TranslateIcon/index.ts b/packages/blade/src/components/Icons/TranslateIcon/index.ts new file mode 100644 index 00000000000..0b0f9a1737b --- /dev/null +++ b/packages/blade/src/components/Icons/TranslateIcon/index.ts @@ -0,0 +1 @@ +export { default } from './TranslateIcon'; diff --git a/packages/blade/src/components/Icons/iconMap.ts b/packages/blade/src/components/Icons/iconMap.ts index 85523ac5f1a..20097a6a1d0 100644 --- a/packages/blade/src/components/Icons/iconMap.ts +++ b/packages/blade/src/components/Icons/iconMap.ts @@ -139,6 +139,7 @@ import EditComposeIconComponent from './EditComposeIcon'; import EditIconComponent from './EditIcon'; import EditInlineIconComponent from './EditInlineIcon'; import EducationIconComponent from './EducationIcon'; +import EngageIconComponent from './EngageIcon'; import EqualsIconComponent from './EqualsIcon'; import EscrowAccountIconComponent from './EscrowAccountIcon'; import ExportIconComponent from './ExportIcon'; @@ -339,6 +340,7 @@ import TopLeftSharpCornerIconComponent from './TopLeftSharpCornerIcon'; import TrademarkIconComponent from './TrademarkIcon'; import TrademarkRegisteredIconComponent from './TrademarkRegisteredIcon'; import TransactionsIconComponent from './TransactionsIcon'; +import TranslateIconComponent from './TranslateIcon'; import TrashIconComponent from './TrashIcon'; import TrendingDownIconComponent from './TrendingDownIcon'; import TrendingUpIconComponent from './TrendingUpIcon'; @@ -522,6 +524,7 @@ const iconMap: Record = { EditIcon: EditIconComponent, EditInlineIcon: EditInlineIconComponent, EducationIcon: EducationIconComponent, + EngageIcon: EngageIconComponent, EqualsIcon: EqualsIconComponent, EscrowAccountIcon: EscrowAccountIconComponent, ExportIcon: ExportIconComponent, @@ -722,6 +725,7 @@ const iconMap: Record = { TrademarkIcon: TrademarkIconComponent, TrademarkRegisteredIcon: TrademarkRegisteredIconComponent, TransactionsIcon: TransactionsIconComponent, + TranslateIcon: TranslateIconComponent, TrashIcon: TrashIconComponent, TrendingDownIcon: TrendingDownIconComponent, TrendingUpIcon: TrendingUpIconComponent, diff --git a/packages/blade/src/components/Icons/index.ts b/packages/blade/src/components/Icons/index.ts index 8c142600c4f..5b6ff0fbe05 100644 --- a/packages/blade/src/components/Icons/index.ts +++ b/packages/blade/src/components/Icons/index.ts @@ -140,6 +140,7 @@ export { default as EditComposeIcon } from './EditComposeIcon'; export { default as EditIcon } from './EditIcon'; export { default as EditInlineIcon } from './EditInlineIcon'; export { default as EducationIcon } from './EducationIcon'; +export { default as EngageIcon } from './EngageIcon'; export { default as EqualsIcon } from './EqualsIcon'; export { default as EscrowAccountIcon } from './EscrowAccountIcon'; export { default as ExportIcon } from './ExportIcon'; @@ -340,6 +341,7 @@ export { default as TopLeftSharpCornerIcon } from './TopLeftSharpCornerIcon'; export { default as TrademarkIcon } from './TrademarkIcon'; export { default as TrademarkRegisteredIcon } from './TrademarkRegisteredIcon'; export { default as TransactionsIcon } from './TransactionsIcon'; +export { default as TranslateIcon } from './TranslateIcon'; export { default as TrashIcon } from './TrashIcon'; export { default as TrendingDownIcon } from './TrendingDownIcon'; export { default as TrendingUpIcon } from './TrendingUpIcon';