Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 | 2x 2x 2x 2x 1x 1x | import { Box, Stack } from "@mui/material";
import GiveText from "@shared/Text/GiveText";
import { useAppTheme } from "@theme/v2/Provider";
import { useConversationContext } from "../ConversationProvider";
import { useCustomThemeV2 } from "@theme/hooks/useCustomThemeV2";
function SubjectInput() {
const theme = useAppTheme();
const { setSubject, subject } = useConversationContext();
const { isMobileView } = useCustomThemeV2();
return (
<Stack
borderBottom={`1px solid ${theme.palette.border?.primary}`}
p={isMobileView ? "20px 20px" : "20px 12px"}
mb="10px"
flexDirection="row"
alignItems="center"
>
<GiveText fontWeight={400} color="secondary" fontSize="14px">
Subject:
</GiveText>
<Box
data-testid="give-conversation-subject-input"
width="100%"
component="input"
value={subject}
onChange={(event: React.ChangeEvent<HTMLInputElement>) => {
const newValue = event.target.value;
setSubject(newValue);
}}
sx={{
fontWeight: 500,
fontSize: "14px",
color: theme?.palette.primitive?.blue[100],
border: "none",
outline: "none",
padding: "0 10px",
fontFamily: theme?.typography?.fontFamily,
"&::placeholder": {
fontSize: "14px",
},
"&:focus": {
outline: "none",
},
}}
/>
</Stack>
);
}
export default SubjectInput;
|