Used prettier

epam · Dec 1, 2021 · 49db909 · 49db909
1 parent 7fd36a7
commit 49db909
Show file tree

Hide file tree

Showing 4 changed files with 123 additions and 58 deletions.
diff --git a/packages/ketcher-react/src/icons/index.tsx b/packages/ketcher-react/src/icons/index.tsx
@@ -217,7 +217,7 @@ const icons = {
   'shape-rectangle': ShapeRectangleIcon,
   'shape-polyline': ShapePolylineIcon,
   'shape-line': ShapeLineIcon,
-  'symbols': Symbols
+  symbols: Symbols
 }
 
 function emptyIcon() {

diff --git a/...r-react/src/script/ui/views/modal/components/Text/SpecialSymbols/SpecialSymbolsButton.tsx b/...r-react/src/script/ui/views/modal/components/Text/SpecialSymbols/SpecialSymbolsButton.tsx
@@ -14,39 +14,45 @@
  * limitations under the License.
  ***************************************************************************/
 
-import {useState} from "react";
-import {SpecialSymbolsList} from "../SpecialSymbolsList/SpecialSymbolsList";
+import { useState } from 'react'
+import { SpecialSymbolsList } from '../SpecialSymbolsList/SpecialSymbolsList'
 import classes from './SpecialSymbolsButton.module.less'
-import Icon from "../../../../../component/view/icon";
+import Icon from '../../../../../component/view/icon'
 
 export interface SpecialSymbolsButtonProps {
-    select: (symbol: string) => void
+  select: (symbol: string) => void
 }
 
-const SpecialSymbolsButton = ({select}: SpecialSymbolsButtonProps) => {
-    const [showSpecialSymbols, setShowSpecialSymbols] = useState(false)
+const SpecialSymbolsButton = ({ select }: SpecialSymbolsButtonProps) => {
+  const [showSpecialSymbols, setShowSpecialSymbols] = useState(false)
 
-    const handleClose = event => {
-        event.stopPropagation()
-        event.preventDefault()
-        setShowSpecialSymbols(false)
+  const handleClose = event => {
+    event.stopPropagation()
+    event.preventDefault()
+    setShowSpecialSymbols(false)
+  }
+  const handleOpen = () => {
+    setShowSpecialSymbols(true)
+  }
+  const closeSymbolsList = event => {
+    if (!event.currentTarget.contains(event.relatedTarget)) {
+      handleClose(event)
     }
-    const handleOpen = () => {
-        setShowSpecialSymbols(true)
-    }
-    const closeSymbolsList = event => {
-        if (!event.currentTarget.contains(event.relatedTarget)) {
-            handleClose(event)
-        }
-    }
-    return (
-        <div onBlur={closeSymbolsList}>
-            <button title='symbols' onClick={handleOpen} className={classes.textButton}>
-                <Icon name='symbols'/>
-                {showSpecialSymbols && <SpecialSymbolsList hideMenu={handleClose} select={select}/>}
-            </button>
-        </div>
-    )
+  }
+  return (
+    <div onBlur={closeSymbolsList}>
+      <button
+        title="symbols"
+        onClick={handleOpen}
+        className={classes.textButton}
+      >
+        <Icon name="symbols" />
+        {showSpecialSymbols && (
+          <SpecialSymbolsList hideMenu={handleClose} select={select} />
+        )}
+      </button>
+    </div>
+  )
 }
 
 export { SpecialSymbolsButton }
diff --git a/...react/src/script/ui/views/modal/components/Text/SpecialSymbolsList/SpecialSymbolsList.tsx b/...react/src/script/ui/views/modal/components/Text/SpecialSymbolsList/SpecialSymbolsList.tsx
@@ -15,28 +15,82 @@
  ***************************************************************************/
 
 import classes from './SpecialSymbolsList.module.less'
-import {SpecialSymbolsButtonProps} from "../SpecialSymbols/SpecialSymbolsButton";
-import React from "react";
+import { SpecialSymbolsButtonProps } from '../SpecialSymbols/SpecialSymbolsButton'
+import React from 'react'
 
-interface SpecialSymbolsListProps extends SpecialSymbolsButtonProps{
-    hideMenu: (event: React.MouseEvent<HTMLButtonElement>) => void
+interface SpecialSymbolsListProps extends SpecialSymbolsButtonProps {
+  hideMenu: (event: React.MouseEvent<HTMLButtonElement>) => void
 }
 
-const SpecialSymbolsList = ({select, hideMenu}: SpecialSymbolsListProps) => {
-    const symbols = [
-        'α', 'β', 'γ', 'δ', 'ε', 'ζ', 'η', 'θ', 'ι', 'κ', 'λ', 'μ', 'ν', 'ξ', 'ο', 'π', 'ρ', 'σ', 'τ', 'υ', 'φ', 'χ', 'ψ', 'ω', '℃', '℉', 'Å', '°', 'ħ', '±', '‰', '√', '←', '→', '↚', '↛', '↔', '⇌', '∏', '∑', '∞', '∂', '∆', '∫', '≈', '≠', '≤', '≥'
-    ]
-    return (
-        <div className={classes.window}>
-            {symbols.map((symbol, id) => {
-                return (
-                    <button className={classes.button} key={`symbol-${id}`} value={symbol} onClick={event => {
-                        select(symbol)
-                        hideMenu(event)
-                    }}>{symbol}</button>
-                )
-            })}
-        </div>
-    )
+const SpecialSymbolsList = ({ select, hideMenu }: SpecialSymbolsListProps) => {
+  const symbols = [
+    'α',
+    'β',
+    'γ',
+    'δ',
+    'ε',
+    'ζ',
+    'η',
+    'θ',
+    'ι',
+    'κ',
+    'λ',
+    'μ',
+    'ν',
+    'ξ',
+    'ο',
+    'π',
+    'ρ',
+    'σ',
+    'τ',
+    'υ',
+    'φ',
+    'χ',
+    'ψ',
+    'ω',
+    '℃',
+    '℉',
+    'Å',
+    '°',
+    'ħ',
+    '±',
+    '‰',
+    '√',
+    '←',
+    '→',
+    '↚',
+    '↛',
+    '↔',
+    '⇌',
+    '∏',
+    '∑',
+    '∞',
+    '∂',
+    '∆',
+    '∫',
+    '≈',
+    '≠',
+    '≤',
+    '≥'
+  ]
+  return (
+    <div className={classes.window}>
+      {symbols.map((symbol, id) => {
+        return (
+          <button
+            className={classes.button}
+            key={`symbol-${id}`}
+            value={symbol}
+            onClick={event => {
+              select(symbol)
+              hideMenu(event)
+            }}
+          >
+            {symbol}
+          </button>
+        )
+      })}
+    </div>
+  )
 }
-export {SpecialSymbolsList}
+export { SpecialSymbolsList }
diff --git a/packages/ketcher-react/src/script/ui/views/modal/components/Text/Text.tsx b/packages/ketcher-react/src/script/ui/views/modal/components/Text/Text.tsx
@@ -24,7 +24,8 @@ import {
   RichUtils,
   convertFromRaw,
   convertToRaw,
-  getDefaultKeyBinding, Modifier
+  getDefaultKeyBinding,
+  Modifier
 } from 'draft-js'
 import { useCallback, useState } from 'react'
 
@@ -36,7 +37,7 @@ import { TextCommand } from 'ketcher-core'
 import classes from './Text.module.less'
 import { connect } from 'react-redux'
 import createStyles from 'draft-js-custom-styles'
-import {SpecialSymbolsButton} from "./SpecialSymbols/SpecialSymbolsButton";
+import { SpecialSymbolsButton } from './SpecialSymbols/SpecialSymbolsButton'
 
 const { styles, customStyleFn } = createStyles(['font-size'])
 
@@ -100,17 +101,21 @@ const Text = (props: TextProps) => {
     setEditorState(state)
   }
 
-  const addText = (value) => {
+  const addText = value => {
     const selection = editorState.getSelection()
-    const contentState = editorState.getCurrentContent();
+    const contentState = editorState.getCurrentContent()
     let nextEditorState
     if (selection.isCollapsed()) {
-      const nextContentState = Modifier.insertText(contentState, selection, value);
+      const nextContentState = Modifier.insertText(
+        contentState,
+        selection,
+        value
+      )
       nextEditorState = EditorState.push(
-          editorState,
-          nextContentState,
-          'insert-characters'
-      );
+        editorState,
+        nextContentState,
+        'insert-characters'
+      )
     }
 
     setEditorState(nextEditorState)
@@ -187,7 +192,7 @@ const Text = (props: TextProps) => {
             />
           )
         })}
-        <SpecialSymbolsButton select={addText}/>
+        <SpecialSymbolsButton select={addText} />
       </ul>
       <div className={classes.textEditorInput}>
         <Editor