| { | { | ||||
| "name": "web", | "name": "web", | ||||
| "version": "4.0.7", | |||||
| "version": "4.0.8", | |||||
| "private": true, | "private": true, | ||||
| "dependencies": { | "dependencies": { | ||||
| "@emotion/react": "^11.5.0", | "@emotion/react": "^11.5.0", |
| interlucator={props?.interlucator} | interlucator={props?.interlucator} | ||||
| exchangeState={props.exchangeState} | exchangeState={props.exchangeState} | ||||
| /> | /> | ||||
| <MessagesList ref={messagesRef}> | |||||
| <MessagesList ref={messagesRef} exchangeState={props?.exchangeState}> | |||||
| {messages?.map((item) => { | {messages?.map((item) => { | ||||
| const isMyMessage = userId === item.userId; | const isMyMessage = userId === item.userId; | ||||
| const image = isMyMessage | const image = isMyMessage |
| import { Box } from "@mui/material"; | import { Box } from "@mui/material"; | ||||
| import styled from "styled-components"; | import styled from "styled-components"; | ||||
| import exchangeStatus from "../../../constants/exchangeStatus"; | |||||
| import selectedTheme from "../../../themes"; | import selectedTheme from "../../../themes"; | ||||
| export const DirectChatContentContainer = styled(Box)` | export const DirectChatContentContainer = styled(Box)` | ||||
| padding: 18px 36px; | padding: 18px 36px; | ||||
| position: relative; | position: relative; | ||||
| max-height: 425px; | max-height: 425px; | ||||
| height: 425px; | |||||
| height: ${(props) => | |||||
| props.exchangeState === exchangeStatus.ACCEPTED || | |||||
| props.exchangeState === exchangeStatus.I_OFFERED | |||||
| ? "385px" | |||||
| : "425px"}; | |||||
| overflow-y: auto; | overflow-y: auto; | ||||
| display: flex; | display: flex; | ||||
| flex-direction: column; | flex-direction: column; |