From 426ab15bfc6b82a91fb44b781e92222f9078e9f2 Mon Sep 17 00:00:00 2001
From: alex <48489896+devnaumov@users.noreply.github.com>
Date: Mon, 12 Feb 2024 11:06:40 +0100
Subject: [PATCH] CB-4651 change wrap lines icons (#2371)

* CB-4651 change wrap lines icons

* CB-4651 remove icons from icons.svg

* CB-4651 add different size of icons

---------

Co-authored-by: Daria Marutkina <125263541+dariamarutkina@users.noreply.github.com>
---
 .../public/icons/plugin_data_viewer_no_wrap_lines.svg          | 1 +
 .../public/icons/plugin_data_viewer_no_wrap_lines_m.svg        | 1 +
 .../public/icons/plugin_data_viewer_no_wrap_lines_sm.svg       | 1 +
 .../public/icons/plugin_data_viewer_wrap_lines.svg             | 1 +
 .../public/icons/plugin_data_viewer_wrap_lines_m.svg           | 1 +
 .../public/icons/plugin_data_viewer_wrap_lines_sm.svg          | 1 +
 .../ValuePanelPresentation/TextValue/TextValuePresentation.tsx | 3 ++-
 7 files changed, 8 insertions(+), 1 deletion(-)
 create mode 100644 webapp/packages/plugin-data-viewer/public/icons/plugin_data_viewer_no_wrap_lines.svg
 create mode 100644 webapp/packages/plugin-data-viewer/public/icons/plugin_data_viewer_no_wrap_lines_m.svg
 create mode 100644 webapp/packages/plugin-data-viewer/public/icons/plugin_data_viewer_no_wrap_lines_sm.svg
 create mode 100644 webapp/packages/plugin-data-viewer/public/icons/plugin_data_viewer_wrap_lines.svg
 create mode 100644 webapp/packages/plugin-data-viewer/public/icons/plugin_data_viewer_wrap_lines_m.svg
 create mode 100644 webapp/packages/plugin-data-viewer/public/icons/plugin_data_viewer_wrap_lines_sm.svg

diff --git a/webapp/packages/plugin-data-viewer/public/icons/plugin_data_viewer_no_wrap_lines.svg b/webapp/packages/plugin-data-viewer/public/icons/plugin_data_viewer_no_wrap_lines.svg
new file mode 100644
index 0000000000..a77c6a1842
--- /dev/null
+++ b/webapp/packages/plugin-data-viewer/public/icons/plugin_data_viewer_no_wrap_lines.svg
@@ -0,0 +1 @@
+<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><polygon points="21.07 21.67 18.95 19.55 14 24.5 16.12 26.62 18.95 29.45 21.07 27.33 18.24 24.5 21.07 21.67" fill="#338ecc"/><rect x="-3.59" y="14" width="38.18" height="3" transform="translate(-6.42 15.5) rotate(-45)" fill="#338ecc"/><polygon points="4 5 4 8 24.88 8 27.88 5 4 5" fill="#338ecc"/><polygon points="4 23 4 26 6.88 26 9.88 23 4 23" fill="#338ecc"/><polygon points="4 14 4 17 15.88 17 18.88 14 4 14" fill="#338ecc"/><path d="M23,14.09,20.12,17H22a3,3,0,0,1,0,6H16.5v3H22a6,6,0,0,0,1-11.91Z" fill="#338ecc"/></svg>
\ No newline at end of file
diff --git a/webapp/packages/plugin-data-viewer/public/icons/plugin_data_viewer_no_wrap_lines_m.svg b/webapp/packages/plugin-data-viewer/public/icons/plugin_data_viewer_no_wrap_lines_m.svg
new file mode 100644
index 0000000000..2ec1cb24fc
--- /dev/null
+++ b/webapp/packages/plugin-data-viewer/public/icons/plugin_data_viewer_no_wrap_lines_m.svg
@@ -0,0 +1 @@
+<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><polygon points="16.1 16.71 14.51 15.12 10.79 18.83 12.39 20.42 14.51 22.54 16.1 20.95 13.98 18.83 16.1 16.71" fill="#338ecc"/><rect x="-2.4" y="10.95" width="28.64" height="2.25" transform="translate(-5.05 11.97) rotate(-45)" fill="#338ecc"/><polygon points="3.29 4.21 3.29 6.46 18.95 6.46 21.2 4.21 3.29 4.21" fill="#338ecc"/><polygon points="3.29 17.7 3.29 19.95 5.46 19.95 7.71 17.7 3.29 17.7" fill="#338ecc"/><polygon points="3.29 10.96 3.29 13.21 12.21 13.21 14.46 10.96 3.29 10.96" fill="#338ecc"/><path d="M17.57,11,15.39,13.2H16.8a2.25,2.25,0,0,1,0,4.5H12.67V20H16.8A4.49,4.49,0,0,0,17.57,11Z" fill="#338ecc"/></svg>
\ No newline at end of file
diff --git a/webapp/packages/plugin-data-viewer/public/icons/plugin_data_viewer_no_wrap_lines_sm.svg b/webapp/packages/plugin-data-viewer/public/icons/plugin_data_viewer_no_wrap_lines_sm.svg
new file mode 100644
index 0000000000..4fcbcc1ca0
--- /dev/null
+++ b/webapp/packages/plugin-data-viewer/public/icons/plugin_data_viewer_no_wrap_lines_sm.svg
@@ -0,0 +1 @@
+<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><polygon points="10.51 11.37 9.45 10.3 6.97 12.78 8.03 13.84 9.45 15.26 10.51 14.19 9.09 12.78 10.51 11.37" fill="#338ecc"/><rect x="-1.83" y="7.53" width="19.09" height="1.5" transform="translate(-3.59 7.88) rotate(-45)" fill="#338ecc"/><polygon points="1.97 3.03 1.97 4.53 12.41 4.53 13.91 3.03 1.97 3.03" fill="#338ecc"/><polygon points="1.97 12.03 1.97 13.53 3.41 13.53 4.91 12.03 1.97 12.03" fill="#338ecc"/><polygon points="1.97 7.53 1.97 9.03 7.91 9.03 9.41 7.53 1.97 7.53" fill="#338ecc"/><path d="M11.48,7.58,10,9H11a1.5,1.5,0,0,1,0,3H8.22v1.5H11a3,3,0,0,0,.51-5.95Z" fill="#338ecc"/></svg>
\ No newline at end of file
diff --git a/webapp/packages/plugin-data-viewer/public/icons/plugin_data_viewer_wrap_lines.svg b/webapp/packages/plugin-data-viewer/public/icons/plugin_data_viewer_wrap_lines.svg
new file mode 100644
index 0000000000..41d9b8da64
--- /dev/null
+++ b/webapp/packages/plugin-data-viewer/public/icons/plugin_data_viewer_wrap_lines.svg
@@ -0,0 +1 @@
+<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><polygon points="28 5 4 5 4 8 28 8 28 5 28 5" fill="#338ecc"/><rect x="4" y="23" width="8" height="3" fill="#338ecc"/><polygon points="21.07 21.67 18.95 19.55 14 24.5 16.12 26.62 18.95 29.45 21.07 27.33 18.24 24.5 21.07 21.67" fill="#338ecc"/><path d="M22,26H16.5V23H22a3,3,0,0,0,0-6H4V14H22a6,6,0,0,1,0,12Z" fill="#338ecc"/></svg>
\ No newline at end of file
diff --git a/webapp/packages/plugin-data-viewer/public/icons/plugin_data_viewer_wrap_lines_m.svg b/webapp/packages/plugin-data-viewer/public/icons/plugin_data_viewer_wrap_lines_m.svg
new file mode 100644
index 0000000000..9e2189fbd0
--- /dev/null
+++ b/webapp/packages/plugin-data-viewer/public/icons/plugin_data_viewer_wrap_lines_m.svg
@@ -0,0 +1 @@
+<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><polygon points="20 4.7 4 4.7 4 6.7 20 6.7 20 4.7 20 4.7" fill="#338ecc"/><rect x="4" y="16.7" width="5.33" height="2" fill="#338ecc"/><polygon points="15.38 15.81 13.97 14.4 10.67 17.7 12.08 19.11 13.97 21 15.38 19.59 13.49 17.7 15.38 15.81" fill="#338ecc"/><path d="M16,18.7H12.33v-2H16a2,2,0,0,0,0-4H4v-2H16a4,4,0,0,1,0,8Z" fill="#338ecc"/></svg>
\ No newline at end of file
diff --git a/webapp/packages/plugin-data-viewer/public/icons/plugin_data_viewer_wrap_lines_sm.svg b/webapp/packages/plugin-data-viewer/public/icons/plugin_data_viewer_wrap_lines_sm.svg
new file mode 100644
index 0000000000..cfa247bac6
--- /dev/null
+++ b/webapp/packages/plugin-data-viewer/public/icons/plugin_data_viewer_wrap_lines_sm.svg
@@ -0,0 +1 @@
+<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><polygon points="14 3 2 3 2 4.5 14 4.5 14 3 14 3" fill="#338ecc"/><rect x="2" y="12" width="4" height="1.5" fill="#338ecc"/><polygon points="10.54 11.34 9.47 10.28 7 12.75 8.06 13.81 9.47 15.22 10.54 14.16 9.12 12.75 10.54 11.34" fill="#338ecc"/><path d="M11,13.5H8.25V12H11a1.5,1.5,0,0,0,0-3H2V7.5h9a3,3,0,0,1,0,6Z" fill="#338ecc"/></svg>
\ No newline at end of file
diff --git a/webapp/packages/plugin-data-viewer/src/ValuePanelPresentation/TextValue/TextValuePresentation.tsx b/webapp/packages/plugin-data-viewer/src/ValuePanelPresentation/TextValue/TextValuePresentation.tsx
index 739402f509..187e35475b 100644
--- a/webapp/packages/plugin-data-viewer/src/ValuePanelPresentation/TextValue/TextValuePresentation.tsx
+++ b/webapp/packages/plugin-data-viewer/src/ValuePanelPresentation/TextValue/TextValuePresentation.tsx
@@ -204,7 +204,8 @@ export const TextValuePresentation: TabContainerPanelComponent<IDataValuePanelPr
             title={translate(
               lineWrapping ? 'data_viewer_presentation_value_text_line_wrapping_no_wrap' : 'data_viewer_presentation_value_text_line_wrapping_wrap',
             )}
-            name={lineWrapping ? 'img-original-size' : 'img-fit-size'}
+            name={`/icons/plugin_data_viewer_${lineWrapping ? 'no_wrap' : 'wrap'}_lines.svg`}
+            img
             onClick={toggleLineWrappingHandler}
           />
           <Fill />