From 0eba3145e566b042251709094dcb9080423d8133 Mon Sep 17 00:00:00 2001
From: Akmal Isomadinov <isomadinovakmal1997@gmail.com>
Date: Tue, 9 Jul 2024 12:42:36 +0500
Subject: [PATCH] Shared:Components:Selector:Fixed icon size

---
 .../components/selector-add-button/SelectorAddButton.tsx     | 3 ++-
 .../selector-add-button/SelectorAddButton.types.tsx          | 2 ++
 packages/shared/components/selector/Selector.styled.ts       | 5 +++++
 .../components/selector/sub-components/EmptyScreen.tsx       | 3 +++
 public/images/icons/16/plus.svg                              | 3 +++
 5 files changed, 15 insertions(+), 1 deletion(-)
 create mode 100644 public/images/icons/16/plus.svg

diff --git a/packages/shared/components/selector-add-button/SelectorAddButton.tsx b/packages/shared/components/selector-add-button/SelectorAddButton.tsx
index a6a90c4370..c0540a6f13 100644
--- a/packages/shared/components/selector-add-button/SelectorAddButton.tsx
+++ b/packages/shared/components/selector-add-button/SelectorAddButton.tsx
@@ -43,6 +43,7 @@ const SelectorAddButton = (props: SelectorAddButtonProps) => {
     style,
     iconName = ActionsHeaderTouchReactSvgUrl,
     onClick,
+    iconSize = 12,
   } = props;
 
   const onClickAction = (e: React.MouseEvent) => {
@@ -62,7 +63,7 @@ const SelectorAddButton = (props: SelectorAddButtonProps) => {
       data-testid="selector-add-button"
     >
       <IconButton
-        size={12}
+        size={iconSize}
         iconName={iconName}
         isFill
         isDisabled={isDisabled}
diff --git a/packages/shared/components/selector-add-button/SelectorAddButton.types.tsx b/packages/shared/components/selector-add-button/SelectorAddButton.types.tsx
index 6b3713dc5b..297588d543 100644
--- a/packages/shared/components/selector-add-button/SelectorAddButton.types.tsx
+++ b/packages/shared/components/selector-add-button/SelectorAddButton.types.tsx
@@ -41,4 +41,6 @@ export interface SelectorAddButtonProps {
   iconName?: string;
   /** Change colors to accent */
   isAction?: boolean;
+
+  iconSize?: number;
 }
diff --git a/packages/shared/components/selector/Selector.styled.ts b/packages/shared/components/selector/Selector.styled.ts
index a8fdc40951..8f4f723c7c 100644
--- a/packages/shared/components/selector/Selector.styled.ts
+++ b/packages/shared/components/selector/Selector.styled.ts
@@ -398,6 +398,11 @@ const StyledNewEmptyScreen = styled.section`
     margin-top: 16px;
   }
 
+  .empty-button {
+    width: 36px;
+    height: 36px;
+  }
+
   .empty-button-label {
     cursor: pointer;
   }
diff --git a/packages/shared/components/selector/sub-components/EmptyScreen.tsx b/packages/shared/components/selector/sub-components/EmptyScreen.tsx
index 48691e76f5..02c740247d 100644
--- a/packages/shared/components/selector/sub-components/EmptyScreen.tsx
+++ b/packages/shared/components/selector/sub-components/EmptyScreen.tsx
@@ -32,6 +32,7 @@ import PlusSvgUrl from "PUBLIC_DIR/images/plus.svg?url";
 import UpSvgUrl from "PUBLIC_DIR/images/up.svg?url";
 import FormRoomEmptyDarkImageUrl from "PUBLIC_DIR/images/emptyview/selector.form.room.empty.screen.dark.svg?url";
 import FormRoomEmptyLightImageUrl from "PUBLIC_DIR/images/emptyview/selector.form.room.empty.screen.light.svg?url";
+import Plus16SvgUrl from "PUBLIC_DIR/images/icons/16/plus.svg?url";
 
 import { RoomsType } from "../../../enums";
 
@@ -115,7 +116,9 @@ const EmptyScreen = ({
         <div className="empty_button-wrapper" onClick={onCreateClickAction}>
           <SelectorAddButton
             isAction
+            iconSize={16}
             className="empty-button"
+            iconName={Plus16SvgUrl}
             title={t("Common:CreateFormFillingRoom")}
           />
           <Text className="empty-button-label" noSelect>
diff --git a/public/images/icons/16/plus.svg b/public/images/icons/16/plus.svg
new file mode 100644
index 0000000000..7642350bbf
--- /dev/null
+++ b/public/images/icons/16/plus.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M9 7V1H7V7H1V9H7V15H9V9H15V7H9Z" fill="#4781D1"/>
+</svg>