From 4bd84bebdaa0c2d82050fbedd1fa8260eb62146d Mon Sep 17 00:00:00 2001
From: Aijana Schumann <aijana.schumann@highstreet-technologies.com>
Date: Thu, 27 Aug 2020 09:01:53 +0200
Subject: Add link calculation app

Add link calculation app to odlux

Issue-ID: CCSDK-2562
Signed-off-by: Aijana Schumann <aijana.schumann@highstreet-technologies.com>
Change-Id: Ifc0a5b2a8bb974dfd85d70a9f05990b1f11925a3
Signed-off-by: Aijana Schumann <aijana.schumann@highstreet-technologies.com>
---
 .../src/components/ifWhenTextInput.tsx             | 73 ++++++++++++++--------
 1 file changed, 47 insertions(+), 26 deletions(-)

(limited to 'sdnr/wt/odlux/apps/configurationApp/src/components/ifWhenTextInput.tsx')

diff --git a/sdnr/wt/odlux/apps/configurationApp/src/components/ifWhenTextInput.tsx b/sdnr/wt/odlux/apps/configurationApp/src/components/ifWhenTextInput.tsx
index 67358885c..62ddeb22d 100644
--- a/sdnr/wt/odlux/apps/configurationApp/src/components/ifWhenTextInput.tsx
+++ b/sdnr/wt/odlux/apps/configurationApp/src/components/ifWhenTextInput.tsx
@@ -24,38 +24,59 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { InputProps } from "@material-ui/core/Input";
 
 const useStyles = makeStyles((theme: Theme) =>
-    createStyles({
-        iconDark: {
-            color: '#ff8800'
-        },
-        iconLight: {
-            color: 'orange'
-        },
-        padding: {
-            paddingLeft: 10,
-            paddingRight: 10
-        },
-    }),
+  createStyles({
+    iconDark: {
+      color: '#ff8800'
+    },
+    iconLight: {
+      color: 'orange'
+    },
+    padding: {
+      paddingLeft: 10,
+      paddingRight: 10
+    },
+  }),
 );
 
-type ifwhenProps = { element: ViewElementBase, id: any, label: any, style: any, helperText: string, error: boolean, toogleTooltip(value: boolean): void, [x: string]: any };
+type IfwhenProps = InputProps & {
+  label: string;
+  element: ViewElementBase;
+  helperText: string;
+  error: boolean;
+  onChangeTooltipVisuability(value: boolean): void;
+};
 
-export const IfWhenTextInput = (props: ifwhenProps) => {
+export const IfWhenTextInput = (props: IfwhenProps) => {
 
-    const { element, toogleTooltip, id, label, helperText: errorText, error, style, ...otherProps } = props;
-    const classes = useStyles();
+  const { element, onChangeTooltipVisuability: toogleTooltip, id, label, helperText: errorText, error, style, ...otherProps } = props;
+  const classes = useStyles();
 
 
-    const ifFeature = element.ifFeature ? <Tooltip onMouseMove={e => props.toogleTooltip(false)} onMouseOut={e => props.toogleTooltip(true)} title={element.ifFeature}><InputAdornment position="start"><FontAwesomeIcon icon={faAdjust} className={classes.iconDark}></FontAwesomeIcon></InputAdornment></Tooltip> : null;
-    const whenFeature = element.when ? (<Tooltip className={classes.padding} onMouseMove={e => props.toogleTooltip(false)} onMouseOut={e => props.toogleTooltip(true)} title={element.when}>
-        <InputAdornment className={classes.padding} position="end"><FontAwesomeIcon icon={faAdjust} className={classes.iconLight}></FontAwesomeIcon></InputAdornment></Tooltip>) : null;
+  const ifFeature = element.ifFeature
+    ? (
+        <Tooltip onMouseMove={e => props.onChangeTooltipVisuability(false)} onMouseOut={e => props.onChangeTooltipVisuability(true)} title={element.ifFeature}>
+          <InputAdornment position="start">
+            <FontAwesomeIcon icon={faAdjust} className={classes.iconDark} />
+          </InputAdornment>
+        </Tooltip>
+      )
+    : null;
 
-    return (
-        <FormControl error={error} style={style}>
-            <InputLabel htmlFor={id} >{label}</InputLabel>
-            <Input  {...otherProps} id={id} endAdornment={<div>{ifFeature}{whenFeature}</div>} />
-            <FormHelperText>{errorText}</FormHelperText>
-        </FormControl>
+  const whenFeature = element.when
+    ? (
+        <Tooltip className={classes.padding} onMouseMove={() => props.onChangeTooltipVisuability(false)} onMouseOut={() => props.onChangeTooltipVisuability(true)} title={element.when}>
+          <InputAdornment className={classes.padding} position="end">
+            <FontAwesomeIcon icon={faAdjust} className={classes.iconLight}/>
+          </InputAdornment>
+        </Tooltip>
+      ) 
+    : null;
 
-    );
+  return (
+    <FormControl error={error} style={style}>
+      <InputLabel htmlFor={id} >{label}</InputLabel>
+      <Input id={id} endAdornment={<div>{ifFeature}{whenFeature}</div>} {...otherProps}  />
+      <FormHelperText>{errorText}</FormHelperText>
+    </FormControl>
+  );
 }
\ No newline at end of file
-- 
cgit 1.2.3-korg