fixed width CSS + hooks and function order

1Hive · Mar 25, 2022 · 6676deb · 6676deb
1 parent 1cade53
commit 6676deb
Showing 1 changed file with 6 additions and 6 deletions.
diff --git a/packages/react-app/src/components/field-input/text-field-input.tsx b/packages/react-app/src/components/field-input/text-field-input.tsx
@@ -22,7 +22,7 @@ const MaxLineStyled = styled.div`
 `;
 
 const BlockStyled = styled.div`
-  width: 100%;
+  ${({ wide }: any) => wide && 'width: 100%;'}
 `;
 
 // #endregion
@@ -69,14 +69,14 @@ export default function TextFieldInput({
 }: Props) {
   const [isEditState, setIsEdit] = useState(isEdit);
 
-  const handlePreview = () => {
-    setIsEdit(!isEditState);
-  };
-
   useEffect(() => {
     setIsEdit(isEdit);
   }, [isEdit]);
 
+  const handlePreview = () => {
+    setIsEdit(!isEditState);
+  };
+
   const readOnlyContent = (
     <>
       {isMarkDown ? (
@@ -129,7 +129,7 @@ export default function TextFieldInput({
     </>
   );
   const loadableContent = isEditState ? (
-    <BlockStyled>
+    <BlockStyled wide={wide}>
       <TextInput
         id={id}
         value={value ?? ''}