From 0899b37e9e8316a521b074334443c69a2bcc8d4e Mon Sep 17 00:00:00 2001
From: goodmice <av.sirotkin@autodrilling.ru>
Date: Thu, 18 Nov 2021 10:31:37 +0500
Subject: [PATCH] =?UTF-8?q?=D0=94=D0=BE=D0=B1=D0=B0=D0=B2=D0=BB=D0=B5?=
 =?UTF-8?q?=D0=BD=D0=B0=20=D0=B8=D0=BA=D0=BE=D0=BD=D0=BA=D0=B0=20=D1=81?=
 =?UTF-8?q?=D0=BA=D0=B2=D0=B0=D0=B6=D0=B8=D0=BD=D1=8B=20=D0=B4=D0=BB=D1=8F?=
 =?UTF-8?q?=20WellTreeSelector?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/icons/WellIcon.tsx | 69 +++++++++++++++++++++++++++++++
 1 file changed, 69 insertions(+)
 create mode 100644 src/components/icons/WellIcon.tsx

diff --git a/src/components/icons/WellIcon.tsx b/src/components/icons/WellIcon.tsx
new file mode 100644
index 0000000..02ddfc0
--- /dev/null
+++ b/src/components/icons/WellIcon.tsx
@@ -0,0 +1,69 @@
+import React from 'react'
+
+type WellIconColors = {
+    online?: string
+    active?: string
+    inactive?: string
+    unknown?: string
+}
+
+interface WellIconProps {
+    width?: string | number
+    height?: string | number
+    online?: boolean
+    state?: 'active' | 'inactive' | 'unknown'
+    colors?: WellIconColors
+}
+
+const defaultColors: WellIconColors = {
+    online: 'red',
+    active: 'green',
+    inactive: 'gainsboro',
+    unknown: 'gainsboro',
+}
+
+const defaultProps: WellIconProps = {
+    width: 24,
+    height: 24,
+    state: 'unknown',
+}
+
+export const WellIcon = React.memo(({ width, height, state, online, colors, ...other } : WellIconProps = defaultProps) => {
+    colors = {...defaultColors, ...colors}
+
+    return (
+        <svg
+            version={'1.1'}
+            viewBox={'12 .64 9.2 9.2'}
+            xmlns={'http://www.w3.org/2000/svg'}
+            xmlnsXlink={'http://www.w3.org/1999/xlink'}
+
+            fill={'none'}
+            stroke={'currentColor'}
+            strokeLinecap={'round'}
+            strokeLinejoin={'bevel'}
+            strokeWidth={.26}
+
+            width={width}
+            height={height}
+            color={colors[state ?? 'unknown']}
+            {...other}
+        >
+            <g>
+                <path d={'m12 7.9 2.6-6.6v-1.3h1.3v1.3l2.6 6.6'}/>
+                <path d={'m12 6.4h6.6v-0.53h-6.6z'} fill={'currentColor'}/>
+                <path d={'m14 0.79v0.53h2.9v-0.53z'} fill={'currentColor'}/>
+                <path d={'m12 7.9 5-4-2.4-2.6h1.3l-2.4 2.6 5 4'}/>
+            </g>
+            {online && ( // Полоски, показывающие наличие свежей телеметрии
+                <g stroke={colors.online}>
+                    <path d={'m18 0.066a2 2 0 0 1 0.14 1.7 2 2 0 0 1-1.2 1.2'}/>
+                    <path d={'m20 0.04a3 3 0 0 1-1.8 3.8'}/>
+                    <path d={'m20 0.031a4 4 0 0 1-2.5 4.8'}/>
+                </g>
+            )}
+        </svg>
+    )
+})
+
+export default WellIcon