diff --git a/src/components/organisms/RightSidePanel.tsx b/src/components/organisms/RightSidePanel.tsx index 04e57983..38c633b6 100644 --- a/src/components/organisms/RightSidePanel.tsx +++ b/src/components/organisms/RightSidePanel.tsx @@ -1,5 +1,7 @@ import React, { useState, useCallback } from 'react'; import { Button, Paper, Box, TextField } from "@mui/material"; +import EditIcon from '@mui/icons-material/Edit'; +import TextFieldsIcon from '@mui/icons-material/TextFields'; import styled from "styled-components"; import { SimpleBox } from "../atoms/Box"; import Typography from "@mui/material/Typography"; @@ -8,6 +10,8 @@ import { useActionContext } from '../../context/browserActions'; import { useBrowserSteps } from '../../context/browserSteps'; import { useSocketStore } from '../../context/socket'; import { ScreenshotSettings } from '../../shared/types'; +import InputAdornment from '@mui/material/InputAdornment'; + export const RightSidePanel = () => { const [textLabels, setTextLabels] = useState<{ [id: number]: string }>({}); @@ -97,13 +101,13 @@ export const RightSidePanel = () => { {!getText && !getScreenshot && } - {getText && - <> - - - - - + {getText && + <> + + + + + } {!getText && !getScreenshot && } @@ -130,14 +134,28 @@ export const RightSidePanel = () => { margin="normal" error={!!errors[step.id]} helperText={errors[step.id]} - InputProps={{ readOnly: confirmedTextSteps[step.id] }} + InputProps={{ + readOnly: confirmedTextSteps[step.id], + startAdornment: ( + + + + ) + }} /> + + + ) + }} /> {!confirmedTextSteps[step.id] && (