import {StyleSheet} from 'react-native';
import {
  CONVERSATION_ITEM_AVATAR_SIZE,
  CONVERSATION_ITEM_HEIGHT,
} from '@modules/chats/constants';
import {SPACING} from '@shared/theme';
import {windowDimensions} from '@shared/constants';

import {LEFT_ACTION_WIDTH} from './components/LeftActions';
import {RIGHT_ACTION_WIDTH} from './components/RightActions';

export const styles = StyleSheet.create({
  swipeable: {
    flexDirection: 'row',
    height: CONVERSATION_ITEM_HEIGHT,
    left: -LEFT_ACTION_WIDTH,
    width: windowDimensions.width + LEFT_ACTION_WIDTH + RIGHT_ACTION_WIDTH,
  },
  listItem: {
    height: CONVERSATION_ITEM_HEIGHT,
    paddingHorizontal: SPACING.x2,
    paddingVertical: SPACING.x1,
    width: windowDimensions.width,
  },
  wrapper: {
    flexDirection: 'row',
    flexShrink: 1,
    minHeight: CONVERSATION_ITEM_AVATAR_SIZE,
  },
  avatar: {
    height: CONVERSATION_ITEM_AVATAR_SIZE,
    width: CONVERSATION_ITEM_AVATAR_SIZE,
  },
  descriptionContainer: {flex: 1},
  dateContainer: {
    alignItems: 'flex-end',
    gap: SPACING['x0.5'],
    marginLeft: SPACING.x1,
  },
  indicatorsWrapper: {
    alignItems: 'center',
    flexDirection: 'row',
    gap: SPACING['x0.5'],
  },
});
